总体思路是:在微信下选好图片后将图片上传到微信服务器,在后端使用微信服务器返回的图片 serverId 加上调用接口的 ApiTicket 通过七牛的 fetch 接口向微信服务器下载多媒体文件的接口请求图片的二进制流,然后保存至自己七牛账号内的特定 bucket。
大致过程如下:

1.调用微信 chooseImage 接口,成功后调用 uploadImage 接口

wx.chooseImage({
count: 1,
sizeType: ['original', 'compressed'],
sourceType: ['album', 'camera'],
success: function(res) {
$scope.localIds = res.localIds; //存储localId供本地预览
wx.uploadImage({
localId: res.localIds[0],
isShowProgressTips: 1,
success: function(res) {
WishData.mediaId = res.serverId; //图片上传成功后保存serverId然后发给后台,让后台根据serverId去微信服务器下载对应的图片
}
});
}
});

2.在后台使用七牛的 fetch 接口向微信服务器请求文件并存入自己的七牛仓库

var client = new qiniu.rs.Client();
var random_key = Math.random().toString(36).substr(2, 15); //生成一个随机字符串来给图片命名
//调用七牛 fetch 接口,具体用法参照文档
client.fetch('http://file.api.weixin.qq.com/cgi-bin/media/get?access_token=' + req.session.apptoken + '&media_id=' + req.body.mediaId, 'gdutgirl', random_key, function(err, ret) {
if (err) {
console.log(err.error);
next();
} else {
console.log('图片请求成功');
var url = qiniu.rs.makeBaseUrl('7xnxuw.com1.z0.glb.clouddn.com', random_key); //生成图片的可访问url
req.body.imgurl = url;
next();
} });

其中需要特别注意的地方是,通过微信返回的 serverId 去微信服务器下载图片的接口微信公众号微信企业号是不一样的(微信企业号开发文档没有提供媒体下载接口以为是同公众号下载接口一样,结果总是提示 aceess_token

使用微信 SDK 上传图片到七牛的更多相关文章

  1. axios上传图片(及vue上传图片到七牛))

    浏览器上传图片到服务端,我用过两种方法: 1.本地图片转换成base64,然后通过普通的post请求发送到服务端. 操作简单,适合小图,以及如果想兼容低版本的ie没办法用此方法 2.通过form表单提 ...

  2. node+express上传图片到七牛

    本人微信公众号:前端修炼之路,欢迎关注 最近做项目的时候有一个上传图片的需求,由于没有后端的配合,所以决定自己来搭个服务器,实现上传图片功能.以后如果需要修改成java或者php为后端,直接使用即可, ...

  3. UEditor上传图片到七牛C#(后端实现)

    由于个人网站空间存储有所以选择将图片统一存储到七牛上,理由很简单 1  免费10G 的容量  ,对个人网站足够用 2  规范的开发者文档 和完善的sdk(几乎所有热门语言sdk) 整体思路 图片上传七 ...

  4. koa-ueditor上传图片到七牛

    问题描述:服务器系统架构采用的是koa(并非koa2),客户端富文本编辑器采用的是百度的ueditor控件.现在需要ueditor支持将图片直接上传到七牛云. 前提:百度的ueditor需要在本地配置 ...

  5. JAVA简单上传图片至七牛

    utils package com.example.demo.utils; import com.alibaba.fastjson.JSONObject; import com.qiniu.commo ...

  6. 微信sdk上传图片大小1k,损坏的问题以及微信上传图片需要的配置

    微信公众号的appid和appsecret有问题,会导致上传图片大小为1k这个问题 微信上传图片需要设置公众号的'JS接口安全域名'

  7. vue项目中使用element ui上传图片到七牛

    1.获取token值 后台有接口调用直接返回token值 //请求后台拿七牛云token async getQiniuToken() { //token let uploadtoken = await ...

  8. UEditor上传图片到七牛云储存(java)

    我们的网站一般放在虚拟空间或者服务器上,图片如果存在本地目录,会占用很多空间和流量,还增加了负担,好的办法是把图片存放到云储存服务里面,平时用url去拿 云储存:普遍说又拍云和七牛比较好,看到七牛免费 ...

  9. UEditor上传图片到七牛云储存(c#)

    我们的网站一般放在虚拟空间或者服务器上,图片如果存在本地目录,会占用很多空间和流量,还增加了负担,好的办法是把图片存放到云储存服务里面,平时用url去拿 云储存:普遍说又拍云和七牛比较好,看到七牛免费 ...

随机推荐

  1. excel笔记

    提取单元格中的数字部分 =MID(LOOKUP(1,-(1&MID(A1,MIN(FIND({0;1;2;3;4;5;6;7;8;9},A1&1/17)),ROW($1:$15)))) ...

  2. iOS 事件处理机制与图像渲染过程

    Peter在开发公众号功能时触发了一个bug,导致群发错误.对此我们深表歉意,并果断开除了Peter.以下交回给正文时间: iOS 事件处理机制与图像渲染过程 iOS RunLoop都干了什么 iOS ...

  3. E - Number Sequence(第二季水)

    Description A single positive integer i is given. Write a program to find the digit located in the p ...

  4. Eclipse运行Tomcat7源码

    1. 各环境版本: jdk1.6.0_45 (亲测jdk1.7.0_07会有问题,不要用1.7版本的) apache-ant-1.9.4 apache-tomcat-7.0.61-src 2. 安装a ...

  5. 【Lucene4.8教程之三】搜索

    1.关键类 Lucene的搜索过程中涉及的主要类有以下几个: (1)IndexSearcher:执行search()方法的类 (2)IndexReader:对索引文件进行读操作,并为IndexSear ...

  6. 独木舟上的旅行--nyoj题目71

    独木舟上的旅行 时间限制:3000 ms  |  内存限制:65535 KB 难度:2   描述 进行一次独木舟的旅行活动,独木舟可以在港口租到,并且之间没有区别.一条独木舟最多只能乘坐两个人,且乘客 ...

  7. 1002 Fire Net

    用递归实现各种情况的枚举,可以看做是考察DPS的简单实现. #include <stdio.h> ][]; int place(int x,int y){ int i; ;i--){ ) ...

  8. Gradle方式构建Java多项目

    0: 安装IDEA:Linux 上只需下载IDEA的包 并且将路径配置在PATH全局变量中./etc/profile export PATH=$PATH:/opt/Software/IDEA/idea ...

  9. Asp.net MVC4 下二级联动

    效果图:

  10. SQL Server 创建全文索引

    背景知识: 全文目录是全文索引是容器.所以在创建全文索引前要有全文目录. 第一步: 创建全文目录: create fulltext catalog catalog_name [on filegroup ...