在小程式中，有時資料中含有一些必要的文件需要下載，當我們與後端互動得到了文件的URL後，無法直接預覽，需要將其下載，然後再預覽。

UI程式碼如下

 <view bindtap='previewFile' data-url='{{doc.Url}}'>
      <label>文件:</label>{{doc.Name}}</view>

 previewFile: function (event) {
    var that = this;
    var url = event.currentTarget.dataset.url;
    if (url === undefined || url === null || url.length <= 0) {
      wx.showToast({
        title: 'URL為空',
      })
      return;
    }

    var index1 = url.lastIndexOf(".");
    var suffixName = url.substring(index1 + 1, url.length);//字尾名 
    if (suffixName === undefined || suffixName === null || suffixName.length <= 0) {
      wx.showToast({
        title: '無法從URL中解析出字尾名',
      })
      return;
    }
    suffixName = suffixName.toLowerCase();

    var imageSuffixArr = ["bmp", 'jpg', 'jpeg', 'png', 'gif'];
    for (var i = 0; i < imageSuffixArr.length; i++) {
      if (suffixName == imageSuffixArr[i]) {
         wx.previewImage({
           urls: [url],
         })
	return;
      }
    }

    var supportSufixArr = ['doc', 'xls', 'ppt', 'pdf', 'docx', 'xlsx', 'pptx'];
    var isSupport = false;
    for (var i = 0; i < supportSufixArr.length; i++) {
      if (suffixName == supportSufixArr[i]) {
        isSupport = true;
        break;
      }
    }
    if (!isSupport) {
      wx.showToast({
        title: '不支援' + suffixName,
      })
      return;
    }
    wx.showLoading({
      title: '載入中..',
    })
    wx.downloadFile({
      url: url,
      success: function (res) {
        var filePath = res.tempFilePath;
        console.log(filePath);
        wx.openDocument({
          filePath: filePath,
          success: function () {
            console.log("開啟文件成功:" + url);
            wx.hideLoading();
          },
          fail: function (r) {
            console.log(r);
            wx.hideLoading();
            wx.showToast({
              title: '開啟失敗',
              duration: 2000
            })
          },
          complete: function (r) {
            console.log(r);
            wx.hideLoading();
          }
        })
      },
      fail: function (r) {
        console.log("下載失敗:" + url + "." + r);
        wx.hideLoading();
        wx.showToast({
          title: '下載失敗',
          duration: 2000
        })
      }
    })
  }
 

需要注意：下載文件的時候，必須要在小程式的後臺將URL的域名配置到下載的列表中，同時需要採用https，否則會下載失敗。在沒的手機中，對https協議支援版本不同，所以必須要支援多版本的HTTPS才好，不然有的手機會用不了(可能會出現socket hang up的錯誤提示。)，有的手機可以用。這樣又會成為一個神坑了。

轉載請註明出處。