微信JS-SDK上传多张照片

通过JS-SDK进行操作的基本步骤包括:引用微信的JS、配置权限验证参数及使用的接口、通过ready及error验证配置及功能接口的使用等。如下以上传图片Demo为例进行说

(1)引入JS及配置调用参数

<script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
    <script type="text/javascript">
        wx.config({
            debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
            appId: ‘@CommonOperate.GetJsSdkUiPackage().AppId‘, // 必填,公众号的唯一标识
            timestamp: @CommonOperate.GetJsSdkUiPackage().Timestamp, // 必填,生成签名的时间戳
            nonceStr: ‘@CommonOperate.GetJsSdkUiPackage().NonceStr‘, // 必填,生成签名的随机串
            signature: ‘@CommonOperate.GetJsSdkUiPackage().Signature‘, // 必填,签名
            jsApiList: [ //必填,需要使用的JS接口列表,所有JS接口列表见附录2
                ‘checkJsApi‘,
                ‘chooseImage‘,
                ‘previewImage‘,
                ‘uploadImage‘,
                ‘downloadImage‘,
                ‘getLocation‘,
                ‘openLocation‘
            ]
        });

  

(2)通过chooseImage选取多张照片,选取成功后可获得本地照片的ID集“res.localIds”


(3)点击上传时遍历“res.localIds”分别调用uploadImage



可获取“var serverId = res.serverId; ”,此serverId对应存储在微信平台里的唯一资源mediaId,将mediaId POST到后端可通过微信的接口获取photo stream再保存到本地或上传到cloud

 注意:如下需将流的当前位置设置为0 stream.Position = 0;(否则会导致上传到Azure等时会出现打不开的情况)

/// <summary>
/// 上传微信照片
/// </summary>
/// <param name="repairId"></param>
/// <param name="mediaId"></param>
/// <returns></returns>
[HttpPost]
public JsonResult UploadWxImage(int repairId, string mediaId)
{
	using (MemoryStream stream = new MemoryStream())
	{
		CommonOperate.GetMedia(mediaId, stream);
		stream.Position = 0;
		string localPath = Server.MapPath($"~/Content/{Guid.NewGuid()}.jpg");
		try
		{
			System.Drawing.Image imgLocal = System.Drawing.Image.FromStream(stream);
			imgLocal.Save(localPath);
		}

  

参考:

JS-SDK

https://work.weixin.qq.com/api/doc#10029/%E4%B8%8A%E4%BC%A0%E5%9B%BE%E7%89%87%E6%8E%A5%E5%8F%A3

原文地址:https://www.cnblogs.com/hepc/p/9709482.html

时间: 2024-08-08 03:47:01

微信JS-SDK上传多张照片的相关文章

微信js sdk上传多张图片

微信js sdk上传多张图片,微信上传多张图片 该案例已tp3.2商城为例 直接上代码: php代码: public function ind(){ $appid="11111111111111111111"; $secret="11111111111111111111"; $token = S('access_token'); if (!$token) { $res = file_get_contents("https://api.weixin.qq.c

实战微信JS SDK开发:贺卡制作与播放(1)

前段时间忙于CanTK 2.0的开发,所以博客一直没有更新.CanTK 2.0主要增强了游戏和富媒体的开发,现在编码和测试基本完成了,等文档完成了再正式发布,里面有不少激动人心的功能,等发布时再一一细说吧. 最近同事用CanTK开发了一个基于微信的贺卡制作APP,我虽然没有参与开发,但是提供CanTK和GameBuilder的技术支持,觉得有些东西比较有意思,写几篇博客和大家分享吧.这个贺卡APP完全开源,有需要的朋友可以随意修改和发布. CanTK(Canvas ToolKit)是一个开源的游

js怎么上传文件夹

1 背景 用户本地有一份txt或者csv文件,无论是从业务数据库导出.还是其他途径获取,当需要使用蚂蚁的大数据分析工具进行数据加工.挖掘和共创应用的时候,首先要将本地文件上传至ODPS,普通的小文件通过浏览器上传至服务器,做一层中转便可以实现,但当这份文件非常大到了10GB级别,我们就需要思考另一种形式的技术方案了,也就是本文要阐述的方案. 技术要求主要有以下几方面: 支持超大数据量.10G级别以上 稳定性:除网络异常情况100%成功 准确性:数据无丢失,读写准确性100% 效率:1G文件分钟级

js判断上传文件大小

<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="content-typ

java微信接口之四—上传素材

一.微信上传素材接口简介 1.请求:该请求是使用post提交地址为: https://api.weixin.qq.com/cgi-bin/media/uploadnews?access_token=ACCESS_TOKEN 其中ACCESS_TOKEN是我们动态获取的. 发送的数据: {"articles":[ { "thumb_media_id":"qI6_Ze_6PtV7svjolgs-rN6stStuHIjs9_DidOHaj0Q-mwvBelOXC

Jquery form.js文件上传返回JSON数据,在IE下提示下载文件的解决办法,并对返回数据进行正确的解析

Jquery from.js插件上传文件非常方便,但是在ie10以下的版本会弹出下载文件对话框 解决方法: 1.在服务端设置response.setContentType("text/plain"); 2.对返回数据正确解析                这时返回的数据不再是json,不能使用解析json的方法进行解析                       var data1=eval("(" + data+ ")");  //将返回的字符

利用ajaxfileupload.js异步上传文件

1.引入ajaxfileupload.js 2.html代码 <input type="file" id="enclosure" name="enclosure"> <button id="upClick" >上传</button> 注意这里的input控件的id和name必须一致:这样在后台利用springMVC接受文件的时候能对应起来: 3.JS代码 <script type=&q

怎么通过js获取上传的图片信息(临时保存路径,名称,大小)然后通过ajax传递给后端?

今天在论坛上看到这样一个问题,有必要编辑搜集下. 问题描述:怎么通过js获取上传的图片信息(临时保存路径,名称,大小)然后通过ajax传递给后端 题主用jquery接收 <input name="c_pic" id="c_pic" type="file" class="file"> 用的方法是: var input = document.getElementById("c_pic"); inpu

兼容各浏览器的js判断上传文件大小

由于项目需要,在网上找了一个JS判断上传文件大小的程序,经测试兼容IE6-9,Firefox10,Opera11.6,safari5.1,chrome17 <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>js判断上传文件的大小</titl

Java 微信公众号上传永久素材的方法

Java 微信公众号上传永久素材的方法 学习了:http://blog.csdn.net/u013791374/article/details/53258275 膜拜一下,源码如下: @RequestMapping(value="create") public String create(@RequestParam MultipartFile file, HttpServletRequest request, HttpServletResponse response, HttpSess