在开发微信企业号办公系统中,涉及到了图片上传功能,一开始使用的flash插件上传方法,在苹果手机上可以调用相机直接拍摄照片,但在安卓手机上只能选择照片。

微信jssdk-api带有一套完整的调用选择本地图片上传的功能,很多朋友在问到多图上传的问题。在这里分享一下自己的做法,其实并不是自己的做法,就是完全按照微信开发文档的做法,很多朋友可能没有仔细看文档,或者文档内容太多所以不想看,然后就不知道做法了,我这里挂出来,是这样做的

var images = {
localId: [],
serverId: []
};

  

 document.querySelector('#chooseImage').onclick = function () {
wx.chooseImage({
success: function (res) {
images.localId = res.localIds;
alert('已选择 ' + res.localIds.length + ' 张图片');
}
});
}; // 5.2 图片预览
document.querySelector('#previewImage').onclick = function () {
wx.previewImage({
current: 'http://img5.douban.com/view/photo/photo/public/p1353993776.jpg',
urls: [
'http://img3.douban.com/view/photo/photo/public/p2152117150.jpg',
'http://img5.douban.com/view/photo/photo/public/p1353993776.jpg',
'http://img3.douban.com/view/photo/photo/public/p2152134700.jpg'
]
});
}; // 5.3 上传图片
document.querySelector('#uploadImage').onclick = function () {
if (images.localId.length == 0) {
alert('请先使用 chooseImage 接口选择图片');
return;
}
var i = 0, length = images.localId.length;
images.serverId = [];
function upload() {
wx.uploadImage({
localId: images.localId[i],
success: function (res) {
i++;
//alert('已上传:' + i + '/' + length);
images.serverId.push(res.serverId);
if (i < length) {
upload();
}
},
fail: function (res) {
alert(JSON.stringify(res));
}
});
}
upload(); /*********************多张图片,这里上传使用的是递归******************************/
}; // 5.4 下载图片
document.querySelector('#downloadImage').onclick = function () {
if (images.serverId.length === 0) {
alert('请先使用 uploadImage 上传图片');
return;
}
var i = 0, length = images.serverId.length;
images.localId = [];
function download() {
wx.downloadImage({
serverId: images.serverId[i],
success: function (res) {
i++;
alert('已下载:' + i + '/' + length);
images.localId.push(res.localId);
if (i < length) {
download();
}
}
});
}
download(); /*********************多张图片,这里下载使用的是递归******************************/ };

  多图上传或者下载都是使用的递归方法,在android或者IOS中都是行得通的(在这里多说一句,有些接口,Android行得通,IOS却不行;IOS可以的,Android可能又会有问题,当然这只是极个别现象,用多了就会发现)。

这些接口都是需要配合着图片选择来用的哦

