Rich Text Box Editor to achieve: a, support for copy and paste the picture; b, support for word copy and paste graphics.

Chrome + IE default support paste clipboard pictures, but I want to publish articles exist word Inside, as many as dozens of pictures, I can not replicate one by one, right ?
Chrome version provides high single images can be converted in a function BASE64 string. But it can not handle multiple images. And converted into BASE64 as submitted to the server with the content can not be stored in the picture alone in another server. If you need to save their own individual will need to be processed. kind of hard.

I want to open a Word document or WPS, copy and paste directly into the rich text editor, picture editor to automatically batch uploaded to the server, regardless of how many images in a document, the editor will automatically upload all, do not need to manually processing a picture. At the same time I can upload pictures to the specified interface, the server needs to be kept in a separate picture storage server, such as may be the cloud storage or distributed storage, and finally directly publish content.

The feeling seems to be very difficult because Ueditor itself does not support, the paste is blank, there must be a reason.

Well, began to try UMeditor, Chrome only get the local path, not read the file.

https://ueditor.baidu.com/website/umeditor.html (are interested can try)

 

 

Is it such a failure?

Not , but I accidentally discovered UMeditor actually support pasted word of multiple images (only support IE11, IE10 does not support the following versions, and Chrome, etc.)

Switching HTML, you will see the picture are organized into base64 


Nice , for a chance to copy word since IE support of multiple pictures pasted directly base64, base64 Since there we have a way to upload pictures turn it!

So we have to transform Ueditor, let him support IE11 (better than not starting a strong bar)

Open your ueditor.all.js (1.4.3 versions of the following line numbers may differ depending on the version they use)

1 , 14679 comment out the line (temporarily not have any adverse effects clear)

// perform default processing

//me.filterInputRule(root);

2 , insert the following code at the line 28725 (If you are using IE11 will be base64 paste, first with placeholder placeholder, and then one by one into the base64 designed Blob file and upload, the upload is complete again be replaced by your server img src attribute picture url)

Server-side code that uploads

 

It effect after treatment, can bulk upload word in all the pictures, is really too convenient. No matter how many pictures can bulk upload. This feature is really too convenient, greatly enhance the efficiency of the content of the editorial staff. Only a day before publishing an article, is now able to release 100, which is simply to enhance the efficiency 100-fold ah.

 

After uploading pictures stored on the server side. But also specify the upload interface address, this is also more convenient. Because our business is to save the picture in a separate cloud storage server.

 

3 , the processing ueditor provided uploadimage method

Customers already using for six months, no problem, very useful, very handy feature

A friend in need can be downloaded: http://blog.ncmem.com/wordpress/2019/08/07/ueditor copy and paste word pictures uploaded -2 /

Guess you like

Origin www.cnblogs.com/songsu/p/11669702.html