Tinymce多图上传导致接口调用频繁怎么办?

花韻仙語
发布: 2024-12-02 08:51:01
原创
303人浏览过

tinymce多图上传导致接口调用频繁怎么办?

tinymce多图上传请求优化

您在使用tinymce时遇到一个问题,即通过axupimgs插件实施的多图上传导致频繁的接口调用,超出您业务的限制。

要解决这个问题,您可以自定义一个上传处理程序,以批量处理图像上传。以下是具体步骤:

  1. 实现自定义上传处理程序:

检查tinymce文档,您会发现一个名为images_upload_handler的参数,它用于处理选定图像的上传。在这个处理程序中,您可以提供图像的blob对象并返回一个promise。

  1. 批量上传图像:

在您的外部代码中,创建一个files数组来存储选定文件和一个tasks数组来存储promise的resolve方法。

  1. 创建上传函数:

创建一个单独的doupload函数,它使用formdata上传文件。当上传成功时,逐个调用tasks数组中的resolve方法以完成上传。

  1. 示例代码:
const files = [];
const tasks = [];

function uploadimages(blob, progress) {
  files.push(blob);
  return new promise((resolve) => {
    tasks.push(resolve);
  });
}

function doupload() {
  const _files = files.slice();
  const _tasks = tasks.slice();
  files.length = 0;
  tasks.length = 0;

  const formdata = new formdata();
  _files.foreach((file, index) => formdata.append(`files[${index}]`, file));

  fetch('/image', {
    method: 'post',
    body: formdata,
  })
    .then((resp) => resp.json())
    .then((result) => {
      _tasks.foreach((task, index) => {
        task(result.uploaded[index]);
      });
    });
}
登录后复制
  1. 示例测试:
uploadImages('1', 0).then(console.log);
uploadImages('2', 0).then(console.log);
uploadImages('3', 0).then(console.log);

doUpload();
登录后复制

通过实现自定义上传处理程序并采用批量上传技术,您可以优化多图上传过程,减少接口调用次数并符合您的业务限制。

以上就是Tinymce多图上传导致接口调用频繁怎么办?的详细内容,更多请关注php中文网其它相关文章!

最佳 Windows 性能的顶级免费优化软件
最佳 Windows 性能的顶级免费优化软件

每个人都需要一台速度更快、更稳定的 PC。随着时间的推移,垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是,许多工具可以让 Windows 保持平稳运行。

下载
相关标签:
来源:php中文网
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新问题
开源免费商场系统广告
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习
PHP中文网抖音号
发现有趣的

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号