Un package simple pour télécharger plusieurs fichiers dans le mini-programme WeChat

Cet article présente principalement un exemple d'encapsulation simple pour télécharger plusieurs fichiers dans l'applet WeChat. L'éditeur pense que c'est plutôt bon, je vais donc le partager avec vous maintenant et le donner comme référence. Suivons l'éditeur et jetons un coup d'œil.

Exigences

Vous devez générer une image promotionnelle à partager dans votre cercle d'amis. Cette image promotionnelle contient un code QR. et différents arrière-plans Images et textes différents. Pour ce type de génération d'images, nous avons envisagé d'utiliser la génération côté serveur, mais cela consommerait plus de performances du serveur, nous avons donc finalement décidé d'utiliser la génération locale.

Tout d'abord, le mini-programme a une limitation. Le package ne peut pas dépasser 2 m, et nous pouvons avoir plusieurs images d'arrière-plan, nous prévoyons donc de mettre les images d'arrière-plan et les images de code QR sur le serveur, ce qui peut réduire la taille du mini-programme. Vous pouvez également changer de manière flexible les images d'arrière-plan.

Lorsque vous dessinez une image partagée, vous pouvez utiliser directement l'adresse Internet, mais nous avons rencontré un problème et nous ne pourrons peut-être pas générer l'image, nous devons donc télécharger le fichier image.

WeChat dispose d'une API pour télécharger des fichiers, mais le chemin temporaire du fichier est renvoyé, qui ne peut être utilisé normalement que lors du démarrage actuel du mini-programme. Si vous devez le sauvegarder de manière persistante, vous devez le faire. appelez activement wx.saveFile avant de pouvoir le faire. L'applet sera accessible au prochain démarrage.

Nous encapsulons donc d'abord le fichier téléchargé et le fichier enregistré

Encapsulons le fichier téléchargé et enregistré

Cette méthode est relativement simple

Paramètres : un objet, comprenant

1. id. L'identifiant du fichier qui doit être téléchargé. S'il n'est pas transmis, la valeur par défaut est l'URL de téléchargement. La raison pour laquelle l'identifiant est nécessaire. c'est parce que nous devons télécharger plusieurs fichiers et pouvons les distinguer. Ce qui est téléchargé est un fichier

2. url L'adresse réseau du fichier téléchargé (nécessite la configuration en arrière-plan de l'applet WeChat, veuillez vous référer à WeChat. documentation officielle pour les méthodes de configuration spécifiques)

3. Le paramètre de retour de rappel de réussite est un objet contenant l'identifiant, SaveFilePath

4. échec de rappel, échec de téléchargement, et l'enregistrement sont tous considérés comme des échecs

/**
 * 下载保存一个文件
 */
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);
      }
    }
  })
}

L'utilisation de la méthode de téléchargement (wx.downloadFile(obj)) nécessite la configuration du domaine du serveur nom dans l'applet WeChat. Pour le nom de domaine du serveur, veuillez vous rendre en arrière-plan de l'applet - Paramètres - Paramètres de développement - Configurer le serveur dans le nom de domaine, veuillez vous référer à la documentation officielle de WeChat pour plus de détails

Encapsuler le téléchargement et l'enregistrement de plusieurs fichiers

Télécharger et enregistrer plusieurs fichiers Il est obligatoire que tous les fichiers soient téléchargés avec succès

Paramètres : un objet, y compris

.

1. tableau d'adresses de téléchargement d'URL, prend en charge plusieurs téléchargements d'URL [url1, url2]

2. le téléchargement réussi est réussi (tous les fichiers doivent être téléchargés avec succès pour être considéré comme réussi ) carte des paramètres de rappel, key(id) -> value ({id,savedFilePath})

3. fail Le téléchargement échoue Tant qu'une méthode échoue, l'appel échoue

   .

/**
 * 多文件下载并且保存，强制规定，必须所有文件下载成功才算返回成功
 */
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);
        }

      }
    })
  }
}

Fichier download.js complet

/**
 * 下载管理器
 * 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
}

Utilisez

d'abord importer

import download from "download.js"

Puis appelez

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("下载失败");
  }
);

Ce qui précède représente l'intégralité du contenu de cet article. J'espère qu'il sera utile à l'apprentissage de chacun. Pour plus de contenu connexe, veuillez faire attention au site Web PHP chinois !

Recommandations associées :

Mini programme WeChat L'utilisation de boucles et de boucles imbriquées

Comment revenir à la page d'accueil de la page de partage d'applet WeChat

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!