zoukankan      html  css  js  c++  java
  • 微信拍照上传

              //获取微信参数
                    $.ajax({
                        type:"get",
                        url:"/getWeChatParm",
                        async:false,
                        data:{
                            url:'',//当前网址
                        },
                        success:function(data){
                             wxAppId = data.appId;
                             wxTimestamp = data.timestamp;
                             wxNonceStr = data.noncestr;
                             wxSignature = data.signature;
                        }
                    });
                    
                    //拍照上传
                    wx.config({
                        debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
                        appId: wxAppId, // 必填,公众号的唯一标识
                        timestamp:wxTimestamp, // 必填,生成签名的时间戳
                        nonceStr:wxNonceStr , // 必填,生成签名的随机串
                        signature: wxSignature, // 必填,签名,见附录1
                        jsApiList: [
                                'chooseImage',
                                'uploadImage'
                        ] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2
                    });
                    wx.ready(function() {
                        var images = {
                            localId: [],
                            serverId: [],
                        }
                    });
                    $submitpic.click(function(){  //点击按钮进行拍照
                        wx.chooseImage({
                            count: 1, // 默认9
                            sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有
                            sourceType: ['camera'], // 可以指定来源是相册还是相机,默认二者都有
                            success: function(res) {
                                images.localId = res.localIds; // 返回选定照片的本地ID列表,localId可以作为img标签的src属性显示图片
                                len = images.localId.length;//返回本地Id列表的长度
                                uploadimage(images.localId);//上传图片到服务器
                                $(".pic").append("<img src="+images.localId+"/>")
                            }
                        })
                    });
                    var uploadimage     = function(localIds) {
                        var localId = localIds.shift();//每次选取ID列表的第一个上传
                        wx.uploadImage({
                            localId: localId, // 需要上传的图片的本地ID,由chooseImage接口获得
                            isShowProgressTips: 1, // 默认为1,显示进度提示
                            success: function(res) {
                                images.serverId.push(res.serverId);//把上传的微信服务器id存储到image对象里
                                if(len == images.serverId.length) {
                                     serverids = images.serverId.join(',');//把数组改成字符串
                                    //uploadserverid(serverids);//把数据上传到本地服务器
                                    //images.localId = images.serverId = [];//销毁数据
                                }
                                if(localIds.length > 0) {
                                    uploadimage(localIds);//如果还有图片未上传到
                                }
                            },
                            error: function() {
                                alert("上传失败");
                            }
                        });
                    }

    最近项目遇到的需求,在网上找了很多,最后总结出来的,希望对各为有帮助。

    本人也有一个讨论web前端开发的群:556198274 平时也会上传一些学习文档在群里,对技术问题也可以互相讨论,大家相互学习。

  • 相关阅读:
    今天你们表现的真棒!!!
    多久没有给家里打过电话了?
    算法>并行算法 小强斋
    设计模式>单一职责原则 小强斋
    设计模式>里氏替换原则 小强斋
    设计模式>依赖倒置原则 小强斋
    设计模式>里氏替换原则 小强斋
    设计模式>接口隔离原则 小强斋
    设计模式>接口隔离原则 小强斋
    设计模式>单一职责原则 小强斋
  • 原文地址:https://www.cnblogs.com/zhizu/p/8241847.html
Copyright © 2011-2022 走看看