tinyMCE 编辑器将本地化路径设置为上传图像的 src

Question

我已经设置 tinyMCE 来进行图像上传，它在编辑器中显示上传的图像，但是在检查编辑器 HTML 的源代码时，我可以看到 src 属性被设置为文件路径：

<img src="../../../api/images/1"/>

我有一个 file_picker_callback，它将图像发布到我的后端服务器以保存图像，并在 tinyMCE 文档中指定的“位置”键中返回一个绝对 URL：https ://www.tiny.cloud/docs/configure/file -image-upload/#images_upload_url

但我不确定为什么无论提供绝对 URL，图像上设置的 src 都以“../../../”开头。

相关的 tinyMCE 配置：

  tinymce.init({
      file_picker_types: 'file image',
      file_picker_callback: function(cb, value, meta) {
        let tinyMCE = this;
        var input = document.createElement('input');
        input.setAttribute('type', 'file');
        input.setAttribute('accept', 'image/*,.doc,.docx,.txt,.rtf,.odt,.pdf');

        input.onchange = function() {
          var file = this.files[0];
          var reader = new FileReader();
          reader.onload = function () {
            // Register the blob in TinyMCEs image blob registry.
            var id = 'blobid' + (new Date()).getTime();
            var blobCache =  tinyMCE.editorUpload.blobCache;
            var base64 = reader.result.split(',')[1];
            var blobInfo = blobCache.create(id, file, base64);
            blobCache.add(blobInfo);

            backend.save(file).then(
              fileLocation => {
                let options = {};
                if (meta.filetype == 'file') {
                  options = {
                    title: file.name,
                    text: 'My Attachment'
                  };
                }
                cb(fileLocation, options);
              },
              (/* error */) => {
                blobCache.removeByUri(blobInfo.blobUri());
              }
            );
          };
          reader.readAsDataURL(file);
        };

        input.click();
      }
  });

我可以看到有一个选项对象可以传递给回调，它设置图像的一些元素属性，但是我在文档中找不到这个对象可以包含的内容的引用:(

想要一些帮助来解决这个问题并在我的图像 srcs 中获取绝对 URL，谢谢

Answer 1

convert_urls: false,

默认情况下，所有 URL 都会自动转换为相对 URL。如果要插入上传图片的真实 URL，请将 convert_urls 选项设置为 false。它会将 URL 恢复到它们的原始值。