java实现后台图片跨域上传功能的实例讲解

  • 更新时间:2020-04-17 08:08:42
  • 编辑:文正豪

跨域的原因

在项目开发的过程中,我们经常需要用到图片上传操作,传统的做法是我们将其上传到项目的所在目录中,比如说项目的target目录中,但是由于项目在重启的过程中,target文件夹下的内容会被全部清空,这意味着如果采用这种方式,那么在测试环境与开发环境;在每一次的项目重启的过程中,我们经常会遭遇图片丢失的情况,这种情况有时往往很让人头疼,因而有一个图片服务器对于项目的开发和测试而言,这是十分必要的。

跨域的实现原理

在采用图片服务器的情况下,我们只需要像往常一样,由前台界面将图片上传到本地项目服务器中,然后本地的项目服务器会将该图片的数据流写入到远程的图片服务器中,由远程的图片服务器负责图片的存储,最后,远程的图片服务器会返回一个存储图片路径,在本地的服务器只需要存储该路径,在页面展示的时候,只需要在前台将该图片路径展示出来,即可完成对于远程图片服务器的调用。

本地服务器源码

@ResponseBody
 @RequestMapping(value="/imgUpLoadNewOneKuaYu")
 public String imgUpLoadNewOneKuaYu(HttpServletRequest request) throws IOException {
   String urlStr = "http://localhost:9080/no-js/admin/upload";
   Map<String, String> textMap = new HashMap<String, String>(); 
   MultipartHttpServletRequest multiRequest = (MultipartHttpServletRequest) request;//流的数据*
   //取得request中的所有文件名 
    Iterator<String> iter = multiRequest.getFileNames(); 
    Map<String, InputStream> fileMap = new HashMap<String, InputStream>();
    if(iter.hasNext()){ 
     //取得上传文件 
     MultipartFile file = multiRequest.getFile(iter.next()); 
     if(file != null){ 
      //取得当前上传文件的文件名称 
      String myFileName = file.getOriginalFilename();
      InputStream fileInputStream=file.getInputStream(); 
      fileMap.put(myFileName, fileInputStream); 
     }
    }
   String ret = FileUpLoadNew.formUpload(urlStr, textMap, fileMap);
   System.out.println(ret);
   return ret;
 }

FileUpLoadNew

package net.sahv.bdyz.util;

import java.io.BufferedReader;
import java.io.DataInputStream;
import java.io.DataOutputStream;
import java.io.FileInputStream;
import java.io.InputStream;
import java.io.InputStreamReader;
import java.io.OutputStream;
import java.net.HttpURLConnection;
import java.net.URL;
import java.util.Iterator;
import java.util.Map;

public class FileUpLoadNew {

