ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

解决前端访问本地资源图片显示Not allowed to load local resource的问题

2021-12-17 14:34:36  阅读:293  来源: 互联网

标签:load addResourceHandler resource 映射 image 路径 访问 allowed addResourceLocations


本人使用的是前后端分离的项目 React+SpringBoot,想前台访问本地的图片但是却显示这个错,(mac电脑)

 

这个地址是直接存在了数据库里,然后前端拿到的。

这个地方我犯了个致命的错误,浏览器是不能直接访问本地资源的,也是出于安全考虑,如果浏览器可以直接访问本地的话,那也是一件很可怕的事情。

所以:需要使用虚拟路径进行映射,在后端加映射路径的代码。

1.  addResourceHandler代表你要访问的路径,addResourceLocations代表你的图片真实存在的路径,意思就是:image代替了/Users/yuan/workspace-idea/images/的路径

 1 @Configuration
 2 public class WebConfig implements WebMvcConfigurer {
 3 
 4         @Override
 5         public void addResourceHandlers(ResourceHandlerRegistry registry) {
 6             /**
 7              * 资源映射路径
 8              * addResourceHandler:访问映射路径
 9              * addResourceLocations:资源绝对路径
10              */      registry.addResourceHandler("/image/**").addResourceLocations("file:/Users/yuan/workspace-idea/images/");
11         }
12 
13 }

2.很多网上的教程一般就讲到这里,但是具体的访问路径却没说,所以最终访问图片的虚拟路径是:http://localhost:8080/video/image/u1.jpg

3.http://localhost:8080:输入你自己的ip地址和端口,video:是我自己配置的访问路径(没配置就不用写)

 

这样就大功告成啦!希望可以解决你的问题~

 

标签:load,addResourceHandler,resource,映射,image,路径,访问,allowed,addResourceLocations
来源: https://www.cnblogs.com/yystudyhard/p/15702176.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有