There is no official change in the function after 1.4.2. There is no bug in word copy in 1.4.2, and manual cannot be saved in other versions
The backend used in this article is Java. The front end is Jsp (the front end is the same, if the background language is not their own Base64 encoding and decoding)
Because the company business needs to support IE8, there are actually a lot of rich text boxes on the web, the effect is very good.
Such as www.wangEditor.com, but tried a circle does not support IE8.
So back to Ueditor, since there is no official maintenance, the new Neuditor does not know when word automatic save will be supported, so I have to figure it out myself.
Ueditor is not recommended if it is not necessary. I can’t help it.
The modified plug-in is only suitable for IE8.
One point to note here is that baidu’s official editor does not support batch uploading of Word pictures. After pasting Word, you need to manually select the pictures and upload them again. Most of the examples found on the web do this. If you need to automatically batch upload word images, you can use the WordPaster control.
1. The IE Settings
Add trusted sites to trusted sites.
Here the native test uses http://localhost directly
Because you need to read the client’s files, you need to set up to allow access to the data source.
ActiveXObject Settings can be referenced online, not listed here.
In front of
The preparation for IE is done here.
Modify the ueditor.all.js key code
Near line 14006, if it is a different version of the UEditor, you can copy the following code if it is functional.
var imgPath = attrs.src;
var imgUrl = attrs.src;
If (navigator. AppName === ‘Microsoft Internet Explorer’) {// Check if it is Internet Explorer
If (the navigator. UserAgent. Match (/ Trident/I) && navigator. UserAgent. Match (8.0 / I)/MSIE) {/ / determining if a browser kernel Trident kernel IE8.0
var realPath = imgPath.substring(8, imgPath.length);
var filename = imgPath.substring(imgPath.lastIndexOf(‘/’) + 1, imgPath.length);
var result = UploadForIE.saveAttachment(filename, realPath);
if (result) {
var json = eval(‘(‘ + result + ‘)’);
imgUrl = json.url;
}
}
}
img.setAttr({
width: attrs.width,
height: attrs.height,
alt: attrs.alt,
word_img: attrs.src,
src: imgUrl,
‘style’: ‘background:url(‘ + (flag ? opt.themePath + opt.theme + ‘/images/word.gif’: opt.langPath + opt.lang + ‘/images/localimage.png’) + ‘) no-repeat center center; border:1px solid #ddd’
})
UploadForIE. Js.
var UploadForIE = {
// Save to an XML attachment and upload via Ajax
saveAttachment: function(upload_filename, localFilePath) {
// The background accepts the image to save the method.
var upload_target_url = “uploadImg”;
var strTempFile = localFilePath;
// Create XML objects to combine XML document data
var xml_dom = UploadForIE.createDocument();
xml_dom.loadXML(‘ ‘);
// Create the adodb.stream object
var ado_stream = new ActiveXObject(“adodb.stream”);
// Set the stream data type to binary
ado_stream.Type = 1; // adTypeBinary
// Open adodb.stream
ado_stream.Open();
// Load the local file into the adodb.stream object
ado_stream.LoadFromFile(strTempFile);
// Get file size in bytes
var byte_size = ado_stream.Size;
// Set the data transfer unit size to 1KB
var byte_unit = 1024;
// Get the number of file split data units
var read_count = parseInt((byte_size / byte_unit).toString()) + parseInt(((byte_size % byte_unit) == 0) ? 0:1);
// Create an XML element node and save the name of the uploaded file
var node = xml_dom.createElement(“uploadFilename”);
node.text = upload_filename.toString();
var root = xml_dom.documentElement;
root.appendChild(node);
// Create an XML element node to save the size of the uploaded file
var node = xml_dom.createElement(“uploadFileSize”);
node.text = byte_size.toString();
root.appendChild(node);
// Create an XML element node to save the contents of the uploaded file
for (var i = 0; i < read_count; i++) {
var node = xml_dom.createElement(“uploadContent”);
// The file content is encoded in Base64
node.dataType = “bin.base64”;
// Determine the size of the current data node and classify the data according to the condition
if ((parseInt(byte_size % byte_unit) ! = 0) && (i == parseInt(read_count – 1))) {
// When the packet size is not an integer multiple of the data unit, the last remaining data is read from the data unit
node.nodeTypedValue = ado_stream.Read();
} else {
// Read a complete unit of data
node.nodeTypedValue = ado_stream.Read(byte_unit);
}
root.appendChild(node);
}
// Close the adodb.stream object
ado_stream.Close();
delete ado_stream;
// Create the microsoft.xmlHTTP object
// var xmlhttp = new ActiveXObject(“microsoft.xmlhttp”);
var xmlhttp = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject(“Microsoft.XMLHttp”);
// Open the microsoft.xmlhtp object
xmlhttp.open(“post”, upload_target_url, false);
// Upload the file using the microsoft.xmlhtp object
xmlhttp.send(xml_dom);
var state = xmlhttp.readyState;
var success_state = true;
if (state ! = 4) {
success_state = false;
}
var result = xmlhttp.responseText;
delete xmlhttp;
return result;
},
/ / create DOMdocuemnt
createDocument: function() {
var xmldom;
Var versions = [” MSXML2.domdocument.6.0 “, “MSxml2.domdocument.5.0 “,” MSxml2.domdocument.4.0 “, “MSxml2.domdocument.3.0 “, “MSXML2.DOMDocument”],
i,
len;
for (i = 0, len = versions.length; i < len; i++) {
try {
xmldom = new ActiveXObject(versions[i]);
if (xmldom ! = null) break;
} catch(ex) {
/ / to skip
Alert (” Failed to create document object!” );
}
}
return xmldom;
}
}
UEditorAction Method for saving images
@RequestMapping(“/uploadImg”)
public void uploadADO(HttpServletRequest request, HttpServletResponse response) {
String path1 = request.getContextPath();
String basePath = request.getScheme() + “://” + request.getServerName() + “:” + request.getServerPort() +path1;
String rootPath = request.getServletContext().getRealPath(“/”);
// Set the data transfer unit size to 1KB
int unit_size = 1024;
// Initialize the XML file size in bytes
int xmlFileSize = 0;
// Initialize the name of the uploaded file (full filename)
String xmlFilename = “”;
// Initialize the upload file save path (absolute physical path)
String xmlFilepath = “”;
// Declare that the file stores an array of bytes
byte[] xmlFileBytes = null;
try {
// Initialize the SAX serial XML file parser
SAXBuilder builder = new SAXBuilder();
Document doc = builder.build(request.getInputStream());
Element eRoot = doc.getRootElement();
// Get the full name of the uploaded file
Iterator it_name = eRoot.getChildren(“uploadFilename”).iterator();
if (it_name.hasNext()) {
xmlFilename = ((Element) it_name.next()).getText();
}
// The relative path to the directory
String relativePath = “/temp/”+EditorUtil.getToday()+”/”;
xmlFilepath = rootPath+ relativePath;
// Get the size of the uploaded file
Iterator it_size = eRoot.getChildren(“uploadFileSize”).iterator();
if (it_size.hasNext()) {
xmlFileSize = Integer.parseInt(((Element) it_size.next())
.getText());
if (xmlFileSize > 0) {
int unit_count = 0;
// Allocate storage space for byte arrays that store file contents
xmlFileBytes = new byte[xmlFileSize];
// Loop through the contents of the file and save it to a byte array
Iterator it_content = eRoot.getChildren(“uploadContent”)
.iterator();
while (it_content.hasNext()) {
// Initialize the Base64 codec
BASE64Decoder base64 = new BASE64Decoder();
byte[] xmlNodeByteArray = base64
.decodeBuffer(((Element) it_content.next())
.getText());
if (xmlNodeByteArray.length >= unit_size) {
// Read a complete unit of data
System.arraycopy(xmlNodeByteArray, 0, xmlFileBytes,
unit_count * unit_size, unit_size);
} else {
// Read all data less than one data unit
System.arraycopy(xmlNodeByteArray, 0, xmlFileBytes,
unit_count * unit_size, xmlFileSize
% unit_size);
}
// Continue reading the contents of the file
unit_count++;
}
}
}
// Save path
File path = new File(xmlFilepath);
if(! path.exists()){
path.mkdirs();
}
// Save the file word paste image name
File file = new File(path,xmlFilename);
// Create a file input/output stream
FileOutputStream fos = new FileOutputStream(file);
// Write the file contents
fos.write(xmlFileBytes);
fos.flush();
// Close the file input/output stream
fos.close();
ReturnUploadImage rui = new ReturnUploadImage();
rui.setTitle(xmlFilename); // You need to set the file name, such as xxx.jpg
rui.setOriginal(xmlFilename); // You need to set the file name, such as xxx.jpg
rui.setState(“SUCCESS”);
rui.setUrl(basePath +relativePath+xmlFilename);
JSONObject json = new JSONObject(rui);
String result = json.toString(); // This is the format conversion to return to the UEditor
response.getWriter().write(result);
} catch (Exception e) {
e.printStackTrace();
}
}
Optimized code:
upload.jsp
<%@ page language=”java” import=”java.util.*” pageEncoding=”utf-8″%>
<%@ page contentType=”text/html; charset=utf-8″%>
<%@ page import = “Xproer.*” %>
<%@ page import=”org.apache.commons.lang.StringUtils” %>
<%@ page import=”org.apache.commons.fileupload.*” %>
<%@ page import=”org.apache.commons.fileupload.disk.*” %>
<%@ page import=”org.apache.commons.fileupload.servlet.*” %>
<%out.clear();
/ *
Update record:
2013-01-25 Remove SmartUpload and use commons-Fileupload instead. Because SmartUpload tests found memory leaks.
* /
//String path = request.getContextPath();
//String basePath = request.getScheme()+”://”+request.getServerName()+”:”+request.getServerPort()+path+”/”;
String uname = “”; // = request.getParameter(“uid”);
String upass = “”; // = request.getParameter(“fid”);
// Check that we have a file upload request
boolean isMultipart = ServletFileUpload.isMultipartContent(request);
FileItemFactory factory = new DiskFileItemFactory();
ServletFileUpload upload = new ServletFileUpload(factory);
//upload.setSizeMax(262144); //256KB
List files = null;
try
{
files = upload.parseRequest(request);
}
catch (FileUploadException e)
{// Handle the file size exception
Println (” error: “+ e.tostring ());
return;
}
FileItem imgFile = null;
// Get all uploaded files
Iterator fileItr = files.iterator();
// Loop through all files
while (fileItr.hasNext())
{
// Get the current file
imgFile = (FileItem) fileItr.next();
// Ignore simple form fields instead of upload fields file fields (etc.)
if(imgFile.isFormField())
{
String fn = imgFile.getFieldName();
String fv = imgFile.getString();
if(fn.equals(“uname”)) uname = fv;
if(fn.equals(“upass”)) upass = fv;
}
else
{
break;
}
}
Uploader up = new Uploader(pageContext,request);
up.SaveFile(imgFile);
String url = up.GetFilePathRel();
out.write(url);
response.setHeader(“Content-Length”,url.length()+””); // Returns the Content-Length flag so that the control correctly reads the return address.
% >
Refer to UEditorAction and uploadForie.js in the download file for the rest of the background functions and JS.
Here is the dependent POM structure I installed, which can be adjusted to suit your needs.
com.baidu
ueditor
1.1.0
Based on Springboot and IDEA, only the automatic save function has been extracted here. The function has not been tested yet, and the Git code has not been disclosed until the subsequent test is ready.
You can start by downloading the code using CSDN.
Ueditor.jar is referenced in the POM
The JAR package needs to be installed according to the situation
The jar package in 1.4.2 is version 1.1.0
Bidu -DartifactId= ueditor-dversion =1.1.0 -Dpackaging=jar MVN install: install-file-dgroupid =com. bidu -DartifactId= ueditor-dversion =1.1.0 -Dpackaging=jar – Dfile = \ ueditor \ JSP \ lib \ ueditor – 1.1.0. Jar
run
UeditorApplication’s main method
And then visit http://localhost:8088/ueditor/ can test.
Image automatic batch upload, do not need to manually select a picture upload, user experience than Baidu UEditor built-in better, more efficient image transmission.
Details can be found in this article:
Blog.ncmem.com/wordpress/2…
Discussion group: 223813913