Unicode转换后JSON中的无效字符

Question

我一直在尝试将解析后的 JSON 数据从服务器端（在 python 中）发送到我的 Web 应用程序的客户端，在那里它可以被存储然后显示在页面上。由于某种原因，当数据到达客户端时，它的两端都有奇怪的字符。当我尝试遍历我拥有的每个数据列表时，这些字符会导致问题，因为我需要查找列表的长度。这些字符串都不能成功输出到控制台。我在 SO 和其他地方查找了许多关于从字符串中剥离 unicode 的帖子，使用 ast 库或仅使用 .encode() 函数，但到目前为止还没有解决这个问题。

由于我使用的是 Django 框架，数据在服务器端被解析并通过上下文变量传递到客户端。

这是我正在尝试做的服务器上的原始 js 代码：

var $divline = $("<div id = ticketObj></div>");
    console.log("length of artist list" + {{venue_names}}.length );
    for(var i = 0; i < {{venue_names}}.length; i++){
        
        $divline.append('Artist ' + {{form_artistSelect}} + '  Location: ' {{venue_cities}}[i] ', '{{venue_region}}[i]' Venue: ' + {{venue_names}}[i]
     ); 
    
    }
    var $resultObj = $('<div id = "inviteObj" style="margin:100px"></div>');
    $resultObj.append($divline);
    $resultObj.appendTo($("#results"));

这是相同代码的页面源版本：

 var $divline = $("<div id = ticketObj></div>");
    for(var i = 0; i < Miike%20Snow.length; i++){
        
        $divline.append('Artist ' + Miike%20Snow[i] + '  Location: ' [&#39;Miami&#39;, &#39;Miami&#39;, &#39;Miami&#39;] ', '[&#39;FL&#39;, &#39;FL&#39;, &#39;FL&#39;]' Venue: ' + [&#39;Ultra Music Festival&#39;, &#39;Ultra Music Festival&#39;, &#39;Ultra Music Festival&#39;] ); 
    }
    var $resultObj = $('<div id = "inviteObj" style="margin:100px"></div>');
    $resultObj.append($divline);
    $resultObj.appendTo($("#results"));

在 python 视图中，我只是简单地获取 JSON 并像这样解析它：

data = json.load(urllib2.urlopen(url))

        #titles = [ i.get("title") for i in data]
        raw_dts = [i.get("datetime").encode("utf-8") for i in data]
        
        #formatted_dts = [i.get("formatted_datetime") for i in data]
        ticket_urls = [i.get("ticket_url").encode("utf-8") for i in data]
        ticket_statuses = [i.get("ticket_status").encode("utf-8") for i in data]
        venue_names = [i.get("venue").get("name").encode("utf-8") for i in data]
        venue_cities = [i.get("venue").get("city").encode("utf-8") for i in data]
        venue_region = [i.get("venue").get("region").encode("utf-8") for i in data]

无论我使用什么转换方法，一旦代码发送到客户端，我仍然会收到那些有问题的字符。

这个问题应该很容易解决，但是很可能会发生一些小问题，并且会阻碍其他工作。我应该如何解决这个问题？

编辑：

在页面的 html 中，我有一个表单，在它下面我有一个名为 container 的 div：

<form id = "search" method= 'POST' action = ''>{% csrf_token %}
{{ form|crispy }} 

<input type= 'submit' value= 'Submit'>
</form><br>
<div id = "container">

然后我尝试将无序列表附加到 div 并尝试附加列表元素的列表，但由于某种原因，没有附加任何内容：

var venues = {{venues|safe}};
console.log("length of artist list" + venues.length);
var $list = $("<ul  class='list-group'>");
for(var i = 0; i < venues.length; i++){
    
    $list.append("<li class='list-group-item'>Artist {{form_artistSelect}}  Location: " venues[i].city ', 'venues[i].region' Venue: ' + venues[i].name + "</ul>"); 
}
// var $resultObj = $('<div id = "inviteObj" style="margin:100px"></div>');
// $resultObj.append($divline);
$list.appendTo($("#container"));

Answer 1

这不是 JSON 问题。这是您如何生成 JavaScript 的问题。您正试图将字符串数据视为 JavaScript 对象。

此外，这些是 Python 数据结构，而不是 JSON 列表，因为您已经对它们进行了解码。这里也不需要将所有内容编码为 UTF-8。最后但同样重要的是，您可以将场地结构保留为字典/JSON 对象，因为您不需要单独使用这些列表。

您需要将列表转换回 JSON 以将它们作为 JavaScript 列表文字插入到生成的 JavaScript 中，这样您就可以将它们视为 JavaScript 对象（一旦浏览器解析了这些文字）。

data = json.load(urllib2.urlopen(url))

raw_dts = json.dumps([i["datetime"] for i in data])

ticket_urls = json.dumps([i["ticket_url"] for i in data])
ticket_statuses = json.dumps([i["ticket_status"] for i in data])
venues = json.dumps([i["venue"] for i in data])

和你的模板：

var $divline = $("<div id = ticketObj></div>");
var venues = {{ venues|safe }};

console.log("length of artist list" + venues.length );
for(var i = 0; i < venues.length; i++){

    $divline.append('Artist {{form_artistSelect}} Location: ' +  venues[i].city + ', ' + venues[i].region + ' Venue: ' + venues[i].name
 ); 

}
var $resultObj = $('<div id = "inviteObj" style="margin:100px"></div>');
$resultObj.append($divline);
$resultObj.appendTo($("#results"));

这里的{{ venues|safe }} 行告诉 Django 不要对值进行 HTML 转义，因为它们已经被编码为 JSON。