`
andyou2012
  • 浏览: 8816 次
  • 性别: Icon_minigender_1
  • 来自: 南京
社区版块
存档分类
最新评论

微信小程序图片上传java端以及前端实现

阅读更多
小程序的图片上传与传统的图片上传方式有一些不一样
如果你有幸看到这篇文章,恭喜你,你可以完美解决了。
话不多说,前后端代码一并奉上:
(基于springmvc )

@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 {
        //获取文件需要上传到的路径
        String path = request.getRealPath("/upload") + "/";
        File dir = new File(path);
        if (!dir.exists()) {
            dir.mkdir();
        }
        logger.debug("path=" + path);

        request.setCharacterEncoding("utf-8");  //设置编码
        //获得磁盘文件条目工厂
        DiskFileItemFactory factory = new DiskFileItemFactory();

        //如果没以下两行设置的话,上传大的文件会占用很多内存,
        //设置暂时存放的存储室,这个存储室可以和最终存储文件的目录不同
        /**
         * 原理: 它是先存到暂时存储室,然后再真正写到对应目录的硬盘上,
         * 按理来说当上传一个文件时,其实是上传了两份,第一个是以 .tem 格式的
         * 然后再将其真正写到对应目录的硬盘上
         */
        factory.setRepository(dir);
        //设置缓存的大小,当上传文件的容量超过该缓存时,直接放到暂时存储室
        factory.setSizeThreshold(1024 * 1024);
        //高水平的API文件上传处理
        ServletFileUpload upload = new ServletFileUpload(factory);
        try {
            List<FileItem> list = upload.parseRequest(request);
            FileItem picture = null;
            for (FileItem item : list) {
                //获取表单的属性名字
                String name = item.getFieldName();
                //如果获取的表单信息是普通的 文本 信息
                if (item.isFormField()) {
                    //获取用户具体输入的字符串
                    String value = item.getString();
                    request.setAttribute(name, value);
                    logger.debug("name=" + name + ",value=" + value);
                } else {
                    picture = item;
                }
            }

            //自定义上传图片的名字为userId.jpg
            String fileName = request.getAttribute("userId") + ".jpg";
            String destPath = path + fileName;
            logger.debug("destPath=" + destPath);

            //真正写到磁盘上
            File file = new File(destPath);
            OutputStream out = new FileOutputStream(file);
            InputStream in = picture.getInputStream();
            int length = 0;
            byte[] buf = new byte[1024];
            // in.read(buf) 每次读到的数据存放在buf 数组中
            while ((length = in.read(buf)) != -1) {
                //在buf数组中取出数据写到(输出流)磁盘上
                out.write(buf, 0, length);
            }
            in.close();
            out.close();
        } catch (FileUploadException e1) {
            logger.error("", e1);
        } catch (Exception e) {
            logger.error("", e);
        }


        PrintWriter printWriter = response.getWriter();
        response.setContentType("application/json");
        response.setCharacterEncoding("utf-8");
        HashMap<String, Object> res = new HashMap<String, Object>();
        res.put("success", true);
        printWriter.write(JSON.toJSONString(res));
        printWriter.flush();
    }


你以为就只有java后端代码吗?
前端代码也拿去


  wx.uploadFile({
    url: 'https://xxxxxx/upload/picture',
    filePath: filePath,//图片路径,如tempFilePaths[0]
    name: 'image',
    header : {
      "Content-Type": "multipart/form-data"
    },
    formData:
    {
      userId: 12345678 //附加信息为用户ID
    },
    success: function (res) {
      console.log(res);
    },
    fail: function (res) {
      console.log(res);
    },
    complete: function (res) {

    }
  })



经过实践检验,有问题可以下方提问。





分享到:
评论

相关推荐

    前后端全部开源微信小程序商城(Java + uniapp)

    开发者在获取此项目后,需要按照文档指示进行环境配置、数据库迁移、后端服务启动以及前端编译,然后在微信开发者工具中调试小程序,最后将生成的小程序包上传至微信小程序平台进行审核和发布。 综上所述,这个开源...

    微信支付-微信小程序+Java后台代码

    在这个项目中,我们结合了微信小程序和Java后台技术,实现了一个完整的微信支付流程。以下将详细阐述涉及的知识点: 1. **微信小程序**:微信小程序是一种轻量级的应用开发框架,允许开发者在微信内部创建和运行...

    基于Java后台的前后端分离的微信小程序-新饰纪商城的前端代码.zip

    微信小程序前端开发涉及的主要技术有WXML(微信小程序的结构语言)、WXSS(样式语言)和JavaScript,以及微信小程序提供的API,用于实现与微信环境的交互,如获取用户信息、调用微信支付等。 【知识点详述】 1. **...

    微信小程序java上传图片_servlet

    在这个“微信小程序java上传图片_servlet”项目中,我们将探讨如何在微信小程序中实现图片上传功能,并通过Java Servlet进行后端处理。 首先,微信小程序提供了wx.chooseImage接口,用户可以通过这个接口选择本地...

    微信小程序+Java后台完整代码

    在“微信小程序+Java后台完整代码”中,我们可以看到一个完整的电商解决方案,包括前端的小程序部分和后端的Java服务。小程序商城的部分主要负责展示商品、处理用户交互、实现购物车功能、订单管理以及支付流程等。...

    微信小程序支付代码java

    下面将详细介绍微信小程序支付流程、相关Java代码实现及注意事项。 一、微信小程序支付流程 1. 用户在微信小程序中选择商品或服务并提交订单。 2. 小程序向服务器发送支付请求,包括订单详情(如商品ID、金额等)。...

    JAVA-HTTP-生成微信小程序二维码,5种实现方式

    对于如何生成微信小程序二维码,本篇一共列举了5种实现方式,文末可打包下载开箱即用的全套源码,我更期待老铁的文末 投票,很想看看哪种才是你的菜~ 项目主要用的是微信官方提供的服务端能力,考虑到涉及secret和...

    房屋租赁管理系统微信小程序代码 - 小程序 - java - uniapp -springboot - 微信小程序 - 代码

    房屋租赁管理系统微信小程序代码 | 小程序 | java | uniapp |springboot | 微信小程序 | 代码 1、技术栈:微信小程序,springboot,uniapp,vue,ajax,maven,mysql,MyBatisPlus 2、系统的实现 用户信息 图片素材...

    【微信小程序-毕设期末大作业】图片上传实现(java)微信小程序源码.zip

    总结来说,实现微信小程序中的图片上传功能,涉及到前端的微信小程序开发、图片处理、文件上传,以及后端的Java服务开发、文件存储和API设计。这个过程需要开发者具备良好的前后端知识,理解HTTP协议,熟悉微信小...

    基于JAVA开发的微信小程序购物商城

    这个项目的核心在于利用Java进行后台系统的设计与实现,同时通过微信小程序提供前端用户界面。在Java后端,开发者通常会采用Spring Boot框架来构建RESTful API,该框架简化了Spring应用程序的开发过程。Spring Data ...

    完整的Java微信小程序商城源码包含前后端

    简单实现微信小程序商城,基本功能完整。后端代码层次分明,风格统一。前端代码基于Layui,封装了工具类,使用的是H-ui Admin。不管是用于学习还是作为个人基础项目开发,都很实用。作为实际应用,还有些功能待完善...

    java实现上传网络图片到微信临时素材

    要实现上传网络图片到微信临时素材,我们需要使用 Java 语言编写上传程序。首先,我们需要获取微信 access_token,这个 token 是微信服务器颁发的临时令牌,用于验证用户身份。 ```java String url = ...

    微信小程序(商城)完整代码(后端、前端、小程序端、数据库)

    微信小程序(商城)完整代码包含了构建一个功能完备的线上商城所需的所有组件,涵盖了后端服务、前端展示、小程序客户端以及数据库设计。这个项目为开发者提供了一个全面了解微信小程序开发流程和实践的机会,同时也...

    网上花店微信小程序代码 - 小程序 - java - uniapp -springboot - 微信小程序 - 代码

    网上花店微信小程序代码 | 小程序 | java | uniapp |springboot | 微信小程序 | 代码 1、技术栈:微信小程序,springboot,uniapp,vue,ajax,maven,mysql,MyBatisPlus 2、系统的实现 用户信息 图片素材 视频...

    微信小程序+springboot+mybatis实现增删改查(微信小程序端).rar

    在本项目中,“微信小程序+springboot+mybatis实现增删改查(微信小程序端)”是结合了前端微信小程序与后端Java服务的典型应用实例,主要用于演示如何通过这些技术实现实时的数据操作功能。 首先,微信小程序部分...

    微信小程序商城

    1. **微信小程序开发环境**:开发微信小程序需要使用微信官方提供的开发者工具,该工具集成了编译、调试和预览等功能,支持JavaScript、WXML(微信小程序标签语言)和WXSS(微信小程序样式语言)等技术。 2. **小...

    家政上门预约服务微信小程序源码(前后端).zip

    本篇文章将深入探讨“家政上门预约服务微信小程序源码(前后端)”,并围绕其开发技术、功能实现以及架构设计进行详细阐述。 首先,我们要明确微信小程序的开发环境。微信小程序的开发语言主要是基于JavaScript的...

    微信小程序文件上传客户的+java服务器端源码.rar

    在本资源"微信小程序文件上传客户的+java服务器端源码.rar"中,包含了两个关键部分:微信小程序前端代码和Java服务器端代码,这将帮助我们理解如何在微信小程序中实现文件上传功能并与后端进行交互。 1. **微信小...

    蓝色版微信去水印小程序源码带流量主+前端+后端 +接口

    本文将详细讲解“蓝色版微信去水印小程序源码带流量主+前端+后端 +接口”的相关知识点,包括微信小程序的基本概念、去水印技术、前端开发、后端服务以及流量主接口。 1. 微信小程序: 微信小程序是腾讯公司推出的一...

    【微信小程序-毕设期末大作业】飞翔的小鸟含java后端微信小程序源码

    【微信小程序-毕设期末大作业】微信小程序源码 【微信小程序-毕设期末大作业】微信小程序源码 【微信小程序-毕设期末大作业】微信小程序源码 【微信小程序-毕设期末大作业】微信小程序源码 【微信小程序-毕设期末大...

Global site tag (gtag.js) - Google Analytics