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

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

tinymce多图上传请求优化

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

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

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

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

批量上传图像:

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

创建上传函数:

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

示例代码:

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]);      });    });}

示例测试:

uploadImages('1', 0).then(console.log);uploadImages('2', 0).then(console.log);uploadImages('3', 0).then(console.log);doUpload();

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

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

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至 chuangxiangniao@163.com 举报,一经查实,本站将立刻删除。
发布者:程序猿,转转请注明出处:https://www.chuangxiangniao.com/p/1251211.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2025年12月9日 22:55:49
下一篇 2025年12月9日 22:55:53

相关推荐

发表回复

登录后才能评论
关注微信