欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

http頭部字段Origin和Access-Control-Allow-Origin解決請(qǐng)求跨域

 更新時(shí)間：2023年06月25日 14:36:18   作者：一顆冰淇淋  
這篇文章主要為大家介紹了http頭部字段Origin和Access-Control-Allow-Origin解決請(qǐng)求跨域示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪

Http協(xié)議中請(qǐng)求頭和響應(yīng)頭

Http協(xié)議中請(qǐng)求頭和響應(yīng)頭攜帶了很多信息，其中 請(qǐng)求頭 Origin，響應(yīng)頭 Access-Control-Allow-Origin 與跨域有關(guān)。

為了驗(yàn)證跨域，要將客戶端和服務(wù)端分配在不同端口，這里通過(guò) nodejs 在8080端口起一個(gè)服務(wù)，用于響應(yīng)客戶端的請(qǐng)求

const http = require('http');
const server = http.createServer((req,res)=>{
    res.end('hello 8000~')
});
server.listen(8000,()=>{
    console.log('監(jiān)聽(tīng)8000端口')
})

如果通過(guò)瀏覽器url上直接輸入地址訪問(wèn)，響應(yīng) hello 8080~

8080端口起的服務(wù)

客戶端新建 html 頁(yè)面，發(fā)送 get 請(qǐng)求向本地的 8080 端口

<script>
    const url = 'http://127.0.0.1:8000'
    fetch(url).then(res=>{
        console.log('請(qǐng)求結(jié)果',res)
    })
</script>

再通過(guò)5500端口打開(kāi)頁(yè)面，會(huì)發(fā)現(xiàn)請(qǐng)求發(fā)送失敗，控制臺(tái)報(bào)錯(cuò)【被跨域策略阻止了】

跨域

通過(guò)查看請(qǐng)求信息可以發(fā)現(xiàn)，請(qǐng)求頭部字段 Origin 標(biāo)識(shí)著當(dāng)前請(qǐng)求url

請(qǐng)求頭origin

同域下才可以發(fā)送異步請(qǐng)求，是瀏覽器的保護(hù)策略，在響應(yīng)頭告知瀏覽器哪些來(lái)源允許跨域，則可以不受瀏覽器的限制。

const server = http.createServer((req,res)=&gt;{
    res.setHeader("Access-control-allow-origin","http://127.0.0.1:5500")
    res.end('hello 8000~')
});

再次發(fā)送get請(qǐng)求，就可以響應(yīng)頭上增加了Access-control-allow-origin屬性，并且請(qǐng)求成功，返回200的狀態(tài)碼

響應(yīng)成功

以上就是http頭部字段Origin和Access-Control-Allow-Origin解決請(qǐng)求跨域的詳細(xì)內(nèi)容，更多關(guān)于http解決請(qǐng)求跨域的資料請(qǐng)關(guān)注腳本之家其它相關(guān)文章！

相關(guān)文章

最新評(píng)論