问题：什么是JS的同源策略和跨域问题？

请求跨域问题真的不是不同浏览器造成的！

对应策略：

所谓同源策略，是指浏览器对不同来源的脚本或文本的访问方式所施加的限制。例如，源A的js不能读取或设置引入的源b的元素属性。

意思是两个相同来源的页面有相同的协议，主机(也经常叫域名)、端口、三要素缺一不可。

受同源策略限制的不同源之间的交互主要针对js中的XMLHttpRequest等请求。以下情况完全独立于相应的策略。

1.页面中的链接、重定向和表单提交将不受相应策略的限制。

2.允许跨域资源嵌入。当然，浏览器会限制Javascript读写加载的内容。

跨域问题：

意味着我们需要向不同来源的后台接口发送http请求来请求数据。

vue-cli开发环境的开发肯定会涉及到跨领域的问题。

因为vue-cli开发环境启动了端口号为localhost:的本地节点服务器，所以此时请求数据的接口必须是跨域的。

00-1010 1.在vue-cli项目中，使用node.js代理服务器实现跨域请求。

2.当服务器响应客户端时，带来访问控制允许源： *头信息[推荐]

3.通过jquery的jsonp形式解决跨域问题。

详细说明：

1.在vue-cli项目的config文件夹下的index.js配置文件中，配置dev对象的proxyTable对象，通过node.js的代理服务器可以实现跨域请求

dev: {

env:要求('。/dev.env ')，

端口： 8080，

autoOpenBrowser:真，

assets子目录： '静态'，

assetpublicath : '/'，

proxyTable: { }，

cssSourceMap: false

}

但是这种解决方案只适用于解决vue-cli开发环境中的跨域问题，如果生产环境中涉及跨域问题，还没有解决。

2.以java代码为例设置http请求的响应头。建议使用：

公共类testFilter实现了Filter {

公共void doFilter(ServletRequest请求、ServletResponse响应、FilterChain链)

引发IOException，ServletException {

httpersvletresponse=(httpersvletresponse)resp；

response . setheader(' Access-Control-Allow-Origin '，' * ')；//解决跨域访问错误

response.setHeader('访问控制-允许-方法'，' POST，PUT，GET，OPTIONS，DELETE ')；

response.setHeader('访问控制-最大年龄'，' 3600 ')；//设置到期时间

response.setHeader('访问控制-允许-头'，'来源，X-请求-与，内容-类型，接受，客户端_id，uuid，授权')；

response . setheader(' Cache-Control '，'无缓存，无存储，必须重新验证')；//支持HTTP 1.1。

response.setHeader('Pragma '，'无缓存')；//支持HTTP 1 . 0 . response . setheader(' expires '，' 0 ')；

chain.doFilter(req，RES)；

}

3.jQuery跨域设置ajax请求：

$.Ajax({ 0

“网址：”./data.js '，//可能不是本地域名。

键入：'get '，

DataType:'jsonp '，//jsonp格式访问

jsoncallback : ' aa '//函数获取数据

})

案例：