 /**
  * @param urlStr
  * @param textMap
  * @param fileMap
  * @return
  */
 public static String formUpload(String urlStr, Map<String, String> textMap, Map<String, InputStream> fileMap) {
  String res = "";
  HttpURLConnection conn = null;
  String BOUNDARY = "---------------------------123821742118716"; //boundary就是request头和上传文件内容的分隔符
  try {
   URL url = new URL(urlStr);
   conn = (HttpURLConnection) url.openConnection();
   conn.setConnectTimeout(5000);
   conn.setReadTimeout(30000);
   conn.setDoOutput(true);
   conn.setDoInput(true);
   conn.setUseCaches(false);
   conn.setRequestMethod("POST");
   conn.setRequestProperty("Connection", "Keep-Alive");
   conn.setRequestProperty("User-Agent", "Mozilla/5.0 (Windows; U; Windows NT 6.1; zh-CN; rv:1.9.2.6)");
   conn.setRequestProperty("Content-Type", "multipart/form-data; boundary=" + BOUNDARY);
   OutputStream out = new DataOutputStream(conn.getOutputStream());
   // textMap:如果传送的是文本内容
   if (textMap != null) {
    StringBuffer strBuf = new StringBuffer();
    Iterator<Map.Entry<String, String>> iter = textMap.entrySet().iterator();
    while (iter.hasNext()) {
     Map.Entry<String, String> entry = iter.next();
     String inputName = (String) entry.getKey();
     String inputValue = (String) entry.getValue();
     if (inputValue == null) {
      continue;
     }
     strBuf.append("\r\n").append("--").append(BOUNDARY).append("\r\n");
     strBuf.append("Content-Disposition: form-data; name=\"" + inputName + "\"\r\n\r\n");
     strBuf.append(inputValue);
    }
    out.write(strBuf.toString().getBytes());
   }
   //fileMap:如果传送的是文件流
   if (fileMap != null) {
    Iterator<Map.Entry<String, InputStream>> iter = fileMap.entrySet().iterator();
    while (iter.hasNext()) {
     Map.Entry<String, InputStream> entry = iter.next();
     String inputName = (String) entry.getKey();
     FileInputStream inputValue = (FileInputStream) entry.getValue();
     if (inputValue == null) {
      continue;
     }
     String contentType = "image/png";
     StringBuffer strBuf = new StringBuffer();
     strBuf.append("\r\n").append("--").append(BOUNDARY).append("\r\n");
     strBuf.append("Content-Disposition: form-data; name=\"" + inputName + "\"; filename=\"" + inputName + "\"\r\n");
     strBuf.append("Content-Type:" + contentType + "\r\n\r\n");
     out.write(strBuf.toString().getBytes());
     DataInputStream in = new DataInputStream(inputValue);
     int bytes = 0;
     byte[] bufferOut = new byte[1024];
     while ((bytes = in.read(bufferOut)) != -1) {
      out.write(bufferOut, 0, bytes);
     }
     in.close();
    }
   }
   byte[] endData = ("\r\n--" + BOUNDARY + "--\r\n").getBytes();
   out.write(endData);
   out.flush();
   out.close();
   // 读取返回数据
   StringBuffer strBuf = new StringBuffer();
   BufferedReader reader = new BufferedReader(new InputStreamReader(conn.getInputStream()));
   String line = null;
   while ((line = reader.readLine()) != null) {
    strBuf.append(line).append("\n");
   }
   res = strBuf.toString();
   reader.close();
   reader = null;
  } catch (Exception e) {
   System.out.println("发送POST请求出错。" + urlStr);
   e.printStackTrace();
  } finally {
   //最后关闭链接
   if (conn != null) {
    conn.disconnect();
    conn = null;
   }
  }
  return res;
 }
}

图片服务器源码

package com.lyc.noJs.controller;

import com.google.common.base.Splitter;
import com.lyc.noJs.util.ImgMD5Util;
import lombok.extern.slf4j.Slf4j;
import org.joda.time.DateTime;
import org.springframework.stereotype.Controller;
import org.springframework.util.MultiValueMap;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.multipart.MultipartFile;
import org.springframework.web.multipart.MultipartHttpServletRequest;

import java.io.*;
import java.security.NoSuchAlgorithmException;
import java.util.Iterator;
import java.util.List;
import java.util.Map;
import java.util.Set;

@Controller
@RequestMapping("/admin")
@Slf4j
public class UploadController {

 @ResponseBody
 @RequestMapping(value = "/upload",method= RequestMethod.POST)
 public String upload(MultipartHttpServletRequest multiRequest) throws UnsupportedEncodingException {
  //图片文件夹根路径
  //TODO
  //这里的父路径暂时是target路径,在真实上线后,应该将其改成其它路径。
  String uploadFilePath = multiRequest.getServletContext().getRealPath("/upload/");
  //图片文件夹日期路径
  String datePath = getDateFolderName() + "\\";
  //图片名称
  String imagePath = saveImage(multiRequest,uploadFilePath,datePath);
  log.info(imagePath);
  return imagePath;
 }

