2018最新前端面试题七-js教程-PHP中文网

这次给大家带来2018最新前端面试题，我们知道在前端工作中面试是必不可少的一部分，这次的前端面试常考问题分类整理汇总就是来帮助大家度过前端面试着一大难关。一起来看一下。

【相关推荐：前端面试题（2020）】

一、什么是跨域资源共享 (CORS)？它用于解决什么问题？

默认情况下，为预防某些而已行为，浏览器的XHR对象只能访问来源于同一个域中的资源。但是我们在日常实际开发中，常常会遇到跨域请求的需求，因此就出现了一种跨域请求的方案：CORS（Cross-Origin Resource Sharing）跨域资源共享。CORS背后的原理是：使用自定的HTTP头部与服务器进行沟通，从而由服务器决定响应是否成功。
如何使用CORS？
使用CORS需要客户端和服务端两者配合。
1、客户端如何发起CORS跨域请求？
目前在大多数浏览器下(CORS在各浏览器下支持情况)，都原生支持CORS，代码编写时和同域的请求差不多，只需要在xhr.open()的时候传入绝对URL即可。例如：

var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function () {    if(xhr.readyState == 4){        if(xhr.status >= 200 && xhr.status < 300 || xhr.status == 304){            console.log(xhr.responseText)
        }else {            console.log('err' + xhr.status);
        }
    }
};
xhr.open('get','http://www.xxx.com/api/something/',true);
xhr.send(null);

这样就可以发送一个跨域请求了，但是如果只是如上面示例代码一样发送的话会报错，因为服务器并未设置允许我们这个请求，因此CORS还需要服务端来配合。
2、服务器如何允许客户的CORS跨域请求？
服务器只需要在响应头部中设置Access-Control-Allow-Origin即可让客户端访问。
假设客户端的域名是http://www.xxx.com，那么服务端只要在Access-Control-Allow-Origin的设置中含有http://www.xxx.com，那么这个CORS请求即可成功。如果Access-Control- Allow-Origin设置为*，那么任意域名都可以访问这个服务端，但是为了安全起见，一般并不建议这样做。

立即学习“前端免费学习笔记（深入）”；

相信看了本文案例你已经掌握了方法，更多精彩请关注php中文网其它相关文章！