欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

微信小程序上传图片实例

程序员文章站 2023-08-23 18:41:34
在网上看了好多小程序上传图片,java后端接收的示例,但是不管在哪个网站看的,代码基本是一样的,都是代码特别多。 所以就自己写一个比较简单的。  一 小程序端...

在网上看了好多小程序上传图片,java后端接收的示例,但是不管在哪个网站看的,代码基本是一样的,都是代码特别多。

所以就自己写一个比较简单的。

 一 小程序端

user.wxml

<view class='user_head'> 
 <view> 
  <image src='{{ptuser.avatarurl}}' bindtap='updatehead'></image> 
 </view> 
 <text>点击选择头像</text> 
</view>

user.js

// 更换头像 
span style="font-size:18px;color:#ff0000;"> updatehead: function () { 
  var that = this 
  // 上传图片 获取路径 
  wx.chooseimage({ 
   success: function (res) { 
    console.log('临时路径:' + res.tempfilepaths[0]) 
      wx.uploadfile({ 
       url: app.globaldata.baseurl + '/file/uploadfile', 
       filepath: res.tempfilepaths[0], 
       name: 'file', 
       success: function (result) { 
        console.log("返回路径:" + result.data) 
       } 
      }) 
   }, 
  }) 
 },

 二 java端

package cn.helloxhs.moudle.common; 
 
import java.io.file; 
import java.io.fileinputstream; 
import java.io.filenotfoundexception; 
import java.io.fileoutputstream; 
import java.io.ioexception; 
import java.io.inputstream; 
import java.io.outputstream; 
 
import javax.servlet.http.httpservletrequest; 
import javax.servlet.http.httpservletresponse; 
 
import org.apache.commons.fileupload.disk.diskfileitem; 
import org.springframework.stereotype.controller; 
import org.springframework.web.bind.annotation.requestmapping; 
import org.springframework.web.bind.annotation.responsebody; 
import org.springframework.web.multipart.multipartfile; 
import org.springframework.web.multipart.commons.commonsmultipartfile; 
 
import cn.helloxhs.base.controller.basecontroller; 
 
/** 
 * 类说明 
 * 
 * @author 肖荷山 
 * @version 创建时间:2017年12月23日 上午11:14:27 
 */ 
@controller 
@requestmapping("/file") 
public class filecontroller extends basecontroller { 
  @requestmapping("/uploadfile") 
  @responsebody 
  public object uploadfile(httpservletresponse response, httpservletrequest request, multipartfile file) { 
    string realpath = request.getsession().getservletcontext().getrealpath("/temp"); 
    try { 
      commonsmultipartfile cf = (commonsmultipartfile) file; 
      diskfileitem fi = (diskfileitem) cf.getfileitem(); 
      file f1 = fi.getstorelocation(); 
      inputstream ips = new fileinputstream(f1); 
      outputstream ops = new fileoutputstream(realpath + "/" + "xhs.jpg"); 
      byte[] b = new byte[1024]; 
      int len; 
      try { 
        while ((len = ips.read(b)) != -1) { 
          ops.write(b, 0, len); 
        } 
      } catch (ioexception e) { 
        e.printstacktrace(); 
      } finally { 
        // 完毕,关闭所有链接 
        try { 
          ops.close(); 
          ips.close(); 
        } catch (ioexception e) { 
          e.printstacktrace(); 
        } 
      } 
 
    } catch (filenotfoundexception e) { 
      e.printstacktrace(); 
    } 
    return realpath; 
  } 
 
} 

图片存在了项目的temp目录下

微信小程序上传图片实例

简单就好,没其他功能,单纯上传图片。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。