 /**
  * 保存图片
  * @param multiRequest
  * @param uploadFilePath
  * @param datePath
  * @return
  * @throws UnsupportedEncodingException
  */
 public String saveImage(MultipartHttpServletRequest multiRequest,String uploadFilePath,String datePath) throws UnsupportedEncodingException {
  String imageNameHead = createImageNameHead();
  String imageName = "";
  //设置图片的浏览为utf-8格式,防止图片名称乱码
  multiRequest.setCharacterEncoding("utf-8");
  MultiValueMap<String, MultipartFile> multiFileMap = multiRequest.getMultiFileMap();
  Set<Map.Entry<String, List<MultipartFile>>> set = multiFileMap.entrySet();
  Iterator<Map.Entry<String, List<MultipartFile>>> iterator = set.iterator();
  while(iterator.hasNext()){
   Map.Entry<String, List<MultipartFile>> entry = iterator.next();
   String imageNameEnd = getImageNameEnd(entry);
   imageName = imageNameHead + "." + imageNameEnd;
   List<MultipartFile> multipartFileList = entry.getValue();
   MultipartFile multipartFile = multipartFileList.get(0);
   //图片文件的包路径
   String imagePath = uploadFilePath + datePath;
   //如果文件夹创建失败,则返回null
   if(makeParentFolder(imagePath)){  //如果文件夹创建失败,则返回false,否则返回true
    //图片文件的路径
    String imgFile = imagePath + imageName;
    //如果文件创建失败,则返回null
    if(!makeImage(multipartFile,imgFile)){ //当文件创建失败时,返回false,否则返回true
     return null;
    }
   } else {
    return null;
   }
  }
  return datePath + imageName;
 }

 /**
  * 创建图片
  * @param multipartFile
  * @param imgFile
  * @return
  */
 public boolean makeImage(MultipartFile multipartFile,String imgFile){
  File tempFile = new File(imgFile);
  if(tempFile != null){
   //如果原图片不存在,则生成图片
   if(!tempFile.exists()){
    try {
     log.info("1");
     multipartFile.transferTo(tempFile);
    } catch (IOException e) {
     e.printStackTrace();
    }
   }
   return true;
  }
  return false;
 }

 /**
  * 创建父文件路径
  * @param imagePath
  * @return
  */
 public boolean makeParentFolder(String imagePath){
  File parentFile = new File(imagePath);
  if(parentFile != null){
   while (!parentFile.exists()){
    //批量生成全部的父文件路径
    parentFile.mkdirs();
   }
   return true;
  }
  return false;
 }

 /**
  * 文件夹生成规则
  */
 public String getDateFolderName(){
  DateTime dataTime = new DateTime();
  String currentDate = dataTime.toString("yyyy\\MM\\dd");
  return currentDate;
 }

 /**
  * 创建图片文件的文件名
  * @return
  */
 public String createImageNameHead(){
  DateTime dataTime = new DateTime();
  return String.valueOf(dataTime.getMillis());
 }
}

测试

本地服务器

比如说本地一次上传多张图片,如下图所示:

java实现后台图片跨域上传功能

当我们点击上传后,页面显示结果:

java实现后台图片跨域上传功能

本地图片服务器后台打印结果:

2018\04\09\1523257444813.jpg
2018\04\09\1523257444944.jpg
2018\04\09\1523257445078.jpg
2018\04\09\1523257445202.jpg
2018\04\09\1523257445360.jpg
2018\04\09\1523257445484.jpg
2018\04\09\1523257445593.jpg
2018\04\09\1523257445742.jpg

图片的访问路径 = 服务器地址 + 回传的图片相对地址

即下面的地址:

http://localhost:9080/no-js/upload/2018/04/09/1523257444813.jpg

其显示的结果为:

java实现后台图片跨域上传功能

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,谢谢大家对码农之家的支持。

