uniapp微信小程序图片上传java后台(全代码)

这里的是java后台,是springboot工程。

application.yml配置:

server:
  port: 1221
spring:
   #自定义图片访问路径
   mvc:
   #注意/**/后面的/是不用的,但是如果我不加我下面的代码会不好看,你们cody的时候记得去掉!还有这串注释
     static-path-pattern: /houseapp/upload/**
    */ 
   resources:
     static-locations: file:D://houseapp//upload/
   #文件上传
   servlet:
     multipart:
       #是否启用文件上传功能
       enabled: true
       #指定文件写入磁盘后的阈值,默认为0
       file-size-threshold: 0
       #指定上传文件大小, 默认1M
       max-file-size: 50Mb
       #指定multipart/form-data请求允许的最大大小, 默认10M
       max-request-size: 100Mb
       #是否在文件或参数访问时懒惰地解析多部分请求
       resolve-lazily: false

对上面的自定义图片访问路径说明下:

我的需求是,微信小程序上传图片到服务器,由于项目小,图片不会很大很多,所以就没用文件上传服务器的,但是没用文件上传服务器为了后续运维方便也不能放在springboot工程静态文件下,因为每次打包后替换新包,那图片岂不是要拷贝出来,等新包跑起来再丢进去,每次这样不是很难受莫。
他们还有种是写个拦截器配置白名单的方式实现自定义图片访问路径,但是还是配置简单些,咱就不写那个了

上代码

注意看下面代码的注释。
package com.house.controller;

import com.alibaba.fastjson.JSONArray;

import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.multipart.MultipartFile;
import org.springframework.web.multipart.support.StandardMultipartHttpServletRequest;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.*;
import java.util.HashMap;
import java.util.Iterator;
import java.util.UUID;

/**
 * 
 * @author Tang wj
 * @version 2019 11/13 17:02
 *
 */
@Controller
@RequestMapping("/upload")
public class UploadController {
    private static final Logger logger = LoggerFactory.getLogger(UploadController.class);

    @RequestMapping("/picture")
    public void uploadPicture(HttpServletRequest request, HttpServletResponse response) throws Exception {
        // 获取文件需要上传到的路径
        File directory = new File("..");
        String path = directory.getCanonicalPath() + "/upload/";
 
        // 判断存放上传文件的目录是否存在(不存在则创建)
        File dir = new File(path);
        if (!dir.exists()) {
            dir.mkdir();
        }
 
        request.setCharacterEncoding("utf-8"); // 设置编码
 
        JSONArray jsonArray = new JSONArray();
        
        String imgName= "";
        try {
        	// 效率较高的文件上传器
            StandardMultipartHttpServletRequest req = (StandardMultipartHttpServletRequest) request;
            Iterator<String> iterator = req.getFileNames();
            while (iterator.hasNext()) {
                HashMap<String, Object> res = new HashMap<String, Object>();
                MultipartFile file = req.getFile(iterator.next());
                // 获取文件名
                String fileNames = file.getOriginalFilename();
                int split = fileNames.lastIndexOf(".");
                // 获取上传文件的后缀
                String extName = fileNames.substring(split + 1, fileNames.length());
                //申明UUID
                String uuid = UUID.randomUUID().toString().replace("-", "");
                
                // 组成新的图片名称
                String newName = uuid + "." + extName;
                res.put("url", newName);
                jsonArray.add(res);
                
                // 我只需要图片名称就够了
                imgName= jsonArray.toString();
                String destPath = path + newName;
 
                // 写到磁盘上
				// 你们需要服务器绝对地址的就在这里操作,接收file就好了
                File file1 = new File(destPath);
                OutputStream out = new FileOutputStream(file1);
                out.write(file.getBytes());
                
                out.close();
            }
        } catch (Exception e) {
            logger.error("图片上传异常", e);
        }
        // 用文件输出流返回前端
        PrintWriter printWriter = response.getWriter();
        response.setContentType("application/json");
        response.setCharacterEncoding("utf-8");
        printWriter.write(imgName);
        printWriter.flush();
    }
 
}

uniapp微信小程序前端代码

// url:后台服务请求地址
// imgurl: 图片地址
// successCallback:成功回调
// failCallback: 失败回调
function uploadFile(url,imgurl, successCallback, failCallback) {
	uni.uploadFile({
		 url: url,
		 filePath: imgurl,
		 name: 'file',
		 formData: {
			 'user': 'commit'
		 },
		success: (res) => {
			// preHandleResult(res);
			if(successCallback){
				 successCallback(res);
			}
		},
		fail: (res) => {
			// preHandleResult(res);
			if(failCallback){
				 failCallback(res);
			}
		}
	});

你直接拿我的贴上你的java后台就好了,保证能用!话不多说.

效果:前端
uniapp微信小程序图片上传java后台(全代码)_第1张图片
uniapp微信小程序图片上传java后台(全代码)_第2张图片
uniapp微信小程序图片上传java后台(全代码)_第3张图片在这里插入图片描述
uniapp微信小程序图片上传java后台(全代码)_第4张图片

浏览器输入 http://ip:端口/houseapp/upload/图片名称.jpg

uniapp微信小程序图片上传java后台(全代码)_第5张图片
微信小程序显示:
uniapp微信小程序图片上传java后台(全代码)_第6张图片

这里的java后台我是参考别人改了点,但是当时没有关注他,这里就挂不上他的博客链接,如您找到我请留言,立马改,感谢!

你可能感兴趣的:(微信小程序图片上传,java,前端)