关于Not allowed to load local resource: file:///D:/Users/xxxx/xx/big-event/xxx/xxx/xxx 解决办法

最近在看黑马程序员的springboot3+vue3的视频,在对文章图片进行上传时发现一个问题,按照他视频里来的话应该是要从阿里云里获取图片,但由于申请阿里云有一些限制,于是我就放在自己本地,但按照他视频来的话,我们返回的是一个本地的地址D:/Users/xxxx/xx/big-event/xxx/xxx/xxx,由于浏览器的安全限制,导致无法进行回显

在网上找了一圈解决方法,比如设置成静态资源啥都不好使,最后我抱着试一试的心态去element-plus官网,试了一下新的文件上传代码,结果就可以了

不过要注意的是,在导入上面那个文件时会报错误,原因是要加上lang='ts'

之后就是把里面的参数替换成我们需要的就可以了

当遇到 "Not allowed to load local resource" 的错误时,原因通常是由于浏览器的安全策略限制,它不允许可能性地从本地文件系统加载资源,特别是对于来自非HTTPS源的内容。这通常发生在开发阶段,当你的应用程序运行在本地服务器(如Tomcat或Spring Boot)而非正式部署环境中。 解决方案包括: 1. **配置虚拟路径**[^1]: 使用Web框架(如Spring MVC)的资源配置功能,将本地文件夹映射到一个虚拟URL。这样,你可以通过这个虚拟路径访问本地资源,示例代码如`MyConfig`类所示: ```java @Configuration public class MyConfig implements WebMvcConfigurer { @Override public void addResourceHandlers(ResourceHandlerRegistry registry) { registry.addResourceHandler("/product/**") .addResourceLocations("file:D:/secondhansImage/"); } } ``` 2. **前端处理**[^2]: 如果你在Vue应用中遇到此问题,可以在JavaScript层面尝试修改图片的src属性,使其指向服务器地址而不是本地文件。例如,如果你有后端API可以提供图片,那么应该使用API URL。 3. **服务器配置**: 对于Spring Boot项目,可以创建一个拦截器配置类(如`InterceptorConfig`),来设置资源处理器,以便访问本地文件。这需要后端支持,例如: ```java @Configuration public class InterceptorConfig implements WebMvcConfigurer { @Override public void addResourceHandlers(ResourceHandlerRegistry registry) { registry.addResourceHandler("/image/**") .addResourceLocations("file:/D:/image/"); } } ``` 然而,重要的是要理解,这些方法仅适用于开发环境。在生产环境下,你应该确保所有资源都在服务器的正常域名下托管,以避免安全风险。 相关问题: 1. 如何在实际部署后解决这类本地资源访问问题? 2. 如何在不改变现有架构的情况下,在测试环境中临时启用本地资源访问? 3. 是否有其他替代方法,比如使用Nginx反向代理?
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值