如何使用fetch返回promise回调的返回值?

时间:2017-04-10 10:14:54

标签: javascript ecmascript-6 fetch-api

我有点难过。我忘记了怎么做。 我有一个名为ext.get()的函数,它接受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())

        });

    };

2 个答案:

答案 0 :(得分:8)

如果您需要将响应作为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
});

答案 1 :(得分:2)

您正在使用fetch,这是一个异步API。这意味着您的函数也必须是异步的 - 即它必须返回Promise。 (你可以通过回调来做到这一点,但这是2017年......)

您无法从函数返回JSON,因为该函数将在服务器响应可用之前返回。您必须在致电代码中使用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");