Chrome+IE supports pasting pictures in the clipboard by default, but the article I want to publish is stored in Word, with dozens of pictures. I can’t copy one by one, right ?
The high version of Chrome provides the function of converting a single image into a BASE64 string. But it cannot handle multiple pictures. Moreover, after being converted to BASE64, it is submitted to the server together as the content, and the picture cannot be saved separately in another server. If you need to save it separately, you need to handle it yourself. kind of hard.
I hope that after opening a Word or WPS document, copy the content and paste it directly into the rich text editor. The editor will automatically upload the pictures to the server in batches. No matter how many pictures there are in the document, the editor will upload them all automatically. Manually process one by one. At the same time, the image can be uploaded to the interface I specified. The server needs to save the image separately in the storage server, such as cloud storage or distributed storage, and finally publish the content directly.
This seems to be very difficult, because Ueditor itself does not support it, and it will be blank after pasting. There must be a reason.
Okay, let’s try UMeditor. Chrome can only get the local path and cannot read the file.
https://ueditor.baidu.com/website/umeditor.html (if you are interested, you can try)
Did it just fail like this?
No , but I accidentally found that UMeditor actually supports pasting multiple pictures in word (only supports IE11, does not support IE10 and below, and Chrome, etc.)
Switch HTML, you will see your pictures are organized into base64
Nice , the opportunity is here, since IE supports copying multiple pictures in word and pasting base64 directly, now that we have base64, we can upload and transfer pictures!
So let’s transform Ueditor to support IE11 (it’s better than useless)
Open your ueditor.all.js (line numbers below version 1.4.3 may be different depending on the version you are using)
1. Comment out line 14679 (it is temporarily unclear what adverse effects are there)
// Perform the default processing
//me.filterInputRule(root);
2. Insert the following code in line 28725 (if you paste in IE11, you will get base64, first use placeholders to placeholders, and then convert base64 into Blob files and upload them one by one. After uploading, replace it with your img attribute and src as the server image url)
Server upload code
After processing, it is really convenient to upload all the pictures in word in batches. No matter how many pictures you can upload in batches at once. This function is really convenient and greatly improves the efficiency of content editors. In the past, only one article could be published a day, but now 100 articles can be published, which is a 100-fold increase in efficiency.
The pictures are uploaded and saved on the server. And you can also specify the upload interface address, which is also more convenient. Because our business is to save pictures in a separate cloud storage server.
3 , the processing ueditor provided uploadimage method
The customer has used it for half a year, no problem, very useful and very convenient function
Discussion group: 223813913