上传图片,Not allowed to load local resource,springboot上传

最近朋友找我,帮她做一个招聘的网站的demo,本来是不想做的,谁让是一个美女呢,没办法, 程序猿嘛,看见美女就.嘻嘻.哦!扯远了,话不多说直接就上.

1.所需要pom依赖有:

<groupId>commons-fileupload</groupId>
<artifactId>commons-fileupload</artifactId>
<version>1.3.3</version>
</dependency>

<dependency>
<groupId>commons-io</groupId>
<artifactId>commons-io</artifactId>
<version>2.4</version>
</dependency>

</dependency>

2.前端代码
2.1 html 代码

2.2 js代码

// 上传照片
$('#uploadPic').on('change', function() {
var a = $("#uploadPic").get(0).files[0];
if(a.size>1048576){
layer.msg("上传的图片过大,请处理后在上传....");
return;
}
var option = {
url : "../upload/uploadPic",
type : "post",
dataType : "json",
success : function(data) {
if(data.code!=1000){
layer.msg(data.msg);
}else{
// 对data操作
// 1、图片回显
$("#allUrl").attr("src", data.allUrl);
// 2、设置隐藏域的值
$("#imgUrl").val(data.imgUrl);
}
}
}
$("#jvForm").ajaxSubmit(option);//form表单提交, 如果没用就按照你自己的提交方式就行
})

3.java代码

/**
*
* @author j_cxn
* @description : [上传图片]
*
* @时间: 2017年11月10日上午10:25:08
*/
@Controller
@RequestMapping("/upload")
public class UploadController {

@RequestMapping("/uploadPic")
public void uploadPic(MultipartFile pic,HttpServletRequest request, HttpServletResponse response){
JSONObject jsonObject = new JSONObject();
try {
// 图片改名
String filename = pic.getOriginalFilename();
// 后缀无"."
String suffix = FilenameUtils.getExtension(filename);
//uuid,给上传图片重新起名字
String uuid = UUID.randomUUID().toString().replace("-", "");
String newName = uuid + "." + suffix;
//照片大小
long size = pic.getSize();
if(size>=1048576){
jsonObject.put("msg", "图片过大");
jsonObject.put("code", 500); // 保存图片地址
}else{
String realPath = "D:\\imagesuuuu\\";
String imgUrl = realPath + newName; // 相对路径 ,这里没有图片服务器,所以就先放到本地, 如果有图片服务器就用图片服务器
// 上传
pic.transferTo(new File(imgUrl));

// 回显图片
jsonObject.put("allUrl", "../images/"+newName);
jsonObject.put("imgUrl", "../images/"+newName); // 保存图片地址
jsonObject.put("code", 1000); // 保存图片地址
response.setContentType("application/json;charset=UTF-8");
response.getWriter().write(jsonObject.toString());
}
} catch (Exception e) {//异常处理
try {
jsonObject.put("code", 500); // 保存图片地址
jsonObject.put("msg", "图片过大");
e.printStackTrace();
} catch (JSONException e1) {
e1.printStackTrace();
}
}

}

4.如果存放到本地的话, 回显图片的时候就会遇到问题Not allowed to load local resource

因为浏览器会保护,不允许家在本地,这就就的我们自己弄一个虚拟路径,查了一些资料找到了解决办法如下:

5.虚拟文件,将本地文件虚拟成系统文件

5.1java代码:

@Configuration
public class WebAppConfig extends WebMvcConfigurerAdapter {
// 获取配置文件中图片的路径
@Value("${cbs.imagesPath}")
private String mImagesPath;

// 访问图片方法
@Override
public void addResourceHandlers(ResourceHandlerRegistry registry) {
if (mImagesPath.equals("") || mImagesPath.equals("${cbs.imagesPath}")) {
String imagesPath = WebAppConfig.class.getClassLoader().getResource("").getPath();
if (imagesPath.indexOf(".jar") > 0) {
imagesPath = imagesPath.substring(0, imagesPath.indexOf(".jar"));
} else if (imagesPath.indexOf("classes") > 0) {
imagesPath = "file:" + imagesPath.substring(0, imagesPath.indexOf("classes"));
}
imagesPath = imagesPath.substring(0, imagesPath.lastIndexOf("/")) + "/images/";
mImagesPath = imagesPath;
}
LoggerFactory.getLogger(WebAppConfig.class).info("imagesPath=" + mImagesPath);
registry.addResourceHandler("/images/**").addResourceLocations(mImagesPath);
super.addResourceHandlers(registry);
}

5.2application.properties文件

cbs.imagesPath=file:/D:/imagesuuuu/

这样就将d盘中的imagesuuuu文件夹虚拟成本系统中的images,项目结构

6.效果展示

图片位置不在系统中,而是在本地的D盘

git地址:https://github.com/MrCXN/parttime

如有问题请评论,会及时回复的.

上传图片,Not allowed to load local resource,springboot上传相关推荐

Chrome无法打开文件的错误 [Not allowed to load local resource: file://XXXX]
问题描述  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional// ...
Not allowed to load local resource: file:///,浏览器禁止访问浏览器图片，文件解决方法
Not allowed to load local resource: file- 错误出现原因:浏览器出于安全考虑禁止直接读取本机文件(链接以file:///开头), 解决办法: 创建一个web服务 ...
浏览器报错Not allowed to load local resource:的解决办法,与网上大多数都不同,亲测有用！
浏览器报错Not allowed to load local resource:的解决办法,与网上大多数都不同,亲测有用! 起因报错原因吐槽解决办法参考起因因为深度学习用的是pytorch ...
解决 Not allowed to load local resource 问题
今天在写KindEditor的上传文件时遇到了这个问题 Not allowed to load local resource 参考了晚上的资料后发现其中一个解决方法是把放回的绝对路径改为相对路径即可 ...
springboot整合pdfobject 预览pdf文件出现 Not allowed to load local resource : file:///c:/xxxx.pdf 报错的问题解决
浏览器不允许直接访问本地文件解决:设置springboot虚拟目录 @Configuration public class WebMvcConfig extends WebMvcConfigurer ...
SpringBoot+Vue项目中遇到Not allowed to load local resource图片路径问题的两种解决方案（在后端映射本地路径或将图片转base64返回给前端）
一.报错截图第一种解决方案后端映射本地路径编写MyConfig类 Java代码[MyWebConfig] package com.wechat.front.utils;import org.sp ...
解决img标签src路径为本地路径访问受限问题:Not allowed to load local resource
随笔记录:遇到img标签想显示本地路径下的图片资源.谷歌浏览器不支持访问,找不到好的解决办法决定换个思路. img标签可显示base64转码的图片.将本地图片先进行base64转码,之后再img标签 ...
springboot上传下载文件（4）--上传下载工具类（已封装）
因为在做毕设,发现之前的搭建ftp文件服务器,通过ftp协议无法操作虚拟机临时文件,又因为ftp文件服务器搭建的比较麻烦:而 hadoop的HDFS虽然可以实现,但我这里用不到那么复杂的:所以我封装了 ...
springboot上传文件到阿里云
springboot上传文件到OSS 前提声明,文章借鉴了https://blog.csdn.net/wonder_dog/article/details/81152307#commentsedit博 ...

上传图片,Not allowed to load local resource,springboot上传

上传图片,Not allowed to load local resource,springboot上传相关推荐

最新文章

热门文章