Question

我正在运行这个小节点快递服务器，该服务器应该检查凭证是否有效，然后将回复发送回客户端

这是我的代码

app.post('/voucher', function (request, response) {
    response.setHeader('Access-Control-Allow-Origin', '*');
    response.setHeader('Access-Control-Request-Method', '*');
    response.setHeader('Access-Control-Allow-Methods', 'OPTIONS, GET');
    response.setHeader('Access-Control-Allow-Headers', 'authorization, content-type');
      if ( request.method === 'OPTIONS' ) {
        response.writeHead(200);
        response.end();
        return;
      }
    console.log(request)
    let results;
    let body = [];
        request.on('data', function(chunk) {
        body.push(chunk);
      }).on('end', function() {
        results = Buffer.concat(body).toString();
        // results = JSON.parse(results);

        console.log('#### CHECKING VOUCHER ####', results)
        let success = {success: true, voucher: {name: results,
                                    xxx: 10}}
        success = qs.escape(JSON.stringify(success))

        response.end(success)

      } )
    }
  );

这显然只是一个例子，实际检查尚未实施。到现在为止还挺好。

现在在我使用REACT的客户端，我似乎无法解码我刚发送的字符串。

我正在做这个

var voucherchecker = $.post('http://localhost:8080/voucher', code , function(res) {   

  console.log(res)
  let x = JSON.parse(res)
  console.log(x)
  console.log(qs.unescape(x))

它给了我错误

未捕获的SyntaxError：位于0的JSON中的意外标记％

当我以另一种方式执行时

      let x = qs.unescape(res)
  console.log(x)
  console.log(JSON.parse(x))

比它告诉我

未捕获的TypeError：_querystring2.default.unescape不是函数

也许你可以帮助我？我不知道这里的问题是什么。谢谢。

另外还有一个问题，因为我只是一个初学者。有没有更聪明的方法来做这些事情，而不是我现在这样做？我已经做出了反应，在客户端呈现，我有一个迷你快递服务器，在支付过程中与它进行了几次交互。两者都在不同的端口上运行。

做这些事情的标准方法或最佳做法是什么？

Answer 1

我对你的后端代码在请求中发生了太多事情感到有点困惑。既然你问过是否有不同的写法，我将与你分享我将如何写它。

服务器

您似乎希望您的请求启用CORS，您似乎最初也想在您的请求正文中解析JSON。

我建议您重新编写端点

使用正文JSON接收请求的POST /凭证

{
  code: "xxxxx"
}

并以

{
  success: true, 
  voucher: {
    name: results,
    xxx: 10
  }
}

我建议您使用express的中间件功能，因为您可能会在大多数请求中使用CORS并解析JSON，所以在您的项目中我会这样做。

npm install body-parser
npm install cors

然后在您的应用初始化

var bodyParser = require('body-parser')
var cors = require('cors')

var app = express()

// parse application/x-www-form-urlencoded
app.use(bodyParser.urlencoded({ extended: false }))

// parse application/json you can choose to just pars raw text as well
app.use(bodyParser.json())

// this will set Access-Control-Allow-Origin * similar for all response headers
app.use(cors())

您可以在各自的回购中详细了解body-parser和cors，如果您不想使用它们，我仍会建议您使用自己的中间件以减少未来的冗余在你的代码中。

到目前为止，这将取代代码的这一部分

response.setHeader('Access-Control-Allow-Origin', '*');
response.setHeader('Access-Control-Request-Method', '*');
response.setHeader('Access-Control-Allow-Methods', 'OPTIONS, GET');
response.setHeader('Access-Control-Allow-Headers', 'authorization, content-type');
  if ( request.method === 'OPTIONS' ) {
    response.writeHead(200);
    response.end();
    return;
  }
console.log(request)
let results;
let body = [];
    request.on('data', function(chunk) {
    body.push(chunk);
  }).on('end', function() {
    results = Buffer.concat(body).toString();
    // results = JSON.parse(results);

现在你的路线定义可以是

app.post('/voucher', function (request, response) {
  var result = request.body.code // added by body-parser
  console.log('#### CHECKING VOUCHER ####', result)
  // express 4+ is smart enough to send this as json
  response.status(200).send({
    success: true,
    voucher: {
      name: results,
      xxx: 10
    }
  })
})

客户端

您的客户端可以是，假设$是jquery的帖子功能

var body = {
  code: code
}
$.post('http://localhost:8080/voucher', body).then(function(res) {   
   console.log(res)
   console.log(res.data)
   return res.data
})

通过post请求发送嵌套对象

1 个答案:

服务器

客户端