Javascript 将PostGIS点对象转换为geoJSON进行映射

我有一个Django应用程序，里面有postgres db的PostGIS活动，我正试图使用传单和Mapbox在前端视图上绘制

我正在序列化视图中的活动，并在模板中将它们呈现为geoJSON（

{{{props.activitiesJson | safe}}

）

[可以将其呈现为html并查看页面上的JSON对象]

views.py（ex）

模板：

var map_activities = JSON.parse("{{ props.activitiesJson }}");
L.geoJSON(map_activities).addTo(map); 

如果我直接在模板上呈现

{{props.activitiesJson}

或

{{props.activitiesJson | safe}}

（不在脚本内部或解析它），我会看到以下数据结构：

{"type": "FeatureCollection", "crs": {"type": "name", "properties": {"name": "EPSG:4326"}}, "features": [{"type": "Feature", "properties": {"cause": 1, "name": "Test Action", "slug": "test-action", "is_active": true, "image": "test.jpeg", "description": "test description", "date_start": null, "date_end": null, "skills_required": false, "on_site": false, "address_street": "123 Main St.", "address_street_2": "", "address_city": "New York", "address_state": "NY", "address_zip": "10013", "address_country": "", "location_city": "", "location_state": "", "location_country": "", "skills_list": [], "pk": "1"}, "geometry": null}]}

但是试图用JSON.parse（）解析它会抛出一个语法错误：

JSON.parse: expected property name or '}' at line 1 column 2 of the JSON data 

我如何有效地将该geoJSON对象分配给我的map_活动变量？我需要解析它吗？（即，

var-map_-activities={{props.activitiesJson}；

）

感谢

最终（不确定这是否是最佳实践），对我来说，正确的方法根本不是解析geoJSON对象并将其直接传递给变量

var map_activities = {{ props.activitiesJson|safe }};

---

另外，我们可以尝试下面的代码

def map(request):    
   activities = Activity.get_activities_near(lat, lng, radius)
   activitiesData = []
   for activity in activities:
      listdata = {'id': activity.id, 'name': activity.name} # As per requirement
      activitiesData.append(listdata)
   response = HttpResponse(json.dumps(activitiesData))
   return response

---

你能在

json.parse（“{{props.activitiesJson | safe}”）中粘贴呈现的json吗

看起来像？@KamilNiski添加了{{props.activitiesJson | safe}}的直接呈现-我无法console.log或呈现JSON.parse（），因为参数列表后有“Uncaught SyntaxError:missing”）如果您的活动包含任何用户提供的输入，这种方法就是XSS安全漏洞！将其中一个活动名称设置为

alert（'XSS'）

，然后查看发生了什么。您必须使用

escapejs

过滤器。

def map(request):    
   activities = Activity.get_activities_near(lat, lng, radius)
   activitiesData = []
   for activity in activities:
      listdata = {'id': activity.id, 'name': activity.name} # As per requirement
      activitiesData.append(listdata)
   response = HttpResponse(json.dumps(activitiesData))
   return response