ZBLOG

Vue.prototype.zipMedia = async function(media) { const zip = new JSZip(); console.log("media.length: ", media.length); console.log("zipMedia_media: ", media); if (!media || media.length === 0) { return null; // 返回 null 表示没...

好的,下面是你提供的代码重构为使用 uni.request 的版本。我们将 loadLocalFile 函数替换为利用 uni.request 来获取文件内容。

  1. Vue.prototype.zipMedia = async function(media) {
  2. const zip = new JSZip();
  3. console.log("media.length: ", media.length);
  4. console.log("zipMedia_media: ", media);
  5. if (!media || media.length === 0) {
  6. return null; // 返回 null 表示没有媒体文件
  7. }
  8. // 创建一个数组来存储所有媒体文件的 Promise
  9. const mediaPromises = media.map(async (filePath, i) => {
  10. console.log("Processing file:", filePath);
  11. // 验证文件路径
  12. if (!isValidFilePath(filePath)) {
  13. console.error('Invalid file path:', filePath);
  14. throw new Error('Invalid file path');
  15. }
  16. // 获取文件扩展名
  17. const ext = getFileExtension(filePath).toLowerCase();
  18. console.log("File extension:", ext);
  19. try {
  20. // 使用 uni.request 加载文件内容
  21. const blob = await loadLocalFile(filePath);
  22. // 将文件添加到 zip 中
  23. zip.file(`file${i + 1}.${ext}`, blob);
  24. console.log("File added to zip:", `file${i + 1}.${ext}`);
  25. } catch (error) {
  26. console.error('Error processing file:', filePath, error);
  27. throw error;
  28. }
  29. });
  30. // 等待所有文件处理完成
  31. try {
  32. await Promise.all(mediaPromises);
  33. } catch (error) {
  34. console.error('Failed to process some files:', error);
  35. throw error;
  36. }
  37. // 生成 zip 文件
  38. try {
  39. const content = await zip.generateAsync({ type: 'blob' });
  40. return content;
  41. } catch (error) {
  42. console.error('Failed to generate zip file:', error);
  43. throw error;
  44. }
  45. };
  46. // 自定义加载本地 URL 文件的函数示例,使用 uni.request 替代 XMLHttpRequest
  47. async function loadLocalFile(filePath) {
  48. return new Promise((resolve, reject) => {
  49. uni.request({
  50. url: filePath,
  51. method: 'GET',
  52. responseType: 'arraybuffer', // 设置响应类型为 arraybuffer,以便后续转 Blob
  53. success: (res) => {
  54. if (res.statusCode === 200 && res.data) {
  55. resolve(new Blob([res.data])); // 将 arraybuffer 转为 Blob 对象并返回
  56. } else {
  57. reject(new Error('Failed to load local file'));
  58. }
  59. },
  60. fail: () => {
  61. reject(new Error('Network error while loading local file'));
  62. }
  63. });
  64. });
  65. }
  66. // 辅助函数:验证文件路径
  67. function isValidFilePath(filePath) {
  68. return typeof filePath === 'string' && filePath.startsWith('http://tmp/');
  69. }
  70. // 辅助函数:获取文件扩展名
  71. function getFileExtension(filePath) {
  72. return filePath.split('.').pop();
  73. }

注意事项:

  1. responseType:在 uni.request 中,我们使用了 responseType: 'arraybuffer',因为 JSZip 可以接受 ArrayBuffer 对象作为输入。
  2. Blob 构造:在成功回调中,将响应数据转换为 Blob 对象,并返回给调用者。
  3. 网络请求错误处理:与之前类似,当请求失败或状态码不是200时,会抛出相应的错误。

这样,你就可以在 UniApp 环境下使用该代码进行 ZIP 文件打包。希望这个修改对你有帮助!如果有任何问题,请告诉我。


内容由零声教学AI助手提供,问题来源于学员提问

本站部分文章来源于网络,版权归原作者所有,如有侵权请联系站长删除。
转载请注明出处:https://golang.0voice.com/?id=20998

分享:
扫描分享到社交APP
上一篇
下一篇
发表列表
游客 游客
此处应有掌声~
评论列表
  • 浩瀚影院
    2024年12月01日 01:09:19
    《我是唱作人第一季》大陆综艺无广告高清版:https://www.jinzhuqq.com/dyvideo/21653.html

联系我们

在线咨询: 点击这里给我发消息

微信号:3007537140

上班时间: 10:30-22:30

关注我们
x

注册

已经有帐号?