报CORS 跨域错误,提示 blocked by CORS policy" type="hidden"/>

前后端分离 导致的 静态页面 加载

比如我有个html 和 js 文件 ,放在桌面的一个文件中,正常html加载本地 js 是可以的 ,但是如果引入的类型是 

<script type="module" >
,这倒好,直接报错

 

 

 百度找到了很多方法,虽然可以解决,但是要么是麻烦,要么就是不适合发布使用,总不能让客户修改浏览器权限吧?

怎么办?
好办,使用nginx

只需要在nginx.conf 文件配置一下监听端口和路由参数,将符合获取静态文件的请求路由到本地静态文件即可

 

 

 

 

 

 

 我要访问本地的       D:/我的项目/static/js/ j1.js

假设监听的端口为55

那么访问 localhost:55/js/j1.js

即可

也就是说,把所有获取静态文件的接口都用nginx来路由,

对于nginx来说,这些静态文件位置可以随意放置,

但是对于浏览器来说,这些静态文件都是存在  localhost:55 的地方,也就是同源资源,不会再报 CORS 跨域,

也适合发布生产,如果需要替换文件,直接替换就行了,不需要打包编译,不需要解码,适合各种服务器,

虽然.net 容器也有类似的功能,但是相对麻烦一点,体积也膨大,需要配置很多东西,不像nginx解压就能用

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



猜您在找 axios 访问本地文件 报跨域错误 from origin 'null' has been blocked by CORS policy 报跨域错误:Access to XMLHttpRequest at 'http://localhost:9990/' from origin 'http://IP:Port' has been blocked by CORS policy...more-private address space `local` 实现前后端分离的跨域访问(CORS) 跨域详解 been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource 跨域详解 been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource 前后端分离解决跨域cors问题 [Nginx] 解决跨域been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. 跨域问题解决Access to image at 'file:///png' from origin 'null' has been blocked by CORS policy Vue-Socket.io跨域问题 has been blocked by CORS policy: No 'Access-Control-Allow-Origin' Mentalflow解决思路 JAVA拦截器,JAVA返回结果跨域问题解决-has been blocked by CORS policy
 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM