Javascript I'；我们从textarea输入中获得了json中的多行字符串

我试着编写一个小小的社交网络。所以我有一个带有文本区的表单来写和发送帖子。现在如果我想写一个例子：

您好，这是第一行
这是第二行

它存储在我的数据库中，就像这样。现在，如果我想输出帖子，我将查询数据库并形成一个JSON字符串。问题是新行也在JSON字符串中，因此我当然会遇到以下错误： JSON.parse:字符串中的控制字符不正确

我用nl2br（）尝试了一些方法，但没有任何效果

这是使用数据库中的帖子数据形成json字符串的代码

$response = "[";
                  foreach($followingposts as $post) {
                          $response .= "{";
                                  $response .= '"PostId": '.$post['id'].',';
                                  $response .= '"PostBody": "'.$post['body'].'",';
                                  $response .= '"PostedBy": "'.$post['username'].'",';
                                  $response .= '"PostDate": "'.$post['posted_at'].'",';
                                  $response .= '"Likes": "'.$post['likes'].'"';
                          $response .= "},";
                  }
                  $response = substr($response, 0, strlen($response)-1);
                  $response .= "]";
                  http_response_code(200);
                  echo $response;

这是在timelin上显示帖子的Ajax请求

      $.ajax({
                      type: "GET",
                      url: "api/profileposts?username=<?php echo $profileusername;?>",
                      processData: false,
                      contentType: "application/json",
                      data: '',
                      success: function(r) {
                              var posts = JSON.parse(r)
                              $.each(posts, function(index) {
                                      $('.timelineposts').html(
                                              $('.timelineposts').html() + '<blockquote class="blockquote" style="margin-left:45px;max-width:650px;width:auto;margin-bottom:40px;"><p class="mb-0" style="color:rgb(255,255,255);">'+posts[index].PostBody+'</p><footer class="blockquote-footer" style="color:rgb(137,137,137);font-weight:500;">von '+posts[index].PostedBy+'<button data-id="'+posts[index].PostId+'" class="btn btn-primary" type="button" style="background-color:rgb(30,40,51);padding-right:0px;padding-left:0px;padding-top:0px;padding-bottom:0px;margin-left:15px;border:none;"><i class="fa fa-heart" style="font-size:27px;color:rgb(255,0,0);"></i><span style="color:rgb(255,0,0);margin-left:15px;">'+posts[index].Likes+' Likes</span></button></footer></blockquote>'
                                      )

                                      $('[data-id]').click(function() {
                                            var buttonid = $(this).attr('data-id');
                                            $.ajax({
                                                type: "POST",
                                                url: "api/likes?id=" + $(this).attr('data-id'),
                                                processData: false,
                                                contentType: "application/JSON",
                                                data: '',
                                                success: function(r) {
                                                  var res = JSON.parse(r)
                                                  $("[data-id='"+buttonid+"']").html('<i class="fa fa-heart" style="font-size:27px;color:rgb(255,0,0);"></i><span style="color:rgb(255,0,0);margin-left:15px;">'+res.Likes+' Likes</span>')
                                                  console.log(r)
                                                },
                                                error: function(r) {
                                                  console.log(r)
                                                }
                                            });
                                      })
                              })
                      },
                      error: function(r) {
                              console.log(r)
                      }
              });

$.ajax({
键入：“获取”，
url:“api/profileposts？用户名=”，
processData:false，
contentType:“应用程序/json”，
数据：“”，
成功：功能（r）{
var posts=JSON.parse（r）
$。每个（职位、职能（索引）{
$（'.timelineposts'）.html(
$（'.timelineposts'）.html（）++'
'+posts[index]。PostBody+'
von'+posts[index]。PostedBy+'+posts[index]。Likes+'Likes'
)
$（“[data id]”）。单击（函数（）{
var buttonid=$（this.attr（'data-id'）；
$.ajax({
类型：“POST”，
url:“api/likes？id=“+$（this）.attr（'data-id'），
processData:false，
contentType:“应用程序/JSON”，
数据：“”，
成功：功能（r）{
var res=JSON.parse（r）
$（“[data id=”+buttonid+“]”）.html（“+res.Likes+”Likes“）
console.log（r）
},
错误：函数（r）{
console.log（r）
}
});
})
})
},
错误：函数（r）{
console.log（r）
}
});

如果使用别名查询列名，则很简单：

SELECT id AS PostId,
       body AS PostBody,
       username AS PostedBy,
       posted_at AS PostDate,
       likes AS Likes
       FROM table_name ....

然后像前面一样将行提取到

$followPosts

，并输出JSON：

echo json_encode($followingposts);

就这样

如果这是一个CMS或应用程序，您实际上没有构造查询，那么：

foreach($followingposts as $post) {
    $response[] = array(
    'PostId'   => $post['id'],
    'PostBody' => $post['body'],
    'PostedBy' => $post['username'],
    'PostDate' => $post['posted_at'],
    'Likes'    => $post['likes']);
}
echo json_encode($response);

---

为什么不使用php的内置JSON工具将您的对象编码为JSON？为了补充上述内容，内置的

JSON_encode

和

JSON_decode

函数将跳过这些内容。它做得很好（非UTF-8除外）。此外，当您显示文本时，您可以简单地使用css

空白：pre

样式，而无需对任何内容进行转换。这也带来了它自己的问题，比如如果你有所有这些

标记，就在输出中使用htmlentities，或者将修改后的数据放回文本区域进行编辑。我在上面暗示的最后一件事是，如果你在DB中存储用户输入的内容，你需要转义该内容（使用“htmlentities”）在输出到“其他”用户之前。如果您不这样做，您可以允许1个用户在您的数据库中输入Javascript代码，然后显示给其他用户-这是。。。令人不快的