微信企业号办公系统-JSSDK上传图片(多图上传)的更多相关文章

  1. 微信企业号办公系统-图片预览放大功能-previewImage

    在微信里看过文章的应该知道,文章里的图片点击后可以放大.分享和保存. 然而自己在微信里开发的网页,里面的图片点击后没办法实现这个效果,然后就去看了下微信JS文档,里面有个previewImage可以调 ...

  2. asp.net 微信企业号办公系统-流程设计--流转条件设置(路由)

    当一个步骤后面有多个步骤时,可以设置为根据设置条件系统自动判断该流向哪些步骤,也叫路由. 工作流没有单独的路由步骤来设置条件,流程条件通过双击连线弹出条件设置框来设置. 1.sql条件 即通过sql条 ...

  3. asp.net 微信企业号办公系统-流程设计--流程步骤设置-策略设置

    策略设置包括当前步骤的流转方式,处理人员,退回策略等设置. 流转类型:当前步骤后面有多个步骤时,此类型选择可以决定后续步骤的发送方式. 1.系统控制:由系统根据您在线上设置的流转条件来判断该发送到哪一 ...

  4. asp.net 微信企业号办公系统-表单及流程设计配置实例

    在环境搭建好之后,我们就来学习一下怎样快速创建一个流程,并执行和流转该流程(我们这里讲的只是入门,不涉及到具体流程参数设置). 创建一个流程步骤为:在数据库在创建表-->设计表单-->设置 ...

  5. asp.net 微信企业号办公系统-流程设计--保存与发布

    如果流程未设计完时可以先保存,以后再打开接着设计.点击工具栏上的保存按钮即可保存当前流程设计: 如果下次要接着设计,则可以打开该流程继续设计: 如果流程设计完成,可以点击安装按钮来发布流程,流程安装成 ...

  6. asp.net 微信企业号办公系统-流程设计--流程步骤设置-事件设置

    事件设置是设置当前步骤在提交前后或退回前后要执行的一些操作(该事件为服务器事件). 事件格式为:dll名称.命名空间名称.类名.方法名,这里不需要写括号和参数,处理时会自动带上当前流程实例的相关参数. ...

  7. asp.net 微信企业号办公系统-流程设计--流程步骤设置-数据设置

    数据设置是控制在流程处理过程中,当前步骤的数据显示与编辑状态,控制当前步骤哪些字段为只读,隐藏或可编辑.需要配合表单设计器使用.

  8. asp.net 微信企业号办公系统-流程设计--流程步骤设置-按钮设置

    按钮设置是配置当前步骤的处理者可以执行哪些操作,每个按钮都有对应的执行脚本(javascript脚本). 从左边的按钮列表中选择当前步骤需要的按钮. 注意:如果是流程最后一步则要配置完成按钮而不是发送 ...

  9. 【原创】.Net 微信 JS-SDK图片、语音上传接口的实现(MVC)-(一 、上传图片)

    前段时间在做一个微信的项目,遇到了一个上传图片的问题,花了一下午,解决了这个问题,然后把总结出来的代码,分享了出来. 最近又有一个图片+语音的功能, 更是蛋疼, 本次采用的不是File文件上传,然后转 ...

随机推荐

  1. Smarty s01

    复习面向过程中,如何输出显示变量的内容 01.php 第一个版本,使用三个文件来输出html 1.访问文件 2.类MyTpl.class.php 3.一个html模板文件 课堂练习第一个版本 第二个版 ...

  2. Segment Tree Query I & II

    Segment Tree Query I For an integer array (index from 0 to n-1, where n is the size of this array), ...

  3. C++多态公有继承

    面向对象的三个基本特征 面向对象的三个基本特征是:封装.继承.多态.其中,封装可以隐藏实现细节,使得代码模块化:继承可以扩展已存在的代码模块(类):它们的目的都是为了——代码重用.而多态则是为了实现另 ...

  4. Android 和iOS中 View的滚动

    在最近的程序中用到了Android中的View的滚动,记录一下,待总结.

  5. [Android Memory] Android Zipalign zip对齐优化app程序

    转载地址:http://www.cnblogs.com/xirihanlin/archive/2010/04/12/1710164.html 参考文章:http://www.cnblogs.com/l ...

  6. 理解Fragment生命周期

    官网帮助文档链接:  http://developer.android.com/guide/components/fragments.html 主要看两张图,和跑代码 一,Fragment的生命周 二 ...

  7. Base Filtering Engine 拒绝访问解法

    基本筛选引擎(BFE)是一种管理防火墙和 Internet 协议安全(IPsec)策略以及实施用户模式筛选的服务.停止或禁用 BFE 服务将大大降低系统的安全.还将造成 IPsec 管理和防火墙应用程 ...

  8. jQuery操作DOM和CSS函数

    function des html jquery result html() 获取元素中HTML内容 <div id="box" style="color:red& ...

  9. php 工厂模式

    <body> <?php //设计模式:工厂模式 /* class YunSuan { public $a; public $b; function Jia() { return ( ...

  10. 从几个方向进行Web渗透测试

    渗透测试就是对系统安全性的测试,通过模拟恶意黑客的攻击方法,来评估系统安全的一种评估方法. 渗透测试可以包括各种形式的攻击,一般来说会有专门的公司提供这种服务,这里整理了几种常见的渗透测试方法,可以对 ...