web工程前后台换行符传递与转义

问题描述

该问题源自于一个数据展示问题, 后台文本中的换行符\n通过ajax请求反馈给前台, 前台解析json失败, 导致无法执行ajax的回调函数, 前台解析报错为:
Uncaught SyntaxError: Unexpected token in JSON at position 101

问题分析

产生该问题的表象为前台js以json格式解析返回串, 解析到转义符\, 但无法识别跟随的n, 从而认为是返回数据问题而报错
但该问题并非到此为止, 由于前台html中换行符不同于后台\n, 仍需要在前台接收信息后做文本替换, 再渲染到对应的页面元素中

解决方案

后端使用groovy实现, 用来将实际内容中的换行符改为\\n, 同时将其他\转义符替换为斜杠/
注意replace中一个反斜杠文本\要用四个反斜杠\\\\表示, 原因是需要经过java和正则两个步骤的转义, 所以需要2*2=4个反斜杠, 同理, 想替换为\\n就需要8个反斜杠…

def sql = DB.getSql();
def jsonStr = JSONObject.toJSONString(sql.rows(reaSql));
jsonStr.replaceAll("\\\\","/").replaceAll("/n","\\\\\\\\n");

前端接收到响应数据解析json时, 会把文本中的\\n转义为\n, 所以针对前端的转义工作, 就需要将目标文本中的\n替换为<br>
这里replace同样要经过js和正则两个步骤转义, 需要4个反斜杠表示, 具体实现如下

var reg = new RegExp("\\\\n", "gmi");
var rep = data.eventMessage.replace(reg, "<br>");
$(".eventMessage").html(rep);