PHP+TP框架实现使用微信图像接口

我在前面一篇博客写到了怎么配置调用微信JS-SDK,这篇博客我来分享怎么使用微信图像接口,上传图片,

下面我们分三部说明调用微信图像接口选择图片、将图片上传至微信服务器.


一.调用微信图像接口选择照片,并实时显示.

//为按钮加上点击事件
$('#choose').click(function () {
    //调用微信选图接口,拍照或从相册选取照片

    wx.chooseImage({
        count: 9, //选择可以一次选择上传几张照片,默认9

        sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有

        sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有

        success: function (res) {
            var localIds = res.localIds; // 返回选定照片的本地ID列表,
            // localId可以作为img标签的src属性显示图片,为一个数组。

            //在本地显示图片,目的,可以将选错的图片删除重选。
            var string = '';

            for(var i in localIds){
                string = string + '<img src="'+localIds[i]+'" /><input name="imgs" hidden="hidden" value="'+
                    localIds[i]+'"/>' ;
            }

            $('#di').append(string);
        }
    });
});

二.将图片上传至微信服务器.


//确定图片无误后我们将图片上传到微信服务器
$('#uploading').click(function () {
    upLoad();
});

//定义一变量是每张本地图片id的索引
var i = 0;

//定义一个数组,保存图片在微信服务端的id
var dataImg = [];

//上传图片到微信浏览器的函数,wx.uploadImage接口一次只能上传一张图片,参数imGs是所有要上传图片的本地id组成的一个数组。
//我们上传图片,上传完成后,我们将返回图片在微信服务端的id保存在数组中
function upLoad() {
    //获取上传图片的本地id
    var imgs = $('input[name=imgs]');

    if(imgs.length > i){

        wx.uploadImage({
            localId: $(imgs[i]).val(), // 需要上传的图片的本地ID,由chooseImage接口获得
            isShowProgressTips: 1, // 默认为1,显示进度提示
            success: function (res) {
                var serverId = res.serverId; // 返回图片的服务器端ID
                //我们将图片在微信服务器在id保存在数组中
                dataImg[i] = serverId;
                i++;
                upLoad();
            }
        });
    }
}
  • 2
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值