上传图片
API: wx.chooseImage() 和 wx.uploadFile()
wx.chooseImage({
count: 1, // 默认9
sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有
success: function(res) {
console.log(res.tempFiles); // 图片的本地文件列表,每一项是一个file对象
// 结果: [{path: "http://tmp/wx0ffcd03a1dfdc451.o6zAJs7JDPzeAscW09c_BG24fpdU.6919dfcada671055948023075afd859a.jpg", size: 61034}, ...]
console.log(res.tempFilePaths); // 图片的本地文件路径列表
// 结果: ["http://tmp/wx0ffcd03a1dfdc451.o6zAJs7JDPzeAscW09c_BG24fpdU.6919dfcada671055948023075afd859a.jpg"]
var tempFilePaths = res.tempFilePaths;
wx.uploadFile({
url: '/your_url/receive_file', // 图片上上传的地址,请求方式默认为POST且不可更改
filePath: tempFilePaths[0], // 要上传的文件的路径,注:一次只能上传一个文件,若要上传多张图片,请使用递归
name: 'file', // 文件对应的键名,后端可以通过这个key获取到文件的二进制内容
formData:{
'user_id': '123',
'name': 'Jack',
'age': 18
},
success: function(res){
var data = res.data
//do something
}
})
}
})
如果需要上传多张图片,那么需要把wx.uploadFile()封装成一个函数,判断图片上传是否完成,如果没有完成,则一直调用这个函数,否则,图片上传完成。
 

微信小程序选择并上传图片的更多相关文章

  1. 微信小程序中如何上传图片

    本篇文章给大家带来的内容是关于微信小程序中如何上传图片(代码示例),有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助. 一.wxml文件 <text>上传图片</text ...

  2. 微信小程序---选择图片和调用微信拍照

    1.实现点击头像按钮实现选择图片或者拍照,将图片重新设置成头像: //index.js //获取应用实例 var app = getApp() Page({ data: { motto: 'Hello ...

  3. 微信小程序选择视频,视频上传,视频播放

    请查看链接地址看具体详情: 选择视频: https://mp.weixin.qq.com/debug/wxadoc/dev/api/media-video.html#wxchoosevideoobje ...

  4. 微信小程序——选择某个区间的数字

    很久没有更新文章啦~~记录下今天弄的一个小功能. 先上图: 需求很简单: 第1列改变的时候,第2列也随着改变,并且比第1列大1k. 这里用到了微信的picker 组件,对于不太熟练这个组件的小伙伴可以 ...

  5. 微信小程序 选择微信自带的地址 用户授权选择了拒绝

    // 选择微信自带地址 addAddr:function () { wx.chooseAddress({ success: function (res) { self.setData({ addrIn ...

  6. 微信小程序选择图片,查看图片信息,浏览图片,图片上传

    依次点击链接请查看以下步骤 选择图片: https://mp.weixin.qq.com/debug/wxadoc/dev/api/media-picture.html#wxchooseimageob ...

  7. 微信小程序 --- 选择图片和拍照

    wx.chooseImage 选择图片 / 进行拍照 //获取应用实例 const app = getApp() Page({ data: { onOff:true }, btnclick:funct ...

  8. 微信小程序实现图片是上传、预览功能

    本文实例讲述了微信小程序实现图片上传.删除和预览功能的方法,分享给大家供大家参考,具体如下: 这里主要介绍一下微信小程序的图片上传图片删除和图片预览 1.可以调用相机也可以从本地相册选择 2.本地实现 ...

  9. 微信小程序-上传照片-多张显示

    图片就是一个简单的效果 实现 先看wxml和wxss代码 <view class='in-demand'> <view class='dema-title'> <text ...

随机推荐

  1. jboss eap 6.2 ear包 下使用log4j日志

    被jboss7/eap的日志问题搞死了,查了好多资料,都是war包的,基本上使用jboss-deployment-structure.xml放到WEB-INF下,文件内容如下: 是我总是没法成功,最后 ...

  2. MySQl新特性 GTID

    GTID简介 概念 全局事务标识符(GTID)是创建的唯一标识符,并与在源(主)服务器上提交的每个事务相关联.此标识符不但是唯一的,而且在给定复制设置中的所有服务器上都是唯一的.所有交易和所有GTID ...

  3. 大话存储 3 - 七种磁盘RAID技术

    RAID技术 Redundant Array of Independent Disks 由独立的磁盘组成的具有冗余特性的阵列. 有两个特性: 阵列:需要很多磁盘来组成 冗余:允许某块磁盘损坏之后,数据 ...

  4. linux开机步骤

    linux开机启动步骤: 1.bios自检 2.MBR引导 3.引导系统,进入grub菜单 4.加载内核kernel 5.运行第一个进程init 6.读取/etc/inittab 读取运行级别 7.读 ...

  5. python 函数闭包()

    闭包(closure) 当一个函数在内部定义函数,并且内部的函数应用外部函数的参数或者局部变量,当内部函数被当做返回值的时候,相关参数和变量保存在返回函数中,这种结果,叫闭包 example1: de ...

  6. MySQL运维之--xtrabackup工具的原理和使用方法

    Xtrabackup工具的介绍 xtrabackup是percona公司开发的一款自由.免费.开源的一款备份工具,他的备份特点就是:支持热备.备份速度快. xtrabackup包含两个重要的工具:in ...

  7. Resharper安装使用手册

    今天在博客园上看到一位大牛写了一遍关于.NET代码优化的文章,其中提到了Resharper这个工具,以前没使用过这个工具,突然想用这个工具来检查一下自己之前代码的规范程度,也是为了写出更规范的代码. ...

  8. SQL 性能不佳的几个原因

    •不准确的统计数据•差劲的索引•差劲的查询设计 •差劲的执行计划,通常是由不正确的参数引起的•过度阻塞和死锁 •非基于集合的操作•不良数据库设计 •过度碎片 •不能重复使用执行计划 •查询频繁重编译 ...

  9. bat脚本,备份数据库并压缩

    forfiles /p "D:\DBBackup" /m "*.sql" /d -08 /c "cmd /c del @path"forfi ...

  10. WorldWind源码剖析系列:星球球体的加载与渲染

    WorldWind源码剖析系列:星球球体的加载与渲染 WorldWind中主函数Main()的分析 在文件WorldWind.cs中主函数Main()阐明了WorldWind的初始化运行机制(如图1所 ...