微客导航 » 文章资讯 » 微信小程序实现上传照片代码实例解析

微信小程序实现上传照片代码实例解析

2023-07-19 07:42:05 173

纸上谈坑

在我实现了这个功能之前，我讲讲我是怎么在这个坑里爬上来的：

我实现上传文件后端的接口的参数是String类型的

前台传的参数：http://tmp/wx忽略很多字母数字.png

但由于这张是本地照片url（外网无法访问），我后台拿到的是一个String类型，是没有办法是去识别这是一张图片的，访问不了这个数据，仅仅把它当做字符串而已。（低级错误）

代码实现

前言：后端接受文件有2种方式(参数)：1.MultipartFile2.base64

微信上传文件的开发文档

小程序代码



文件上传






//index.js
Page({
data:{

},
uploader:function(){
wx.chooseImage({
count:1,
success:function(res){
letimgPath=res.tempFilePaths[0]
wx.uploadFile({
url:'http://localhost:8080/customerRegister/uploadPricture',
filePath:imgPath,
name:'files',
success:res=>{
console.log(res)
}
})
}
})
},
})

java后端代码

@RequestMapping(value="/customerRegister",produces="application/json;charset=utf-8")
publicclass{

@RequestMapping("/uploadPricture")
@ResponseBody
publicStringuploadPricture(@RequestParam("file")MultipartFile[]file)throwsIOException{
MultipartFilemultipartFile=file[0];
System.out.println("图片名称："+multipartFile.getOriginalFilename());

InputStreaminputStream=multipartFile.getInputStream();
return"{"mas":"ok"}";
}

P.s.注意：这是一个ssm项目，因此你需要在pom.xml中添加依赖和在springmvc.xml中添加以下代码(这个问题搞了我几个小时，因为少了上传文件的配置，就会导致multipartfile这个类失效)



commons-fileupload
commons-fileupload
1.3.3

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

声明：本文内容来源于网络，版权归原作者所有，内容由互联网用户自发贡献自行上传，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任。如果您发现有涉嫌版权的内容，欢迎发送邮件至：czq8825#qq.com（发邮件时，请将#更换为@）进行举报，并提供相关证据，一经查实，本站将立刻删除涉嫌侵权内容。

返回顶部
3162201930
czq8825@qq.com

微信小程序实现上传照片代码实例解析

热门推荐

随机推荐