微信小程序 常用API

1. 保存图片

API： wx.getImageInfo():获取图片路径； wx.saveImageToPhotosAlbum() 保存图片
关键点:通过模态框去引导用户进行授权操作: wx.showModal()，wx.openSetting()

// 保存图片
saveImg() {
    let current = this.data.imageurl
    let that = this
    console.log("saveImgBtn", current)
    wx.showLoading({
      title: '保存中'
    })
    wx.getImageInfo({
      src: current,
      success: function(res) {
        wx.saveImageToPhotosAlbum({
          filePath: res.path,
          success: function(res) {
            wx.hideLoading();
            wx.showToast({
              title: '保存成功',
              icon: 'success'
            }, 2000)
          },
          fail: function(res) {
            wx.hideLoading()
            if (res.errMsg === "saveImageToPhotosAlbum:fail:auth denied" || res.errMsg === "saveImageToPhotosAlbum:fail auth deny" || res.errMsg === "saveImageToPhotosAlbum:fail authorize no response") {
              // 这边微信做过调整，必须要在按钮中触发，因此需要在弹框回调中进行调用
              that.imageRrrorAuth()
            } else {
              wx.showToast({
                title: '保存失败',
                icon: 'none'
              })
            }
          }
        })
      },
      fail: function(error) {
        console.log("roo", error)
      }
    })
  },
 // 授权失败 提示授权操作
  imageRrrorAuth(){
    wx.showModal({
      title: '提示',
      content: '需要您授权保存相册',
      showCancel: false,
      success: modalSuccess => {
        wx.openSetting({
          success(settingdata) {
            console.log("settingdata", settingdata)
            if (settingdata.authSetting['scope.writePhotosAlbum']) {
              wx.showModal({
                title: '提示',
                content: '获取权限成功,再次保存图片即可',
                showCancel: false,
              })
            } else {
              wx.showModal({
                title: '提示',
                content: '获取权限失败，将无法保存到相册',
                showCancel: false,
              })
            }
          },
          fail(failData) {
            console.log("failData", failData)
          },
          complete(finishData) {
            console.log("finishData", finishData)
          }
        })
      }
    })
  },

2. 上传图片

先使用wx.chooseImage() 选择图片，然后wx.uploadFile() 将filePath 图片的路径POST到服务器。
tips：限制最多三张上传

 <view class='addImage'>
    <view class='commentImage' wx:for="{{imgList}}" wx:key="{{index}}">
          <image bindtap='previewImage' data-index="{{index}}" data-url='{{imageHost+item}}' src="{{imageHost+item}}">image>
          <image data-index="{{index}}" bindtap="deleteImage" class='close' style="width:50rpx;height:50rpx;"                      src='/images/closed.png'>image>
    view>
    <image wx:if="{{imgList.length<3}}" src="/images/addImageIcon.png" bindtap="chooseimage">image>
  view>

  chooseImage: function(e) {
    let that = this;
    let userId = wx.getStorageSync("id");
    let imgList = that.data.imgList
    let imgCount = 3 - imgList.length; // 为了确定已经还能上传几张 ，设置最多三张上传
    wx.chooseImage({
      count: imgCount, // 默认9,最多上传9  
      sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有  
      sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有  
      success: function(res) {
        // 返回选定照片的本地文件路径列表，tempFilePath可以作为img标签的src属性显示图片  
        let tempFilePaths = res.tempFilePaths
        // console.log("tempFilePaths", JSON.stringify(tempFilePaths))
        for (let i = 0; i < tempFilePaths.length; i++) {
          let tempFilePath = tempFilePaths[i] + ''
          that.uploadImg(tempFilePath)
        }
      }
    })
  },
  uploadImg(tempFilePath) {
    let imgList = this.data.imgList
    let token = wx.getStorageSync("token");
    let that = this;
    wx.uploadFile({
      url: API.api.userMemos,
      method: 'POST',
      header: {
        "Content-Type": "application/json",
        'Authorization': token
      },
      filePath: tempFilePath,
      name: 'file', //文件对应的参数名字(key)   
      success: function(res) {
        var fPath = [];
        fPath.push(JSON.parse(res.data).filePath);
        console.log("图片上传完成: " + res.data);
        if (res.statusCode == 500) {
          wx.showToast({
            title: '图片大小不超过5M',
            icon: 'none'
          })
        } else {
          imgList.push(fPath[0])
          that.setData({
            imgList
          })
          console.log("imgList2", imgList)
        }
      }
    })
  },
 // 预览图片
  previewImage(e) {
    console.log("previewImage:::::" + e.currentTarget.dataset.url)
    let url = e.currentTarget.dataset.url;
    let imgList = this.data.imgList;
    let imageHost = this.data.imageHost;
    let urls = [];

    for (let i = 0; i < imgList.length; i++) {
      urls.push(imageHost + "" + imgList[i])
    }
    console.log("urls:::::" + JSON.stringify(urls))

    wx.previewImage({
      current: url, // 当前显示图片的http链接
      urls: urls // 需要预览的图片http链接列表
    })
  },
  // 删除图片
  deleteImage(e) {
    console.log(JSON.stringify(e));
    let that = this;
    let index = e.currentTarget.dataset.index;
    let imgList = that.data.imgList;
    imgList == imgList.splice(index, 1);
    that.setData({
      imgList: imgList
    })
  },

3. 用户授权 获取用户信息

    <button class='btn' open-type="getUserInfo" bindgetuserinfo='authorize'>button>

  authorize(){
    if (e.detail.errMsg == 'getUserInfo:fail auth deny') {
      // 弹提示框，重新授权
      wx.showModal({
        title: '授权失败',
        content: '请重新授权',
        showCancel: false,
        success: function(e) {}
      })
    } else {
    // 授权成功进行的操作
      console.log(JSON.parse(e.detail.rawData).avatarUrl);
      console.log(JSON.parse(e.detail.rawData).nickName);
    }
   }

4. 获取formId，用于发送模板消息

  <form bindsubmit='getFormId' report-submit='true'>
  	<button form-type='submit'>确认button>
  form>

  getFormId (e) {
    let formId = e.detail.formId
    console.log("formId", formId)
  },

5. 小程序版本更新

updataApp: function () {//版本更新
    if (wx.canIUse('getUpdateManager')) {
      const updateManager = wx.getUpdateManager()
      updateManager.onCheckForUpdate(function (res) {
        if (res.hasUpdate) { // 请求完新版本信息的回调
          updateManager.onUpdateReady(function () {
            wx.showModal({
              title: '更新提示',
              content: '新版本已经准备好，是否重启应用？',
              success: function (res) {
                if (res.confirm) {// 新的版本已经下载好，调用 applyUpdate 应用新版本并重启
                  updateManager.applyUpdate()
                }
              }
            })
          })
          updateManager.onUpdateFailed(function () {
            wx.showModal({// 新的版本下载失败
              title: '已经有新版本了哟~',
              content: '新版本已经上线啦~，请您删除当前小程序，重新搜索打开哟~',
            })
          })
        }
      })
    } else {
      wx.showModal({// 如果希望用户在最新版本的客户端上体验您的小程序，可以这样子提示
        title: '提示',
        content: '当前微信版本过低，无法使用该功能，请升级到最新微信版本后重试。'
      })
    }
  },