javascript - 如何在 Typescript 中读取 json 响应

Question

我是 Typescript 的新手

如何从我的回调函数中读取函数 json 响应？

这是我的函数，它返回 html 内容...

async function getContent(src: string) {

    try {
        const response = await fetch(src);

        if (!response.ok) {
          throw new Error(`Error! status: ${response.status}`);
        }

        const result = { content: await response.text(), correlationId: response.headers.get("x-correlationid") };
        return result;
    } catch (error) {
        if (error instanceof Error) {
            return error.message;
        } else {
            return 'An unexpected error occurred';
        }
    }
}

这就是我尝试从响应中读取 json 的方式。但是 result.json() 以红色突出显示并显示错误 "Property json does not exists on type string"

getContent(src)
        .then( result => result.json())
        .then( post => {
            iframe.contentDocument.write(post.content);
        })
        .catch( error => {
            console.log(error);
        });

***** 更新 ******

问题出在我的 getContent 函数内部，catch block 必须在相同的对象结构中返回错误。

功能更新

async function getContent(src: string) {

    try {
        const response = await fetch(src);

        if (!response.ok) {
          throw new Error(`Error! status: ${response.status}`);
        }

        const result = { content: await response.text(), correlationId: response.headers.get('x-correlationid') };
        return result;
    } catch (error) {
        if (error instanceof Error) {
            return { content: error.message, correlationId: undefined };
        } else {
            return { content: 'An unexpected error occurred', correlationId: undefined };
        }
    }
}

和函数调用

getContent(src)
    .then( result => {
        iframe.contentDocument.write(result.content);
        console.log(`I have the correlation ${result.correlationId}`);
    })
    .catch( error => {
        console.log(error.content);
    });

Answer 1

https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch#body

您可以在 fetch 方法返回的响应对象上看到开箱即用的方法。您当前正在使用 text 方法将正文内容提取为文本。您可能想删除在响应中调用 json 的行，因为 iframe 文档上的 write 方法无论如何只能使用字符串:

getContent(src)
    .then( post => {
        iframe.contentDocument.write(post.content);
    })
    .catch( error => {
        console.log(error);
    });

简而言之:getContent 函数返回的对象上不存在 .json 方法。您可以对内容运行 JSON.parse，但正如我上面所解释的，您应该在响应中应用 json 方法。