如何使用fetch返回Promise回调函数中的返回值？

Question

我有点困惑。我忘记怎么做了。 我有一个叫做ext.get()的函数，它需要一个参数url。它会从该url获取响应。ext.get()函数旨在将响应作为json返回。我不认为它正在这样做。

ext.get = (url) => {
        let myHeaders = new Headers();

        let options = {
            method: 'GET',
            headers: myHeaders,
            mode: 'cors'
        };

        //fetch get

        fetch(url, options).then(response => {
            console.log(JSON.stringify(response.json()))
            return JSON.stringify(response.json())

        });

    };

- Blaze349

---

返回 fetch(…) - Ry-

具体来说，这个答案：https://dev59.com/RGYq5IYBdhLWcg3wwDRA#30180679 - Liam

注意：ext.get 只能返回 Promise，如果你想让它工作。 - Jaromanda X

Answer 1

如果您需要将响应作为JSON返回- 并且考虑到response.json()与response.text().then(txt => JSON.parse(txt))的效果相同

    return fetch(url, options).then(response => response.text());

因此，完整的函数将是

ext.get = (url) => {
    let myHeaders = new Headers();
    let options = {
        method: 'GET',
        headers: myHeaders,
        mode: 'cors'
    };
    return fetch(url, options).then(response => response.text());
};

这样你就不会实际执行 JSON.stringify(JSON.parse(json)) ... 这只是 json

然而，我怀疑你想要一个普通的 JavaScript 对象

ext.get = (url) => {
    let myHeaders = new Headers();
    let options = {
        method: 'GET',
        headers: myHeaders,
        mode: 'cors'
    };
    return fetch(url, options).then(response => response.json());
};

您可以这样使用：

ext.get('url').then(result => {
    // result is the parsed JSON - i.e. a plan ol' javascript object
});

- Jaromanda X

Answer 2

您正在使用异步API fetch，这意味着您的函数必须也是异步的——也就是说，它必须返回一个Promise。（虽然您可以使用回调实现这一点，但现在已经是2017年了...）

您不能从函数中返回JSON，因为函数会在服务器响应可用之前就返回。您必须返回一个Promise并在调用代码中使用then（或await）处理它。

这里最简单、最好的方法就是在fetch调用完成后直接返回结果。您不需要解析JSON，而是要将其作为字符串返回。这需要使用response.text()调用：

ext.get = (url) => {
    let myHeaders = new Headers();

    let options = {
        method: 'GET',
        headers: myHeaders,
        mode: 'cors'
    };

    //fetch get

    return fetch(url, options).then(response => response.text());
};

你的呼叫代码：

ext.get('http://example.com').then((response) => {
    console.log(response); // or whatever
});

或者使用await：

let response = await ext.get("http://example.com");

- lonesomeday