微信小程序-拍照或选择图片并上传文件
作者:lqh 发布时间:2023-09-04 20:22:45
标签:微信小程序,拍照,选择图片,上传文件
微信小程序-拍照或选择图片并上传文件
调用拍照API:https://mp.weixin.qq.com/debug/wxadoc/dev/api/media-picture.html?t=20161222#wxchooseimageobject
上传文件API:https://mp.weixin.qq.com/debug/wxadoc/dev/api/network-file.html
主要js代码:
choice: function () {
var that = this
wx.chooseImage({
count: 1, // 默认9
sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有
success: function (res) {
// 返回选定照片的本地文件路径列表,tempFilePath可以作为img标签的src属性显示图片
var tempFilePaths = res.tempFilePaths
that.setData({
textHidden: true,
image_photo: tempFilePaths,
photoHidden: false
})
}
})
},
uploadPhoto: function () {
var that = this
let param = util.json2Form({
tel: '18600346580',
orderSn: that.data.orderSn,
parkingPhoto: that.data.image_photo,
});
wx.uploadFile({
url: 'https://testapi.****.com/v4.0.0/uploadParkingPhoto', //仅为示例
filePath: that.data.image_photo[0],
name: 'parkingPhoto',
formData: {
'tel': '***********',
'orderSn': that.data.orderSn,
},
success: function (res) {
var obj = JSON.parse(res.data);;
console.log(obj.result)
console.log(obj.msg)
var resule = obj.result;
var msg = obj.msg;
if (resule == 'false') {
wx.showToast({
title: msg,
icon: 'success',
duration: 2000
})
} else {
wx.navigateBack({
delta: 1,
success: function (res) {
wx.showToast({
title: msg,
icon: 'success',
duration: 2000
})
},
})
}
}
})
}
Tip:
1.调用wx.chooseImage() 自动弹出选择窗口,不用调用操作菜单wx.showActionSheet(),否则重复
如图
2. 上传文件的时候filePath必须是数组,当你单张的时候需要使用数组,若只有一张要用[0]
3. 最需要注意的是,success返回数据是String类型,我们需要将String类型转换成Object
js字符串转换成obj
用js 是有三种方法的
js自带的eval函数,其中需要添加小括号eval('('+str+')');
JSON.parse(str)
$.parseJSON( jsonstr )
但是在微信小程序中,我们只能用JSON.parse(str),其他的都不可以
感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!
来源:http://blog.csdn.net/zhaoyazhi2129/article/details/53926507
0
投稿
猜你喜欢
- 描述的意思是HTML为中心的前端开发也差不多是web标准的意思。1.HTML是基础2.CSS依靠选择符提供视觉;3.Javascript 依
- 1.若有疑问立即检测 在出错时若能对原始代码做简单检测可以省去很多头痛问题。W3C对于XHTML与CSS 都有检测工具可用,请见 http:
- 做前端也有几年时间了,不敢说能把他看地多透,但是多多少少还是有些自己的东西。下面以 Tudou.com 的首页为例,总结总结。就制作而言,我
- 打开网页,然后将javascript:document.body.contentEditable='true';
- MYSQL数据库安装完成后,默认最大连接数是100,一般流量稍微大一点的论坛或网站这个连接数是远远不够的,增加默认MYSQL连接数的方法有两
- (一)原理 小偷程序实际上是通过了XML中的XMLHTTP组件调用其它网站上的网页。比如新闻小偷程序,
- 用户体验已经是一个老生常谈的话题了。我非常赞同某位达人所说的,用户体验设计应该贯穿于产品从萌芽到出生的整个过程,产品原型、视觉设计、前端开发
- 如果查询结果很多,服务器解释你的ASP script将花费大量的时间,因为有许多的Response.Write语句要处理. 如果你将输出的全
- 我们可用ADO STREAM来做一个无组件的上传程序。Stream对象包含了许多操作二进制和文本文件的方法,我们现在用Stream对象来操作
- def report_hook(count, block_size, total_size):... &n
- 姓名的翻译: 英语是名(First name)在前,姓(Last name)在后。中文地址的翻译:如果你英语水平不高,填表时只要国家名用英语
- 序本文主要研究一下golang的deferdeferreturn先赋值(对于命名返回值),然后执行defer,最后函数返回defer函数调用
- 下列语句部分是Mssql语句,不可以在access中使用。SQL语句分类:DDL—数据定义语言(CREATE,ALTER,DROP,DECL
- 在看到7yue博客——“换手来用”的思考 有这么一句话:RIA是一个更趋向于“体验”设计的领域,不仅仅包括“开发人员”,还包括“设计人员”,
- 左右布局,图片的宽度不固定。正好前几天测试闭合浮动元素时发现了overflow的特殊现象,倒是正好可以用在这里。测试通过:ie6/7&nbs
- 中文简繁体网页的转换FrontPage 2002提供了中文简繁体转换的功能。只要轻轻一点就可做出简体或繁体中文网站了。如要将当前
- 由于代码比较短,这里就不进行注释了代码如下:<% '当目标页面的包含文件即#include的页面里边存在respon
- 如何制作一个搜索引擎链接程序?多收集几个网站的,然后我们引用它到自己的页面中。接下来,我们要创建页面用于搜索:<center>&
- 来自Six Revisions的一篇文章,作者对一些主流的浏览器进行了测试比较,测试主要针对以下几个方面进行:1.JavaScript执行速
- 1. 查看数据库的版本select @@version2.查看数据库所在机器操作系统参数exec master..xp_msver3. 查看