資訊專欄INFORMATION COLUMN
摘要：跨域的解決方法使用使用跨域請求資源共享是跨域資源請求機(jī)制，它要求當(dāng)前服務(wù)器存放資源在響應(yīng)的報頭中添加標(biāo)簽從而指定當(dāng)前服務(wù)器可以被跨域訪問服務(wù)器客戶端在前端頁面會顯示但是默認(rèn)的只支持和請求。
同源策略
之所以出現(xiàn)跨域就是因為有同源的限制
同協(xié)議 同域名 同端口 在能獲取資源在同源策略下 域名A下可以訪問域名B下的腳本 css 和圖片 但是A不能向B發(fā)起Ajax請求。
使用CORS（跨域請求資源共享Cross-Origin Resource Sharing）是跨域資源請求機(jī)制，它要求當(dāng)前服務(wù)器（存放資源）在響應(yīng)的報頭中添加 Access-Control-Allow-Origin標(biāo)簽 從而指定當(dāng)前服務(wù)器可以被跨域訪問
res.setHeader("Access-Control-Allow-Origin","*");
服務(wù)器
var http=require("http");
http.createServer(function (req,res) {
res.setHeader("Access-Control-Allow-Origin","*");
res.end("OK");
}).listen(1234);
客戶端
$.ajax({url:"http://127.0.0.1:1234/",success:function (data) {
$("div").text(data)
}})
在前端頁面會顯示 OK
但是 默認(rèn)的cors只支持get和post請求。
關(guān)于 cors的詳細(xì)理解可以查看 我的而另一篇文章 https://segmentfault.com/a/11...
使用postMessage（發(fā)送數(shù)據(jù)）方法和onMessage(接收數(shù)據(jù)) 事件來傳送不同域之間的通信
子頁面
var ifr=window.parent;
var targeOrigin="http://localhost:63342/reactWork";
ifr.postMessage("asa1111",targeOrigin);
父頁面
實現(xiàn)了子頁面向父頁面發(fā)送消息ifr.postMessage()
在父頁面接收消息 window.addEventListener("message",function(){})
WebSocket protocol 是h5的新協(xié)議 實現(xiàn)了瀏覽器與服務(wù)器的雙工通信，同時允許跨域通信
下面是WebSocket同新的例子
sjaisja
客戶端的代碼
var WebSocketServer = require("ws").Server,
wss = new WebSocketServer({ port: 8181 });
wss.on("connection", function (ws) {
console.log("開始連接")
ws.on("message", function (message) {
console.log(111)
ws.send(message)
})
});
nodejs服務(wù)器端的代碼 實現(xiàn)了瀏覽器和服務(wù)器的 等位通信
JSONP主要是利用 Script標(biāo)簽不受同源限制的特性，向跨域服務(wù)器請求發(fā)揮一段JSON數(shù)據(jù)
常規(guī)前后端會約定好某個JSON 請求的callBack包裹起來。進(jìn)而方便服務(wù)器區(qū)分收到的請求，也方便客戶端區(qū)分收到的響應(yīng)。
客戶端
服務(wù)器
var http=require("http");
var urllib=require("url");
var data={"name":"111","addr":"222"};
http.createServer(function (req,res) {
res.writeHead(200,{"Content-type":"text/plain"});
var params=urllib.parse(req.url,true);
if(params.query&¶ms.query.callback){
console.log(params.query,params.query.callback)
var str=params.query.callback+"("+JSON.stringify(data)+")";
console.log(str)
res.end(str);
}else{
res.end(JSON.stringify(data));
}
}).listen(1234)
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://m.hztianpu.com/yun/85039.html
摘要：前言騰訊一面，相比阿里一面來說，騰訊一面先給打電話預(yù)定時間，這也給了我們這些面試者去準(zhǔn)備的時間。其實閉包也就是指有權(quán)訪問另一個函數(shù)作用域的函數(shù)而已。常用的創(chuàng)建閉包的方法就是在函數(shù)內(nèi)部創(chuàng)建另一個函數(shù)。 前言 騰訊一面，相比阿里一面來說，騰訊一面先給打電話預(yù)定時間，這也給了我們這些面試者去準(zhǔn)備的時間。但是也正是因為這種確定性，也有在等待電話的時候的心情的忐忑。 背景 我是一名大三學(xué)生，大一...
摘要：跨域?qū)嵲谑敲嬖嚬僖粋€人的利器。首先，什么是是一個標(biāo)準(zhǔn)，全稱是跨域資源共享。它的值是一個布爾值，表示是否允許發(fā)送。設(shè)為，即表示服務(wù)器明確許可，可以包含在請求中，一起發(fā)給服務(wù)器。 面試問到數(shù)據(jù)交互的時候，經(jīng)常會問跨域如何處理。大部分人都會回答JSONP，然后面試官緊接著就會問：JSONP缺點是什么?。窟@個時候坑就來了，如果面試者說它支持GET方式，然后面試官就會追問，那如果POST方式發(fā)送...
摘要：同源策略是什么跨域通信同源兩個文檔同源需滿足協(xié)議相同域名相同端口相同跨域通信進(jìn)行操作通信時如果目標(biāo)與當(dāng)前窗口不滿足同源條件，瀏覽器為了安全會阻止跨域操作。 同源策略是什么？ javascript跨域通信 同源：兩個文檔同源需滿足 協(xié)議相同 域名相同 端口相同 跨域通信：js進(jìn)行DOM操作、通信時如果目標(biāo)與當(dāng)前窗口不滿足同源條件，瀏覽器為了安全會阻止跨域操作?？缬蛲ㄐ磐ǔＳ幸韵路椒?...
摘要：前言秋招宣告結(jié)束，面試了接近家公司，有幸拿到，感謝這段時間一起找工作面試的朋友和陪伴我的人。一定要提前準(zhǔn)備好，不然面試官叫你說遇到的難點，或者直接問問題時可能會懵逼。 前言 秋招宣告結(jié)束，面試了接近20家公司，有幸拿到offer，感謝這段時間一起找工作面試的朋友和陪伴我的人。這是一段難忘的經(jīng)歷，相信不亞于當(dāng)年的高考吧，也許現(xiàn)在想起來高考不算什么，也許只有經(jīng)歷過秋招的人才懂得找工作的艱辛...
閱讀 3205·2021-11-25 09:43
閱讀 2366·2021-09-07 10:28
閱讀 3916·2021-08-11 11:14
閱讀 2842·2019-08-30 13:49
閱讀 3619·2019-08-29 18:41
閱讀 1232·2019-08-29 11:26
閱讀 2049·2019-08-26 13:23
閱讀 3446·2019-08-26 10:43
