1.官網(wǎng)下載ueditor富文本編輯器（我這里使用的是1.4.3.3 utf-8 jsp版本的）
http://ueditor.baidu.com/website/download.html
2.將下載好的文件復制到static/ueditor/文件下
2.png
3.創(chuàng)建個跳轉(zhuǎn)祭阀，UeditorControllr類
package com.example.ueditor;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.RestController;
@Controller
@RequestMapping(value = "/test")
public class UeditorController {
@RequestMapping(value = "test1",method = RequestMethod.GET)
public String test1() {
return "test";
}
}
4.創(chuàng)建測試頁面屎开，test.html
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<textarea name="content" id="content" style="min-height: 500px"></textarea>
</body>
<script type="text/javascript" th:src="@{/ueditor/ueditor.config.js}"></script>
<script type="text/javascript" th:src="@{/ueditor/ueditor.all.min.js}"></script>
<script type="text/javascript" charset="utf-8" th:src="@{/ueditor/lang/zh-cn/zh-cn.js}"></script>
<script type="text/javascript">
UE.getEditor('content');
</script>
</html>
這里已經(jīng)可以看到雛形了，但是圖片上傳等功能不可用，需要進行以下配置~~~~~~
5.創(chuàng)建文件上傳配置類
package com.example.ueditor;
import com.baidu.ueditor.ActionEnter;
import org.springframework.stereotype.Controller;
import org.springframework.util.ClassUtils;
import org.springframework.web.bind.annotation.RequestMapping;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
import java.io.PrintWriter;
@Controller
public class ServerController {
@RequestMapping(value = "/config")
public void config(HttpServletRequest request, HttpServletResponse response) {
response.setContentType("application/json");
String rootPath = ClassUtils.getDefaultClassLoader().getResource("").getPath() + "static/ueditor/jsp";
try {
response.setCharacterEncoding("UTF-8");
String exec = new ActionEnter(request, rootPath).exec();
System.out.println(exec);
PrintWriter writer = response.getWriter();
writer.write(new ActionEnter(request, rootPath).exec());
writer.flush();
writer.close();
} catch (IOException e) {
e.printStackTrace();
}
}
}
如果報錯了幸冻，請?zhí)砑酉嚓P依賴务傲，主要是第一個就夠了舔株，嫌麻煩的話三個依賴都添加了就有備無患了酸纲。
<!--需要添加的jar包3個-->
<dependency>
<groupId>com.gitee.qdbp.thirdparty</groupId>
<artifactId>ueditor</artifactId>
<version>1.4.3.3</version>
</dependency>
<dependency>
<groupId>commons-fileupload</groupId>
<artifactId>commons-fileupload</artifactId>
<version>1.3.3</version>
</dependency>
<dependency>
<groupId>commons-codec</groupId>
<artifactId>commons-codec</artifactId>
<version>1.9</version>
</dependency>
6.修改ueditor.config.js文件
6.png
var URL = window.UEDITOR_HOME_URL || getUEBasePath();
//添加代碼
var server_url = window.location.protocol+"http://"+window.location.hostname+":"+window.location.port
/**
* 配置項主體。注意漫贞，此處所有涉及到路徑的配置別遺漏URL變量甸箱。
*/
window.UEDITOR_CONFIG = {
//為編輯器實例添加一個路徑，這個不能被注釋
UEDITOR_HOME_URL: URL
// 服務器統(tǒng)一請求接口路徑
//, serverUrl: URL + "jsp/controller.jsp"
//添加代碼迅脐，上一行代碼注釋掉
,serverUrl: server_url+"/config"
7.接著進入/static/ueditor/jsp/目錄下芍殖，找到config.json文件
7.png
將圖片訪問路徑的前綴都改成"/ueditor/jsp"，我數(shù)了下谴蔑，大概有8個路徑豌骏，都修改成這個就可以上傳圖片了。
