WeChat 미니 프로그램에서 여러 파일을 다운로드하기 위한 간단한 캡슐화 예제

이 글은 주로 WeChat 미니 프로그램에서 여러 파일을 다운로드하기 위한 간단한 캡슐화 예제를 소개합니다. 편집자가 꽤 좋다고 생각해서 지금 공유하고 참고용으로 제공하겠습니다. 편집자를 따라가서 모두에게 도움이 되기를 바랍니다.

요구 사항

친구들과 공유하려면 홍보 이미지를 생성해야 합니다. 이 홍보 이미지에는 QR 코드, 다양한 배경 이미지 및 다양한 텍스트가 포함되어 있습니다. 이런 종류의 이미지 생성을 위해 우리는 서버 측 생성을 사용하는 것을 고려했지만 서버 성능이 더 많이 소모되므로 결국 로컬 생성을 사용하기로 결정했습니다.

먼저 미니 프로그램에는 제한이 있는데, 패키지가 2m를 넘을 수 없고 배경 이미지가 여러 개 있을 수 있으므로 배경 이미지와 QR 코드 이미지를 서버에 올려서 크기를 줄일 수 있도록 할 계획입니다. 미니 프로그램 패키지의 배경 이미지를 전환하여 유연하게 만듭니다.

공유된 이미지를 그릴 때 인터넷 주소를 직접 사용해도 되지만, 문제가 발생하여 이미지를 생성하지 못할 수도 있어 이미지 파일을 다운로드 받아야 합니다.

WeChat에는 파일 다운로드를 위한 API가 있지만 파일의 임시 경로를 반환하므로 현재 미니 프로그램 시작 중에만 정상적으로 사용할 수 있습니다. 지속적으로 저장해야 하는 경우 wx를 적극적으로 호출해야 합니다. 다음에 미니 프로그램이 시작되기 전에 saveFile에 액세스합니다.

그래서 먼저 다운로드한 파일과 저장된 파일을 캡슐화합니다.

다운로드를 캡슐화하고 파일을 저장합니다.

이 방법은 비교적 간단합니다.

매개변수:

1. id를 포함한 개체 통과하지 못한 경우 다운로드해야 합니다. ID가 필요한 이유는 여러 파일을 다운로드해야 하기 때문입니다.

2. url의 네트워크 주소입니다. 다운로드한 파일 (WeChat 애플릿 백그라운드 구성이 필요합니다. 구체적인 구성 방법은 WeChat 공식 문서를 참조하세요.)

3. success 성공 콜백의 반환 매개변수는 id, saveFilePath

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))을 사용하여 WeChat 미니 프로그램에서 서버 도메인 이름을 구성해야 합니다. 미니 프로그램에서 서버 도메인 이름을 구성하세요. background-settings-development settings-server 도메인 이름 자세한 내용은 공식 WeChat 설명서를 참조하세요

여러 파일 다운로드를 캡슐화하고 저장

여러 파일을 다운로드하고 저장하기 전에 모든 파일을 성공적으로 다운로드해야 합니다. 반환이 성공했습니다

매개변수:

1. urls 다운로드 주소 배열을 포함하는 개체, 여러 URL 다운로드 지원 [url1, url2]

2. 성공 다운로드가 성공했습니다(성공한 것으로 간주하려면 모든 파일을 성공적으로 다운로드해야 함) 콜백 매개변수 맵, 키(id) -> 값 ({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 파일 완료

ㅋㅋㅋ

간단한 캡슐화를 위한 코드 케이스 WeChat 애플릿의 네트워크 요청

php

에서 mysql 모듈의 일부 기능을 간단하게 캡슐화했습니다.

위 내용은 WeChat 미니 프로그램에서 여러 파일을 다운로드하기 위한 간단한 캡슐화 예제의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!