CKEditor无法上传图片求助：Blob临时链接保存后失效问题

• 替换临时链接为永久存储URL
  先把图片传到你的服务器永久目录或者对象存储，拿到能长期访问的URL。然后在CKEditor里切到源代码模式，把原来的<img src="临时Blob地址">直接换成<img src="你的永久URL">就行。

• 给CKEditor配置自动上传（一劳永逸）
  如果是开发场景，不想每次手动换，就给编辑器加上传配置：

  • CKEditor 5：用SimpleUploadAdapter指定后端上传接口，代码示例：

    ClassicEditor
        .create( document.querySelector( '#editor' ), {
            simpleUpload: {
                uploadUrl: '/你的后端上传接口地址',
            }
        } )
        .catch( error => {
            console.error( error );
        } );
    

  • CKEditor 4：配置filebrowserImageUploadUrl指向后端接口：

    CKEDITOR.replace( 'editor', {
        filebrowserImageUploadUrl: '/你的后端上传接口地址'
    } );
    

  后端接口要做的事：接收上传的图片，存到永久位置，然后返回CKEditor要求的JSON格式响应，里面带上永久URL。

• 小图片临时救急：转Base64嵌入
  把图片转成Base64编码（网上搜个在线工具就能转），然后在CKEditor源代码模式里，把img的src换成Base64字符串，比如：
  <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAA...">
  注意：这种方式会让内容变大，只适合小图。

内容的提问来源于stack exchange，提问作者HOSSAM ALI