微信内置浏览器打开h5页面上传图片

微信 jssdk 微信内上传

<input type="file" class="opacity0" accept="image/*"> //微信内部使用，外部使用accept="images/*"

或者

用微信打开h5页面，直接使用以下input是不允许上传图片的。直接使用微信提供的jssdk，去调用微信内部的方法才能上传

<input type="file" accept="images/*">  //微信内置浏览器是不允许用这样直接上传图片，坑

https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html

html:

<button @click="selectimg">选择图片</button>
<button @click="upimg">上传</button>
<img id="img11" src=""> <!--预览图片-->

这里显示上传需要的部分代码：

jsApiList: [
 'chooseImage',
 'uploadImage',
 'getLocalImgData',
 'downloadImage',
]

selectimg:function(){  //选择要上传图片
  var self=this;
  wx.chooseImage({
    count: 9, // 默认9
    sizeType: ['original', 'compressed'],
    sourceType: ['album', 'camera'],
    success: function (res) {
     // Tools.dialog.alert(res.localIds[0]);
       self.wxid=res.localIds;
       Tools.dialog.alert(self.wxid);

    }
  });
},


upimg:function(){
  var self=this;
  wx.uploadImage({   //上传图片
    localId: self.wxid.toString(),
    isShowProgressTips: 1,
    success: function (res) {


      wx.downloadImage({   //下载图片
        serverId: res.serverId,
        isShowProgressTips: 1,
        success: function (ress) {


            wx.getLocalImgData({  //获取图片
              localId: ress.localId, // 图片的localID
              success: function (res) {
                var localData = 'data:image/jpg;base64,'+res.localData; // localData是图片的base64数据，可以用img标签显示
                //Tools.dialog.alert(localData)
                $('#img11').attr({src:localData});
              }
            });

        }
      });


    }
  });
},

《微信jssdk授权签名以及config配置》

《微信公众号授权第三方 OAuth2.0》