解決跨域No 'Access-Control-Allow-Origin' header is present on the requested resource.


用angular發起http.get(),訪問后端web API要數據,結果chrome報錯:跨域了

Access to XMLHttpRequest at 'http://127.0.0.1:3000/XXX' 
from origin 'http://127.0.0.1:4200' has been blocked by CORS policy:
No 'Access-Control-Allow-Origin' header is present on the requested resource.

此時后端nodejs顯示返回值正常。只是瀏覽器給攔截了。

 

參考https://www.cnblogs.com/relucent/p/4274158.html

什么是跨域

當兩個域具有相同的協議(如http), 相同的端口(如80),相同的host(如www.google.com),那么我們就可以認為它們是相同的域(協議,域名,端口都必須相同)。

跨域就指着協議,域名,端口不一致,出於安全考慮,跨域的資源之間是無法交互的

 解決方法很簡單,在服務器端的response里添加header,允許前端指定的主機訪問

具體到express 參考 https://www.cnblogs.com/ae6623/p/4433143.html

app. route( "/XXX")
  . get(jsonParser, ( req, res) => {
    //do something
    const content = 'OK'
    res.set({'Access-Control-Allow-Origin': 'http://127.0.0.1:4200'})
      .send(content)
  })


注意要包括 http://,和端口號,最好把這些寫在一個配置文件里,在nodejs啟動時加載進來,便於在docker等容器里用的時候修改前端的IP和端口


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM