免费观看又色又爽又黄的小说免费_美女福利视频国产片_亚洲欧美精品_美国一级大黄大色毛片

微信小程序之多文件下載的簡單封裝示例

需求

成都創新互聯是一家專注于網站建設、成都網站設計與策劃設計,烏魯木齊網站建設哪家好?成都創新互聯做網站,專注于網站建設十載,網設計領域的專業建站公司;建站業務涵蓋:烏魯木齊等地區。烏魯木齊做網站價格咨詢:18982081108

需要生成一個宣傳的圖片分享到朋友圈，這個宣傳圖片包含二維碼，包含不同的背景圖片和不同的文字。對于這種圖片生成，我們考慮過使用服務端生成，但是這樣會比較耗服務器性能，所以最終決定使用本地生成。

首先小程序有一個限制，包不能大于2m，而且我們可能多個背景圖，所以計劃把背景圖和二維碼圖片放在服務端，這樣可以減少小程序包的大小，也可以靈活的切換背景圖。

在繪制分享圖的時候，可以直接使用互聯網地址，但是遇到了一個問題，有可能不能生成圖片，所以我們需要把這個圖片文件下載下來。

下載文件的方法微信有API，但是返回的是文件的臨時路徑，只在小程序本次啟動期間可以正常使用，如需持久保存，需在主動調用 wx.saveFile，才能在小程序下次啟動時訪問得到。

所以我們先把下載文件和保存文件封裝

封裝下載并且保存一個文件

這個方法比較簡單

參數：一個對象，包含

  1. id 需要下載文件的id，如果不傳默認是下載的url，之所以需要id，是因為我們要做多文件下載，可以區分下載的是一個文件
  2. url 下載文件的網絡地址（需要微信小程序后臺配置，具體配置方法請參考微信官方文檔）
  3. success 成功回調 返回參數是一個對象 包含 id,savedFilePath
  4. fail 失敗回調 ,下載失敗，保存都是都算失敗
/**
 * 下載保存一個文件
 */
function downloadSaveFile(obj) {
  let that = this;
  let success = obj.success;
  let fail = obj.fail;
  let id = "";
  let url = obj.url;
  if (obj.id){
    id = obj.id;
  }else{
    id = url;
  }
  // console.info("%s 開始下載。。。", obj.url);
  wx.downloadFile({
    url: obj.url,
    success: function (res) {
      wx.saveFile({
        tempFilePath: res.tempFilePath,
        success: function (result) {
          result.id = id;
          if (success) {
            success(result);
          }
        },
        fail: function (e) {
          console.info("保存一個文件失敗");
          if (fail) {
            fail(e);
          }
        }
      })
    },
    fail: function (e) {
      console.info("下載一個文件失敗");
      if (fail) {
        fail(e);
      }
    }
  })
}

使用下載方法（wx.downloadFile(obj)）需要在微信小程序配置服務器域名,服務器域名請在 小程序后臺-設置-開發設置-服務器域名 中進行配置 ，具體請參考 微信官方文檔

封裝多文件下載并且保存

多文件下載并且保存，強制規定，必須所有文件下載成功才算返回成功

參數：一個對象，包含

  1. urls 下載地址 數組，支持多個 url下載 [url1,url2]
  2. success 下載成功 （必須所有文件下載成功才算返回成功） 回調參數 map ，key(id) -> value ({id,savedFilePath})
  3. fail 下載失敗，只要有一個方法失敗就調用失敗
/**
 * 多文件下載并且保存，強制規定，必須所有文件下載成功才算返回成功
 */
function downloadSaveFiles(obj) {
  // console.info("準備下載。。。");
  let that = this;
  let success = obj.success; //下載成功
  let fail = obj.fail; //下載失敗
  let urls = obj.urls; //下載地址 數組，支持多個 url下載 [url1,url2]
  let savedFilePaths = new Map();
  let urlsLength = urls.length; // 有幾個url需要下載
  for (let i = 0; i < urlsLength; i++) {
    downloadSaveFile({
      url: urls[i],
      success: function (res) {
        //console.dir(res);
        //一個文件下載保存成功
        let savedFilePath = res.savedFilePath;
                
        savedFilePaths.set(res.id, res);
        console.info("savedFilePath:%s", savedFilePath);
        if (savedFilePaths.size == urlsLength) { //如果所有的url 才算成功
          if (success){
            success(savedFilePaths)
          }
          
        }
      },
      fail: function (e) {
        console.info("下載失敗");
        if (fail) {
          fail(e);
        }

      }
    })
  }
}

完整的download.js文件

/**
 * 下載管理器
 * Created by 全科 on 2018/1/27.
 */
/**
 * 下載保存一個文件
 */
function downloadSaveFile(obj) {
  let that = this;
  let success = obj.success;
  let fail = obj.fail;
  let id = "";
  let url = obj.url;
  if (obj.id){
    id = obj.id;
  }else{
    id = url;
  }
  // console.info("%s 開始下載。。。", obj.url);
  wx.downloadFile({
    url: obj.url,
    success: function (res) {
      wx.saveFile({
        tempFilePath: res.tempFilePath,
        success: function (result) {
          result.id = id;
          if (success) {
            success(result);
          }
        },
        fail: function (e) {
          console.info("保存一個文件失敗");
          if (fail) {
            fail(e);
          }
        }
      })

    },
    fail: function (e) {
      console.info("下載一個文件失敗");
      if (fail) {
        fail(e);
      }

    }
  })
}
/**
 * 多文件下載并且保存，強制規定，必須所有文件下載成功才算返回成功
 */
function downloadSaveFiles(obj) {
  // console.info("準備下載。。。");
  let that = this;
  let success = obj.success; //下載成功
  let fail = obj.fail; //下載失敗
  let urls = obj.urls; //下載地址 數組，支持多個 url下載 [url1,url2]
  let savedFilePaths = new Map();
  let urlsLength = urls.length; // 有幾個url需要下載
  for (let i = 0; i < urlsLength; i++) {
    downloadSaveFile({
      url: urls[i],
      success: function (res) {
        console.dir(res);
        //一個文件下載保存成功
        let savedFilePath = res.savedFilePath;                
        savedFilePaths.set(res.id, res);
        console.info("savedFilePath:%s", savedFilePath);
        if (savedFilePaths.size == urlsLength) { //如果所有的url 才算成功
          if (success){
            success(savedFilePaths)
          }          
        }
      },
      fail: function (e) {
        console.info("下載失敗");
        if (fail) {
          fail(e);
        }
      }
    })
  }
}
module.exports = {
  downloadSaveFiles: downloadSaveFiles
}

使用

首先導入

import download from "download.js"

之后調用

let url1 = 'https://xcx.upload.utan.com/article/coverimage/2018/01/25/eyJwaWMiOiIxNTE2ODU2Nzc0Njk3OCIsImRvbWFpbiI6InV0YW50b3V0aWFvIn0=';
let url2 = 'https://xcx.upload.utan.com/article/coverimage/2018/01/26/eyJwaWMiOiIxNTE2OTcyNDg0NDUzOSIsImRvbWFpbiI6InV0YW50b3V0aWFvIn0=';
download.downloadSaveFiles({
  urls: [url1, url2],
  success: function (res) {
    // console.dir(res);
   
    console.info(res.get(url2).savedFilePath)
  },
  fail: function (e) {
    console.info("下載失敗");
  }
);

以上就是本文的全部內容，希望對大家的學習有所幫助，也希望大家多多支持創新互聯。

網站標題：微信小程序之多文件下載的簡單封裝示例
瀏覽地址：http://m.newbst.com/article18/jeepgp.html

成都網站建設公司_創新互聯，為您提供ChatGPT、外貿網站建設、微信公眾號、網站維護、App設計、商城網站

廣告

聲明：本網站發布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網站立場，如需處理請聯系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經允許不得轉載，或轉載時需注明來源： 創新互聯

營銷型網站建設