Summernoteリッチテキストエディタの使用

ブログの表示https://www.cnblogs.com/kenhome/p/7743394.html https://blog.csdn.net/wqlove520/article/details/96331111 https://www.cnblogs.com/hzb462606/p/8987832.html https://www.cnblogs.com/cxchanpin/p/7323632.html https://blog.csdn.net/a11441555/article/details/79789059 https://www.cnblogs.com/yiychao/p/11790047.html
js導入

    <!-- include libraries(jQuery, bootstrap) -->
 <link href="http://netdna.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.css" rel="stylesheet">
 <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.js"></script>
 <script src="http://netdna.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.js"></script>

<!-- include summernote css/js -->
    <link href="http://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.9/summernote.css"
          rel="stylesheet">
    <script src="http://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.9/summernote.js"></script>

ローカルにダウンロードして導入することをお勧めします.速度が速くなります.
自分の需要:1、画像とテキストの内容を一緒にデータベースに保存します.(クエリを再表示しない)フロントエンドパラメータの組織:

  var wznr = escape($("#summernote").summernote("code"));
            var save = compileUrl('${rc.contextPath}/back/saveArticle');
            var paras = {
                "wznr":wznr,
                "bt": $("#bt").val(),
                "wzlx":$("#wzlx").val(),
                "bjr":$("#bjr").val()
            }
            $.ajax({
                type: 'POST',
                url: save,
                data: paras,
                async: false,
                //processData: false,// ， ， ， false
                //contentType: false, // ， application/x-www-form-urlencoded， 
                success: function () {
                    layer.msg(' ', {time: 2000, icon: 1});
                }
            });

バックエンド制御層:

	@PostMapping("/saveArticle")
	@ResponseBody
	public void saveArticle(@RequestParam("bt") String bt,
	                             @RequestParam("wzlx") String wzlx,
	                             @RequestParam("bjr") String bjr,
	                             @RequestParam("wznr") Object wznr) throws AppException {
		DataObject para =DataObject.getInstance();
		para.put("bt", bt);
		para.put("wzlx",wzlx);
		para.put("bjr",bjr);
		para.put("wznr",wznr);
		backService.saveArticle(para);
		return ;
	}

daoレイヤ取得

		String wzbt = para.getString("bt");// 
		String wzlx = para.getString("wzlx");
		String wzid = DateUtil.getCurrentDateToString().substring(0,12) + wzlx;// id
		String wzfbsj = DateUtil.getCurrentDateToString();// 
		String wzbjr = para.getString("bjr");// 
		String wznr = para.getString("wznr");// 

確かにデータベースに格納されていますが、データはこのように格納するのはよくありません.データのアップロードの圧力とデータベースの圧力を軽減するために、画像をサーバにアップロードした後、urlアドレスに戻り、リッチテキストのimgラベルに挿入して格納したほうがいいです.
2、データをサーバーに保存する.(続き)