-2

将我的服务器端“数据”传递给客户端后，我无法将“数据”存储到变量中并接收未定义的数据。

为什么会发生这种情况，我该如何解决？

请求是在客户端发出的：

(function () {

    var M;
    var url = '/app/get/metafield';

    fetch(url)
        .then((response) => response.json())
        .then(function (data) {
            filter(data)
        });

    function filter(data) {
        console.log('data :', data) // 25
        M = JSON.stringify(data);

    }

        console.log('M :', M) // undefined
});

这是服务器端代码：

  app.get('/app/get/metafield', function (req, res, next) {

               function (error, response, body) {
                    var data = JSON.parse(body)
                    var M = data.metafields[0].value;
                    return res.json(M);
                })

    });
4

2 回答 2

1

您应该尝试在.then()块内运行 console.log。这是因为 http 请求是异步操作，因此在您上面的代码块中，console.log('M :', M)将在请求完成并返回之前执行 with 行。

因此，您应该console.log()在您定义的过滤器函数中添加语句，以便在console.log()履行承诺后执行。

fetch(url)
  .then((response) => response.json())
  .then(function (data) {
    filter(data);
    console.log(data);
  });

function filter(data) {
  console.log('data :', data) // 25
  M = JSON.stringify(data);
  console.log('M :', M)
}
于 2019-05-31T04:23:58.127 回答
1

这里的问题是fetch调用是async的，这意味着你不能确定它什么时候完成。相反，如果您想要任何依赖于调用结果的数据，则fetch必须将其链接到回调。

你可以这样想：

  1. 我告诉我的朋友去fetch一个 URL，但不是等到他完成，而是给他指示（回调）当他完成后做什么，然后我可以在此期间做其他事情。指令还包含对M他完成后要更新的变量的访问。

  2. 我不知道他什么时候完成，所以我不能依赖M获取数据的价值来做任何我想做的事情。所以如果我想要一些依赖于获取数据的东西，我必须将它包含在指令中。

补救方法是在 Promise 链上附加另一个回调。您可以以函数式编程风格执行此操作：

fetch(url)
    .then((response) => response.json())
    .then(filter)
    .then(process);

function filter(data) {
    console.log('data :', data) // 25
    return JSON.stringify(data);
}

function process(data) {
    ...
}

您可以在此处阅读有关 Promise 链接的更多信息：

注意：对于高度异步的代码使用全局变量通常不是一个好主意。你已经明白了原因；很难知道何时将变量设置为什么值，因为无法保证异步函数的执行顺序。更好的方法是传递您需要使用的数据，就像我在上面使用process(data). 这被称为pure函数，因为没有触及函数之外的变量，它所做的只是获取输入参数并将其转换为返回值。

于 2019-05-31T04:32:46.770 回答