调取微信拍照,上传图片的接口

2018-07-23  本文已影响0人  _daraDu
<div class="weui_cells weui_cells_form">
    <div class="weui_cell"><!--图片上传-->
        <div class="weui_cell_hd"><label class="weui_label">上传图片</label></div>
            <div class="weui_cell_bd weui_cell_primary showImage" style="height: auto;">   
                <a href="javascript:void(0);" id="chooseImage" style="overflow:scroll;">
                    <img src='${ctx}/styles/iconfont/tu_04.jpg' width='65' height='65'/>
                </a>
            </div>
        </div>
     </div>
</div>
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<script>
//微信上传图片接口
    var data = null;
    var url = location.href.split('#')[0];
    var previewImagelist2 = new Array();
    var filePathlist = new Array();
    var wishCode = "gh_2838e6f79b11";
    JssdkService.getSignature(url,wishCode,function(res){
        if(res.responseCode != 0){
            alert(res.responseText);
        }else{
            data = $.parseJSON(res.responseText); 

            var timestamp = data.timestamp;
            var nonceStr = data.nonceStr;
            var signature = data.signature;
            var appId = res.responseParam1;

            wx.config({
                debug: false,  
                appId: appId,
                timestamp: timestamp,
                nonceStr: nonceStr,
                signature: signature,
                jsApiList: [
                    'checkJsApi',
                    'onMenuShareAppMessage',
                    'hideMenuItems',
                    'chooseImage',  
                    'previewImage',
                    'uploadImage',  
                ]
            });
        }
    });
    
    wx.ready(function () {
        wx.hideMenuItems({
            menuList: [
                'menuItem:share:appMessage',
                'menuItem:share:timeline',
                'menuItem:share:qq',
                'menuItem:share:weiboApp'
            ] // 要隐藏的菜单项,只能隐藏“传播类”和“保护类”按钮,所有menu项见附录3
        });
        
        var images = {
            localId: [],
            serverId: []
        };
        document.querySelector('#chooseImage').onclick = function () {
            wx.chooseImage({
              success: function (res) {
                //res.localIds 是一个数组 保存了用户一次性选择的所有图片的信息  
                images.localId = res.localIds;//把图片的路径保存在images[localId]中--图片本地的id信息,用于上传图片到微信浏览器时使用
                //alert('已选择 ' + res.localIds.length + '张图片 ');
                
                //===上传
                if (images.localId.length == 0) {
                  alert("<fmt:message key='post.publishpost.pleaseselectimg'/>");
                  return;
                }
                var i = 0, length = images.localId.length;
                images.serverId = [];
                
                function upload() {
                  wx.uploadImage({
                    localId: images.localId[i],
                    success: function (res) {
                        i++;
                        var realpath = $("#fm_realpath").val();
                        var wishCode = "gh_2838e6f79b11";
                        realpath = realpath.replace(/\\/g, "/");
                        images.serverId.push(res.serverId);
                        //下载刚刚上传的图片?dwr接口
                        //JssdkService.getMedia(res.serverId,realpath+'/mcupload', function(res){
                        JssdkService.getMediaNoPeople(res.serverId,realpath+'/mcupload', wishCode,function(res){    
                        //  alert(res.substr(45));
                            var path = res.responseParam1.split("mecwish")[1];
                            
                            if(path != null && path.length != 0){
                                filePathlist.push(path);
                                previewImagelist2.push(window.location.protocol+"//"+window.location.host+"${ctx}"+path);
                                var path_thumb = path.replace("/mcupload/","/mcupload/_thumb/");
                                var htmlitem = "";
                                htmlitem += "<a href=\"javascript:previewImage2('"+window.location.protocol+"//"+window.location.host+"${ctx}"+path+"')\">";
                                htmlitem += "<img style='' src='${ctx}"+path_thumb+"'/>";
                                htmlitem += "</a>";

                                $(".showImage").append(htmlitem);
                            }
                        });

                        if (i < length) {
                        upload();
                        }
                    },
                    fail: function (res) {
                      alert(JSON.stringify(res));
                    }
                  });
                }
                upload(); 
              }
            });
        };
        
    });
    wx.error(function (res) {
        alert(res.errMsg);
    });
    
    function previewImage(obj) {
        var currentimg = obj.title;
        previewImagelist = [];
        $(obj).parent().find("img").each(function(){
            previewImagelist.push(this.title);
        });
        wx.previewImage({
            current: currentimg,
            urls: previewImagelist
        });
    }
    function previewImage2(currentimg) {
        wx.previewImage({
          current: currentimg,
          urls: previewImagelist2
        });
    }
</script>



上一篇下一篇

猜你喜欢

热点阅读