微信小程序中如何上传图片（代码示例）

本篇文章给大家带来的内容是关于微信小程序中如何上传图片（代码示例），有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。

一、wxml文件<text>上传图片</text><view><button bindtap="uploadimg">点击选择上传图</button></view><image alt="微信小程序中如何上传图片（代码示例）" src='{{source}}' style='width:600rpx; height:600rpx' />二、js文件Page({/*** 页面的初始数据*/data: {　　//初始化为空source:''},/** * 上传图片 */uploadimg:function(){var that = this;wx.chooseImage({//从本地相册选择图片或使用相机拍照count: 1, // 默认9sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有success:function(res){//console.log(res)//前台显示that.setData({source: res.tempFilePaths})// 返回选定照片的本地文件路径列表，tempFilePath可以作为img标签的src属性显示图片var tempFilePaths = res.tempFilePathswx.uploadFile({url: 'http://www.website.com/home/api/uploadimg',filePath: tempFilePaths[0],name: 'file',success:function(res){//打印console.log(res.data)}})}})},)}三、PHP后端代码// 上传图片public function uploadimg(){$file = request()->file('file');if ($file) {$info = $file->move('public/upload/weixin/');if ($info) {$file = $info->getSaveName();$res = ['errCode'=>0,'errMsg'=>'图片上传成功','file'=>$file];return json($res);}}}运行结果：

console打印结果：

此时表示上传成功！

相关推荐：

微信开发如何上传图片？

微信小程序怎样使图片上传至服务器以上就是微信小程序中如何上传图片（代码示例）的详细内容，更多请关注小潘博客其它相关文章！