iview 集成 TinyMCE自定义图片上传路径问题

使用images_upload_credentials

tinymce.init({
  convert_urls: false, //防止路径被转换为相对路径  
  language_url: './static/tinymce/zh_CN.js',  
  language: 'zh_CN',  
  skin_url: './static/tinymce/skins/lightgray',  
  height: 300,  
  plugins: 'link lists image code table colorpicker textcolor wordcount contextmenu',  
  toolbar: 'bold italic underline strikethrough | fontsizeselect | forecolor backcolor | alignleft aligncenter alignright alignjustify | bullist numlist | outdent indent blockquote | undo redo | link unlink image code | removeformat',  
  branding: false,  
  //如需ajax上传可参考https://www.tiny.cloud/docs/configure/file-image-upload/#images_upload_handler  
  images_upload_handler: (blobInfo, success, failure) => {     
   //const img = 'data:image/jpeg;base64,' + blobInfo.base64()     
   //success(img)     
   this.upload(blobInfo,(e)=>{//自己上传方法       
    success(e)     
  })  
}});

//上传方法
methods:{    
  upload(blobInfo,fn) {      
   var self = this;      
   let formData = new FormData()      
   formData.append('file', blobInfo.blob())      
   //这里为自己的上传接口调用方法     
   this.$http({ 
    method:'post', 
    url:self.config.serverUrl+'/imageUpload', 
    data:formData      
   }).then(function (response) {        
    if(response.data.code=='1'){          
        fn && fn(response.data.imgPath)       
    }else{          
        self.$message.error('图片上传失败')          
        fn && fn('')       
    }      
   }).catch(function (response) {      console.log(response);      });    }}
复制代码

images_upload_handler（官方文档描述）

该

images_upload_handler

选项允许你指定被用来替代TinyMCE的默认的JavaScript和定制逻辑上传处理函数的函数。

上载处理程序函数采用四个参数：

• blobInfo

• 一个success回调

• 甲failure回调接受一个错误消息，并含有任选的对象：

  • remove-从文档中删除图像，默认为``false

• 甲progress回调需要1和100之间的值

如果未设置此选项，TinyMCE将利用一次

XMLHttpRequest

将一个图像上传到服务器，并使用远程图像的位置调用成功回调。

注意

：要将

<img>

标签的

src

属性替换为远程位置，请使用在

images_upload_handler

函数中

定义的成功回调

和返回的JSON对象的location属性。

convert_urls

使用此选项，您可以控制TinyMCE是否智能，并将URL恢复为其原始值。

默认情况下，URL是自动转换的（混乱的），因为浏览器的内置逻辑以这种方式工作。

除非您将其存储起来，否则无法获取真实的URL。

如果将此选项设置为false它会尝试保持这些URL完整。

此选项被设置为true默认装置，该装置的URL被强制为任一绝对或相对

视的状态relative_urls。

**类型：**Boolean

**默认值：**true

**可能的值：**true，false