前端頁面訪問第三方資源出現跨域問題


在開發功能時,獲取第三方資源無法正常加載,導致圖層無法正常顯示,截圖如下:

 

 

 

 Access to fetch at 'https://t7.tianditu.com/DataServer?T=vec_w&x=53547&y=28548&l=16&tk=0936715ab810df3a3bc32d22ab83edd9' from origin 'http://127.0.0.1:8021' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

根據控制台報錯發現是出現了跨域請求。

 

資料鏈接:https://www.jianshu.com/p/89a377c52b48

http://www.ruanyifeng.com/blog/2016/04/cors.html

https://www.cnblogs.com/itmacy/p/6958181.html

https://developer.mozilla.org/zh-CN/docs/Web/HTTP/CORS/Errors

 

解決方式:

在后端XSSFILTER過濾器中將該資源提供方地址納入可信地址,修改響應報文頭安全策略。

        res.setHeader("Content-Security-Policy", "default-src *; style-src 'self' 'unsafe-inline'; img-src data: * ; worker-src 'self' blob: http://www.tianditu.gov.cn https://www.tianditu.gov.cn ;script-src 'self' http://www.tianditu.gov.cn https://www.tianditu.gov.cn 'unsafe-inline' 'unsafe-eval' pub.mypy.cn res.wx.qq.com weixin://resourceid/");

 

 

訪問正常:

 


免責聲明!

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



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