一、什么是ajax
Async Javasrcipt and XML,用于向服务端发起请求,可以局部更新页面,可以避免一直刷新页面。
二、怎么用ajax
ajax请求可以是同步的也可以是异步的。有多种请求方式,不同方式传参数方法不一样。
写一个简易ajax请求(可以结合es6提供的异步解决方案)
function fetchData(url){
let p = new Promise((resolve, reject)=>{
let xhr = new XMLHttpRequest();
xhr.open('post',url,true);
xhr.setHttpHeader('content-type','jason')
xhr.onreadystatechange = function(){
if(xhr.readystate === 4){
if(xhr.status === 200 ){
resolve(xhr.responseText)
}else if(xhr.status === 404){
reject( new Error('404 not found') )
}
}
}
xhr.send('keyword=frank')
})
return p
}
let myPromise = fetchData('url');
myPromise.then((value)=>{
console.log(value)
}).catch((reason)=>{
console.log(reason)
})
三、常见http状态码
1、200交互成功
2、3xx:
(1)301永久重定向
(2)302临时重定向(cas登录成功后)
(3)304资源为发生变化,浏览器读取缓存
3、4xx
(1)404 not found
(2)403 未登录
(3)401 unauthorized 未通过认证
4、5xx 服务器端错误
四、跨域
1、浏览器为了安全考虑,会执行同源限制(协议、域名、端口),服务端之间不存在该限制
2、前端的图片、css、js加载不受该规则限制
3、前端解决跨域方法:
(1)jsonp:利用script标签发出请求,绕过跨域
(2)服务器端设置响应头 Access-Control-Allow-Origin ,浏览器就不会拦截响应内容了