ajax
ajax是一种创建交互式网页应用的网页开发技术
在网页不刷新的情况下，可以请求数据然后实现网页局部刷新或者渲染
?ajax的原理：通过XMLHttprequest对象向服务器发异步请求，从服务器获取数据后，然后用JavaScript来操作DOM而更新页面
如何创建一个原生ajax
ajax 核心对象 XMLHttpRequest对象
// 1. 创建一个XMLHttpRequest的实例 xhr
let xhr = new XMLHttpRequest();
// 2. 为xhr.onreadystatechange设置事件监听
xhr.onreadystatechange = function () {
// xhr.readyState
// 0 请求未初始化(刚实例化XMLHTTPRequest)
// 1 客户端和服务器建立连接(调用open方法)
// 2 请求已经被接受
// 3 请求在处理中(调用send方法)
// 4 处理完成,返回数据给客户端
if (xhr.readyState === 4) {
switch (xhr.status) {
case 200 :
console.log(JSON.parse(xhr.responseText));
break
case 404:
console.log('页面 / 资源找不到');
break;
}
}
}
// 3. 调用xhr.open(请求方式。请求地址，同步异步)
xhr.open('GET','url',false)
// 4. 发送请求的数据
xhr.send(null)
Http常见的状态码
- 200 请求成功，浏览器会把响应体内容显示在浏览器中；
- 404 (客服端问题)请求的资源没有找到；
- 400 语义错误，当前请求无法被服务器理解；
- 401 当前请求需要用户验证；
- 403 服务器已经理解请求，但是拒绝执行它；
- 500 (服务器问题）请求资源找到了，但服务器内部发生了不可预期的错误；
- 301/302/303 重定向问题；
同源和跨域
?同源
一个域下的js脚本在未经允许的情况下，不能够访问另一个域的内容。
两个域的协议，域名，端口号必须相同，否则不属于同一个域
同源策略的目的就是为了保证用户信息的安全，防止恶意的网站窃取数据
?跨域(非同源)
当一个请求url的协议，域名，端口三者之间任何一个域当前页面的url不同就是跨域
协议(http / https / ftp / smtp / pop3)
域名(www.一级域名.二级域名.顶级域名(org/com/cn/edu/gov)) /路径/路径
端口号(http:80/https:443)
|