一些常见问题总结(1)

186 阅读2分钟

1. 用户从输入url到显示页面这个过程发生了什么

DNS解析

TCP连接

发送HTTP请求

服务器处理请求并返回HTTP报文

浏览器解析渲染页面

连接结束

2. JSONP的缺点

JSON只支持get,因为script标签只能使用get请求; JSONP需要后端配合返回指定格式的数据。

3. 跨域(jsonp,ajax)

JSONP:ajax请求受同源策略影响,不允许进行跨域请求,而script标签src属性中的链接却可以访问跨域的js脚本,利用这个特性,服务端不再返回JSON格式的数据,而是返回一段调用某个函数的js代码,在src中进行了调用,这样实现了跨域

4. ajax返回的状态

0 - (未初始化)还没有调用send()方法 1 - (载入)已调用send()方法,正在发送请求

2 - (载入完成)send()方法执行完成,已经接收到全部响应内容

3 - (交互)正在解析响应内容

4 - (完成)响应内容解析完成,可以在客户端调用了

5. 实现一个Ajax

AJAX创建异步对象XMLHttpRequest

操作XMLHttpRequest 对象

(1)设置请求参数(请求方式,请求页面的相对路径,是否异步)

(2)设置回调函数,一个处理服务器响应的函数,使用 onreadystatechange ,类似函数指针

(3)获取异步对象的readyState 属性:该属性存有服务器响应的状态信息。每当 readyState 改变时,onreadystatechange 函数就会被执行。

(4)判断响应报文的状态,若为200说明服务器正常运行并返回响应数据。

(5)读取响应数据,可以通过 responseText 属性来取回由服务器返回的数据。

var xhr = new XMLHttpRequest();
xhr.open('get', 'aabb.php', true);
xhr.send(null);
xhr.onreadystatechange = function() {
if(xhr.readyState==4) {
if(xhr.status==200) {
console.log(xhr.responseText);
}
}
}