【微信技术-微信公众号】-------- 实现拍照或选择相册接口:wx.chooseImage的使用实例[JS-SDK]

 一，【JS-SDK】拍照或从手机相册中选图接口:wx.chooseImage的使用实例.

1.使用wx.chooseImage接口需要如下几步缺一不可：

这里我是使用（测试公众号）测试出来的效果。

（1）请到微信官方文档的公众号下看说明文档：（必须先了解 才好看继续下面的示例）

 （2）请按步骤进行配置：上图的【1.1.1-1.1.5】的步骤来进行，才能调用【wx.chooseImage】否则是没有权限的，会提示【errMsg: "chooseImage:fail, the permission value is offline verifying"】这个错误。

 可以看我这篇文章【有1.1.1-1.1.5代码】：

【微信技术-微信公众号】------- 通过Java和JavaScript实现获取地理位置接口:wx.getLocation的使用实例【JS-SDK】_皮皮冰要做大神-CSDN博客一，分为前端【Jquery+微信JS-SDK】、后端[Java+SpringBoot]两部部分。1.前端:(1).引用Jq脚本文件.<script src="/libs/jquery/jquery-3.2.1.min.js"></script>(2).引用微信js-sdk的脚本文件.<script src="http://res2.wx.qq.com/open/js/jweixin-1.6.0.js"></script>(3..https://blog.csdn.net/qq_38366657/article/details/122430842

 （3）上面配置好后 接下来就可以使用：wx.chooseImage 【下面是部分重要代码】

 //拍照
    $("#btn-upload").off("click").on("click",function () {
        wx.chooseImage({
            count: 3, // 默认9
            sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
            sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
            success: function (res) {
         
                var localIds = res.localIds; // 返回选定照片的本地ID列表，localId可以作为img标签的src属性显示图片
                for(var i=0;i<localIds.length;i++){
                    fnGetLocalImgData(localIds[i]);
                }
                
            },
            fail:function (res) {
                layer.msg(res);
            }
        });
    });
  
    function fnGetLocalImgData(localID) {
        wx.getLocalImgData({
            localId: localID, // 图片的localID
            success: function (res) {
        
                var localData = "data:image/png;base64,"+res.localData; // localData是图片的base64数据，可以用img标签显示
                $("img").attr("src",localData);
               
            }
        });
    }

效果如下： 

 

三，常见的问题提示：

1. 拍照功能无法使用报错 可能是【域名没有在公众号白名单里面】或【当前无权限使用接口】或者【当前没有在微信里面运行因为他是属于微信的 只能在微信里面使用】。