版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
Spring Boot 2.x With TinyMCE
这篇博文来讲解下Spring Boot 集成TinyMCE.
1.什么是TinyMCE?
TinyMCE 是一款优秀的富文本编辑器,博客园默认的富文本编辑器就是这个。
2. 关于价格
TinyMCE有免费版也有收费版本,具体详情如下:
3. Spring Boot 2.x 如何集成TinyMCE?
3.1 注册TinyMCE 账号获取API KEY
注册地址:https://www.tiny.cloud/auth/signup/
登录后查看API KEY
https://apps.tiny.cloud/my-account/key-manager/
点击进入可以看到API KEY
图中圈起来的就是API KEY
- 配置可以访问的域名或IP地址,这里 由于本地测试,因此增加了
127.0.0.1
3.2 前端配置
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="https://cdn.tiny.cloud/1/no-api-key/tinymce/5/tinymce.min.js" referrerpolicy="origin"></script>
<script>
<!-- 初始化富文本编辑器-->
tinymce.init({
selector: '#myTextArea',
});
</script>
</head>
<body>
<h1>TinyMCE Quick Start Guide</h1>
<form action="post.do" method="post">
<textarea id="myTextArea" name="myTextArea">Hello, World!</textarea>
<button type="submit">保存</button>
</form>
</body>
</html>
no-api-key
要替换为自己申请的KEY
预览效果图如下:
点击保存,提交到后台。
3.2 后端配置
import lombok.extern.slf4j.Slf4j;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestParam;
/**
* @author 星云
* @功能
* @date 10/10/2019 11:15 PM
*/
@Slf4j
@Controller
public class PostController {
@PostMapping(value = "/post.do")
public String post(@RequestParam(value = "myTextArea")String myTextArea){
log.info(myTextArea);
return "success";
}
}
输出结果:
2019-10-10 23:33:57.879 INFO 12008 --- [nio-8080-exec-4] c.x.s.controller.PostController : <p><strong>Hello, World!</strong></p>
4. 查看源码
5. 参考资料
本篇完~