在 tinymce 中添加自定義圖片上傳

Question

tinymce 並使用圖片上傳，我已經修改了我的配置並添加了從系統上傳的圖片。這工作正常並上傳了新標簽，下面是我的配置：

config: any = {
    height: 250,
    theme: 'modern',
    // powerpaste advcode toc tinymcespellchecker a11ychecker mediaembed linkchecker help
    plugins: 'print preview searchreplace autolink directionality visualblocks visualchars fullscreen image imagetools link media template codesample table charmap hr pagebreak nonbreaking anchor insertdatetime advlist lists textcolor wordcount contextmenu colorpicker textpattern',
    toolbar: 'formatselect | bold italic strikethrough forecolor backcolor | link | alignleft aligncenter alignright alignjustify  | numlist bullist outdent indent fontselect fontsizeselect | removeformat',
    image_advtab: true,
    imagetools_toolbar: 'rotateleft rotateright | flipv fliph | editimage imageoptions',
    menubar: true,
    statusbar: false,
    images_upload_handler: (blobInfo, success, failure) => {
      let firmuseracctid;
      let loggedInUserData = JSON.parse((sessionStorage.getItem('userDetails')));
      if (loggedInUserData && loggedInUserData.useracctid) {
        firmuseracctid = loggedInUserData.useracctid
      }
      var formData;
      formData = new FormData();
      let s3signatureKey = 'path';
      let headerImageName = blobInfo.filename();
      let status: any = 0;
      formData.append('status', status);
      formData.append('signatureKey', s3signatureKey);
      formData.append("file", blobInfo.blob(), blobInfo.filename());
      //console.log(formData);
      this.uploadFile(formData).subscribe(response => {
        if (response) {
          this.headerImageUrl = 'myURL';
          success(this.headerImageUrl);
        }
      });
    },
    content_css: [
      '//fonts.googleapis.com/css?family=Lato:300,300i,400,400i',
      '//www.tinymce.com/css/codepen.min.css'
    ]
  };

現在我需要添加另一個選項卡，我必須從我的服務端加載所有圖像，為此如何添加配置，對此有任何幫助。

Answer 1

TinyMCE 沒有配置選項來創建用於瀏覽圖像存儲庫的整個 UI。 為此，您有幾個選擇。

TinyMCE 生產了兩種可以為您做到這一點的產品：

• 莫西管理器
• 微型驅動器

有 3rd 方插件可以為您執行此操作，例如：

• 響應式文件管理器
• Roxy Fileman

最后，您可以選擇創建自己的文件管理器並使用 TinyMCE 的 API 與您創建的內容進行交互（以上工具都可以這樣做）。