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中，我有表单，在其下面我有一个名为容器的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了。

unicode转换后JSON中的字符无效

编辑：

1 个答案: