vue-froala-wysiwyg icon indicating copy to clipboard operation
vue-froala-wysiwyg copied to clipboard

The pasted picture will not drop the picture upload interface

Open 99899899998 opened this issue 3 years ago • 1 comments

The pasted picture will not drop the picture upload interface Just save base64 format,How do I make the image upload automatically when pasted into rich text?

99899899998 avatar Aug 24 '20 10:08 99899899998

This is my code, hope it helps

<template>
....
<froala
      :config="config"
      v-model="editorData"
    ></froala>
....
</template>
<script>
data() {
  const that = this;
  return {
    //.........
    apiToken: "API TOKEN",
    config: {
      imageUploadURL: "https://this-is-my-server.name/upload",
      imagePaste: true,
      imagePasteProcess: true,
      imageResize: true,
      crossDomain: true,
      imageEditButtons: [
        "imageDisplay",
        "imageAlign",
        "imageInfo",
        "imageRemove",
      ],
      imageMaxSize: 1 * 1024 * 1024, //1 megabyte
      event: {
        "image.beforeUpload": function () {
          var editor = this;
          editor.opts.requestHeaders.authorization = that.apiToken;
          editor.popups.hideAll();
        },
        "image.inserted": function (response) {
          if (response) {
            setTimeout(() => {
              //autosave data to server
            }, 1000);
          }
        },
        "image.error": function (error) {
          if (error.code == 5) {
            alert('File is too big!')
          }
        }
      }
    }
    //............
  }
}
</script>

yusrenaltair avatar Dec 24 '20 15:12 yusrenaltair