小程式的圖片API主要是

• wx.chooseImage 選擇圖片
• wx.previewImage 預覽圖片
• wx.getImageInfo 獲取圖片的資訊
• wx.saveImageToPhotosAlbum 儲存圖片

以下通過一個案例是四種API的使用方法

描述：
1. 首先選擇本地圖片儲存到變數陣列中，然後再頁面中渲染圖片。
2. 給每個圖片一個事件，並用data-傳遞當前圖片的url，然後通過相應的事件預覽圖片。
3. 預覽成功後獲取圖片的相關資訊，
4. 最後使用儲存圖片

wxml:
<button type="primary" bindtap
 
="chooseImg">選擇圖片</button>
<!-- 通過獲取的圖片陣列，遍歷圖片 -->
<block wx:for="{{imgUrls}}" wx:key="{{index}}">
  <image src='{{item}}' data-url="{{item}}" bindtap='previewImg'></image>
</block> 

js:
Page({
  data: {
    imgUrls: []
  },
  onLoad: function (options) {
    wx.showToast({
      title: '載入中'
 
,
      icon: 'loading',
      duration: 1000,
      mask: true,
      success: function(){
        console.log('載入開始了');
      }
    })
  },
  chooseImg: function(){
    var that = this;
    wx.chooseImage({ //選擇圖片
      count: 9, //最多可以選擇圖片的張數
      sizeType: ['original', 'compressed'], // 可以指定是原圖還是壓縮圖，預設二者都有
 

      sourceType: ['album', 'camera'], // 可以指定來源是相簿還是相機，預設二者都有
      success: function(res) {
        that.setData({
          imgUrls: res.tempFilePaths  //將獲取的圖片url陣列賦值給變數
        });
      },
    })

    wx.hideToast();
  },
  previewImg: function(e){
    var current = e.target.dataset.url;
    wx.previewImage({ //預覽圖片
      current: current, //需要預覽的當前圖片的url
      urls: this.data.imgUrls,  //需要預覽的圖片連結列表
      success: function(){
        console.log("圖片預覽成功");

        wx.getImageInfo({ //獲取圖片的資訊
          src: current,
          success: function(res){
            console.log(res);  //width,height等屬性
            wx.saveImageToPhotosAlbum({ //儲存圖片
              filePath: res.path, //圖片檔案路徑
              success: function(res){
                wx.showToast({
                  title: '儲存成功',
                  icon: 'success',
                  duration: 2000
                })
                console.log('儲存圖片成功',res);
              },
              fail: function(err){
                console.log(err);
                //使用者授權
                if (err.errMsg == 'saveImageToPhotosAlbum:fail cancel'){
                  wx.openSetting({
                    success(settingdata) {
                      console.log(settingdata)
                      if (settingdata.authSetting['scope.writePhotosAlbum']) {
                        console.log('獲取許可權成功，給出再次點選圖片儲存到相簿的提示。')
                      } else {
                        console.log('獲取許可權失敗，給出不給許可權就無法正常使用的提示')
                      }
                    }
                  })
                }
              }
            })
          }
        })
      }
    })
  }
})