从 node.js/express 服务器读取 JSON 对象的 AJAX 请求

Question

我设置了一些服务器端代码来向外部网站发出请求并返回一个 JSON 对象，然后将其传递给我的 node.js/express 应用程序的客户端。然后我打算在客户端对 JSON 执行一些额外的处理。

在我的 index.js 文件中，我定义了以下代码来呈现我的视图并对外部网站进行 RESTful 调用：

var express = require('express');
var router = express.Router();
var request = require('request');

// Urls for external server REST API function calls
var url = 'https://someserver.com/appserver/portal/api/1.0/results/recent';

/* GET list of recent reports */
router.get('/testapi', function(req, res, next) {
  res.render('testapi', { title: 'List Recent Reports' });
});

/* TEST: function to GET report list */
router.get('/recentreports', function(req, res){
  request({
    url: url,
    json: true
  }, function (error, response, body) {
      if (!error && response.statusCode === 200) {
        res.send(body); // Send the response to the client
    } else {
        console.log(error);
    }
  })
});


module.exports = router;

在我的翡翠视图中，我设置了一个按钮来调用 /recentreports 函数并发出请求（可能是 AJAX 请求？）以从服务器接收 JSON 对象。

我的问题是：如何将服务器的响应读入客户端应用程序，以便处理 JSON？

我的玉观如下：

extends layout

head

block content
  h1= title
  p Welcome to #{title}
  script.
    // not sure what goes here
    $(function()){
      $('#getRecentReports').on('', function() {
          $.get('recentreports', function(body) {
            $('#jsonbody').html(body)
          })
        })
    }

  button(
    onclick = "getRecentReports()" 
  )

编辑：在使用它之后更新了 .jade 代码

Answer 1

我的推荐建议：

script.
  $(function() {
    $('#getRecentReports').on('click', function() {
      $.get('recentreports', function(body) {
        $('#jsonbody').html(body)
      });
    });
  });

button(
  id = "getRecentReports"
)

渲染：

<script>
  $(function() {
    $('#getRecentReports').on('click', function() {
      $.get('recentreports', function(body) {
        $('#jsonbody').html(body)
      });
    });
  });

</script>
<button id="getRecentReports"></button>

或者：

script.
  function getRecentReports() {
    $.get('recentreports', function(body) {
      $('#jsonbody').html(body)
    });
  }

button(
  onclick = "getRecentReports()"
)

渲染：

<script>
  function getRecentReports() {
    $.get('recentreports', function(body) {
      $('#jsonbody').html(body)
    });
  }

</script>
<button onclick="getRecentReports()"></button>