加载页面nodejs时从服务器发送数据到客户端答案

【问题标题】：Send data from server to client upon loading page nodejs加载页面nodejs时从服务器发送数据到客户端
【发布时间】：2016-04-01 01:44:30
【问题描述】：

我在服务器端有一个这样定义的端点：

app.get('/', function(req, res) {
  res.send(densityList);
});

当我点击http://localhost:port/ 时，如果我没有记错，这就是在服务器上点击的端点。

点击主页后，我希望向客户端发送一个全局定义的密度列表（将被填充），客户端将使用它来填充地图。

这是我的客户端代码：

  <script>          

    $(document).ready(function() {

        $.get('/', {}, function(data){

            L.map.accessToken = 'pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpandmbXliNDBjZWd2M2x6bDk3c2ZtOTkifQ._QA7i5Mpkd_m30IGElHziw'

            console.log("before creating map");
            console.log(data);

            var mymap = L.map('mapid').setView([37.8, -96], 4); 

            console.log("creating map")
            L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpandmbXliNDBjZWd2M2x6bDk3c2ZtOTkifQ._QA7i5Mpkd_m30IGElHziw', {
                maxZoom: 18,
                attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
                    '<a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
                    'Imagery © <a href="http://mapbox.com">Mapbox</a>',
                id: 'mapbox.streets'
            }).addTo(mymap);

            var heat = L.heatLayer(data, {radius: 25}).addTo(mymap);
        });
    });
    </script>

我认为这行代码应该捕获服务器发送的任何内容：

$.get('/', {}, function(data){

但是，当我这样做时：

console.log(data)

打印整个 html 文件。有人可以建议如何在首页第一次点击时发送这些数据吗？

【问题讨论】：

标签： javascript html ajax node.js express

【解决方案1】：

我认为你应该从$.get() syntax 中删除{} 它应该是这样的：

$.get("/", function(data, status){
L.map.accessToken = 'pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpandmbXliNDBjZWd2M2x6bDk3c2ZtOTkifQ._QA7i5Mpkd_m30IGElHziw'

            console.log("before creating map");
            console.log(data);

            var mymap = L.map('mapid').setView([37.8, -96], 4); 

            console.log("creating map")
            L.tileLayer('https://api.tiles.mapbox.com/v4/{id}/{z}/{x}/{y}.png?access_token=pk.eyJ1IjoibWFwYm94IiwiYSI6ImNpandmbXliNDBjZWd2M2x6bDk3c2ZtOTkifQ._QA7i5Mpkd_m30IGElHziw', {
                maxZoom: 18,
                attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, ' +
                    '<a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, ' +
                    'Imagery © <a href="http://mapbox.com">Mapbox</a>',
                id: 'mapbox.streets'
            }).addTo(mymap);

            var heat = L.heatLayer(data, {radius: 25}).addTo(mymap);
            console.log("Data: " + data + "\nStatus: " + status);
        });

希望对你有帮助:)

【讨论】：

kashap，不幸的是没有做到这一点。我仍然碰巧将我的 html 文件打印为数据。 ://

【解决方案2】：

您需要像这个问题一样正确安排路由和静态文件：node.js and express: possible to skip from route back to middleware (static)?

例如，您可以在$.get 中包含一些参数，并在路由器定义中进行一些条件检查。

【讨论】：