枣庄住房和城乡建设厅网站,网站文件下载系统,蛋糕店网站设计模板,西安互联网网站建设跨域 什么是跨域#xff1f;非同源限制跨域解决方案CORSJSONP服务器进行第三方代理webscoketwindow.postMessage 什么是跨域#xff1f; 同源策略#xff1a;协议相同、域名相同、端口号相同 的两个页面被认为是同源。 由一个页面的 js 访问不同源的页面内容#xff0c;被… 跨域 什么是跨域非同源限制跨域解决方案CORSJSONP服务器进行第三方代理webscoketwindow.postMessage 什么是跨域 同源策略协议相同、域名相同、端口号相同 的两个页面被认为是同源。 由一个页面的 js 访问不同源的页面内容被认为是跨域跨域是不安全的会被浏览器拦截掉。 非同源限制 无法读取非同源网页的 Cookie、LocalStorage 和 IndexedDB无法接触非同源网页的 DOM无法向非同源地址发送 AJAX 请求 跨域解决方案 CORS CORS 是跨域资源分享Cross-Origin Resource Sharing的缩写。它是 W3C 标准属于跨源 AJAX 请求的根本解决方法。 服务器端对于CORS的支持主要是通过设置Access-Control-Allow-Origin来进行的。如果浏览器检测到相应的设置就可以允许Ajax进行跨域的访问。 response.setHeader(Access-Control-Allow-Credentials, true); JSONP 网页通过添加一个script元素向服务器请求 JSON 数据服务器收到请求后将数据放在一个指定名字的回调函数的参数位置传回来。 script srchttp://test.com/data.php?callbackdosomething/script // 向服务器test.com发出请求该请求的查询字符串有一个callback参数用来指定回调函数的名字// 处理服务器返回回调函数的数据 script typetext/javascriptfunction dosomething(res){// 处理获得的数据console.log(res.data)} /script服务器进行第三方代理 Tipswebpack代理请求proxy代理Nginx代理服务器访问第三方服务器等 webscoket let socket new WebSocket(ws://localhost:3000); socket.onopen function(){socket.send(我叫xxx); } socket.onmessage function(e){console.log(e.data); }window.postMessage Tips它可用于解决以下方面的问题页面和其打开的新窗口的数据传递多窗口之间消息传递页面与嵌套的iframe消息传递 // 父窗口打开一个子窗口 var openWindow window.open(http://test2.com, title);// 父窗口向子窗口发消息(第一个参数代表发送的内容第二个参数代表接收消息窗口的url) openWindow.postMessage(Nice to meet you!, http://test2.com);// 监听 message 消息 window.addEventListener(message, function (e) {console.log(e.source); // e.source 发送消息的窗口console.log(e.origin); // e.origin 消息发向的网址console.log(e.data); // e.data 发送的消息 },false);