相关教程

  • Java Swing 多线程加载图片实例详解

    这篇文章主要为大家详细介绍了Java Swing 多线程加载图片,保证顺序一致,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

    发布时间:2020-03-08

  • javascript自由编辑图片示例代码

    这篇文章主要介绍了javascript实现自由编辑图片代码详解,在当下的的前端项目中,图片功能可以说是非常常见的,图片的展示、图片的裁剪编辑、图片的上传等,那么我们的项目便来了个需求

    发布时间:2020-03-13

  • Java将图片组合成PDF文件的代码分享

    这篇文章主要为大家详细介绍了Java将图片组合成PDF文件的方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

    发布时间:2020-02-09

  • java输出随机图片示例效果

    这篇文章主要介绍了java 实现输出随机图片实例代码的相关资料,需要的朋友可以参考下

    发布时间:2020-03-18

  • java上传图片文件功能实现方法

    这篇文章主要教大家如何简单实现java上传图片文件功能,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

    发布时间:2020-01-11

  • Java程序员面试宝典

    Java程序员面试宝典

    Java程序员面试宝典(第4版) 是《Java程序员面试宝典》的第4版。第4版在保留前三版数据结构、字符串处理、Java程序设计等主干内容的基础上,更新了部分程序员面试题目,内容主要取材于

    大小:78.6 MBJava面试电子书

  • JavaScript从入门到精通

    JavaScript从入门到精通

    本书是javascript高级程序的权威指南,从初学者角度出发,通过通俗易懂的语言、丰富多彩的实例,详细介绍了使用JavaScript语言进行程序开发应该掌握的各方面技术,是一本入门经典书籍

    大小:92.2 MBJavaScript电子书

  • Java线程与并发编程实践

    Java线程与并发编程实践

    本书全面介绍Java多线程编程技术,针对Java 8中的线程特性和并发工具的快速学习和实践指南,适合有一定基础的Java程序员阅读学习,尤其适合想要掌握Java线程和并发工具的读者阅读参考

    大小:42.3 MBJava编程电子书

  • 阿里巴巴Java开发手册

    阿里巴巴Java开发手册

    这本书愿景是码出高效,码出质量,提炼阿里巴巴集团技术团队的集体编程经验和软件设计智慧,浓缩成为立体的编程规范和实践,适合计算机相关行业的管理者和研发人员、高等院校的计算机专业师生、求职者等阅读

    大小:27.5 MBJava开发电子书

  • Java测试驱动开发

    Java测试驱动开发

    《Java测试驱动开发》最大特点是很薄,看起来没有什么负担。这本书的作用是通过实战让你培养TDD的思路,小编觉得挺不错的,感兴趣的小伙伴们可以参考一下。

    大小:9.17 MBJava电子书

  • RxJava响应式编程

    RxJava响应式编程

    主要介绍如何使用RxJava进行响应式编程,从响应式编程与RxJava的概念,到RxJava的操作符和源码,以及各种Scheduler的特点和适用场景,均做了较细致的讲解,是架构师提升必备入门书籍

    大小:71.1 MBRxJava电子书

  • Java软件结构与数据结构

    Java软件结构与数据结构

    Java软件结构与数据结构(第4版) 由著名作者JohnLewis(刘易斯)编写,本书始终以良好软件工程实践为准则,以Java为语言,介绍数据结构与算法的相关知识和具体实现,强调完美软件设计技巧的重要

    大小:129 MBJava电子书

  • JavaScript忍者秘籍

    JavaScript忍者秘籍

    JavaScript语言非常重要,相关的技术图书也很多,但没有任何一本书对JavaScript语言的重要部分(函数、闭包和原型)进行深入、全面的介绍,也没有任何一本书讲述跨浏览器代码的编写。本书是

    大小:83.5 MBJavaScript电子书

  • 你不知道的JavaScript(中卷)

    你不知道的JavaScript(中卷)

    JavaScript这门语言简单易用,很容易上手,但其语言机制复杂微妙,即使是经验丰富的JavaScript开发人员,如果没有认真学习的话也无法真正理解。

    大小:7.8 MBJS电子书

  • JavaScript语言精粹

    JavaScript语言精粹

    JavaScript曾是全世界非常容易误解的言语,由于它肩负过多的特点,包含槽糕的互动和不成功的设计方案,但伴随着Ajax的来临,JavaScript从极受误会的程序语言演化为十分时髦的言语,这除开好

    大小:9.9 MBJavaScript电子书

用户留言