Typescript 如何调用嵌套获取？

我的代码如下所示：

const url = "https://something";
let data2 = JSON.stringify({ source: "https://someimage.jpg" });
const test1 = fetch(url, {
  method: "POST",
  headers: {
    "Content-Type": "application/json",
    "Ocp-Apim-Subscription-Key": "mykey",
  },
  body: data2,
}).then((res) =>
  console.log("postHeaderResult" + res.headers.get("Operation-Location"))
);

现在，我想做的是使用

Operation Location

头，它是

url

地址，发送

GET

请求，然后从这个新请求的主体中获取最终答案

我尝试了以下代码，但不起作用：

const url = "https://something";
let data2 = JSON.stringify({ source: "https://someimage.jpg" });
const test1 = fetch(url_to_formRecognizer, {
  method: "POST",
  headers: {
    "Content-Type": "application/json",
    "Ocp-Apim-Subscription-Key": "mykey",
  },
  body: data2,
})
  .then((res) =>
    console.log("postHeaderResult" + res.headers.get("Operation-Location"))
  )
  .then((res1) =>
    fetch(test1.headers.get("Operation-Location"), {
      method: "GET",
      headers: {
        "Ocp-Apim-Subscription-Key": "34dd609bcb5742de91e8474f0e27e88e",
      },
    }).then((res1) => console.log("finalResult" + res1 + "simple"))
  );

同时，如果我尝试我的代码，我会在

test1

上得到一个错误，但是在我的

visualstudio

中，我没有得到任何编译错误，尽管没有执行get请求。 我甚至试过下面这句话：

.catch((err) => console.log("odsPolicyRequestError" + err));

捕获错误，但它也是空的。我不明白问题是什么，我做错了什么

谢谢你的帮助

更新1：

这是我基于答案的新代码。但是，由于我的第二个电话，我终于得到了“还没有开始”。似乎第二次通话在第一次通话真正结束之前就开始了

 const url = "https://something";
let data2 = JSON.stringify({ source: documentUrl });
const res1 = await fetch(url, {
    method: "POST",
    headers: { 'Content-Type': 'application/json' , 'Ocp-Apim-Subscription-Key': apiKey},
    body: data2
});
if (!res1.ok) {
  console.log("postHeaderResult not okay first fetch" +  res1.status + " on first fetch");

}
console.log("header is:" + res1.headers.get("Operation-Location"), null);

const res2 = await  fetch(res1.headers.get("Operation-Location"), {
     method: "GET",
     headers: {'Ocp-Apim-Subscription-Key' : apiKey }
}).then( res2 => { return res2.text(); }).then(text => { api.output("text" + text, null); } );

---

你离得不远，但是：

---

您的调试实现处理程序正在干扰，将

fetch

中的实现值替换为

undefined

（

console.log

的返回值）。您将要删除它

不要使用

test1

变量。履行值提供给履行处理程序（您的回调传递给

。然后

）。这就是你想用的

大概是这样的：

const url = "https://something";
let data2 = JSON.stringify({ source: 'https://someimage.jpg'});
fetch(url_to_formRecognizer, {
    method: "POST",
    headers: { 'Content-Type': 'application/json' , 'Ocp-Apim-Subscription-Key': 'mykey'},
    body: data2
}).then(res1 => fetch(res1.headers.get("Operation-Location"), {
     method: "GET",
     headers: {'Ocp-Apim-Subscription-Key' : '34dd609bcb5742de91e8474f0e27e88e' }})
).then(res2 => {
    console.log("finalResult" + res2 + "simple");
});

但请注意，这不会消耗第一个响应或第二个响应的主体。看起来你可能不需要第一个的身体，但我猜你至少需要第二个的身体

或者，如果可以使用

async

函数，则此代码（在

async

函数中）可以使用

wait

而不是

。然后

：

const url = "https://something";
let data2 = JSON.stringify({ source: 'https://someimage.jpg'});
const res1 = await fetch(url_to_formRecognizer, {
    method: "POST",
    headers: { 'Content-Type': 'application/json' , 'Ocp-Apim-Subscription-Key': 'mykey'},
    body: data2
});
if (!res1.ok) {
    throw new Error("HTTP error " + res1.status + " on first fetch");
}
const res2 = await fetch(res1.headers.get("Operation-Location"), {
     method: "GET",
     headers: {'Ocp-Apim-Subscription-Key' : '34dd609bcb5742de91e8474f0e27e88e' }
});
if (!res2.ok) {
    throw new Error("HTTP error " + res2.status + " on second fetch");
}
console.log("finalResult" + res2 + "simple");

---

旁注：您的代码在

fetch

API（我写了一些关于它的文章）中受到了一些攻击

fetch

仅拒绝其关于网络错误的承诺，而不是HTTP错误。您需要明确地检查在HTTP级别的工作情况。以下是您可以如何做到这一点：

const url = "https://something";
let data2 = JSON.stringify({ source: 'https://someimage.jpg'});
fetch(url_to_formRecognizer, {
    method: "POST",
    headers: { 'Content-Type': 'application/json' , 'Ocp-Apim-Subscription-Key': 'mykey'},
    body: data2
}).then(res1 => {
    if (!res1.ok) {
        throw new Error("HTTP error " + res1.status + " on first fetch");
    }
    return fetch(res1.headers.get("Operation-Location"), {
         method: "GET",
         headers: {'Ocp-Apim-Subscription-Key' : '34dd609bcb5742de91e8474f0e27e88e' }
    });
}).then(res2 => {
    if (!res2.ok) {
        throw new Error("HTTP error " + res2.status + " on second fetch");
    }
    console.log("finalResult" + res2 + "simple");
});

（或者使用

fetch

包装器为您执行

ok

检查，正如我在链接的博文中所描述的那样。）

---

---

旁注2：务必处理承诺拒绝（在这种情况下，可能在末尾使用

.catch

），或者将承诺链传递回调用方，以便调用方可以检查它。您的代码似乎也不起作用。

您离得不远，但：

---

您的调试实现处理程序正在干扰，将

fetch

中的实现值替换为

undefined

（

console.log

的返回值）。您将要删除它

不要使用

test1

变量。履行值提供给履行处理程序（您的回调传递给

。然后

）。这就是你想用的

大概是这样的：

const url = "https://something";
let data2 = JSON.stringify({ source: 'https://someimage.jpg'});
fetch(url_to_formRecognizer, {
    method: "POST",
    headers: { 'Content-Type': 'application/json' , 'Ocp-Apim-Subscription-Key': 'mykey'},
    body: data2
}).then(res1 => fetch(res1.headers.get("Operation-Location"), {
     method: "GET",
     headers: {'Ocp-Apim-Subscription-Key' : '34dd609bcb5742de91e8474f0e27e88e' }})
).then(res2 => {
    console.log("finalResult" + res2 + "simple");
});

但请注意，这不会消耗第一个响应或第二个响应的主体。看起来你可能不需要第一个的身体，但我猜你至少需要第二个的身体

或者，如果可以使用

async

函数，则此代码（在

async

函数中）可以使用

wait

而不是

。然后

：

const url = "https://something";
let data2 = JSON.stringify({ source: 'https://someimage.jpg'});
const res1 = await fetch(url_to_formRecognizer, {
    method: "POST",
    headers: { 'Content-Type': 'application/json' , 'Ocp-Apim-Subscription-Key': 'mykey'},
    body: data2
});
if (!res1.ok) {
    throw new Error("HTTP error " + res1.status + " on first fetch");
}
const res2 = await fetch(res1.headers.get("Operation-Location"), {
     method: "GET",
     headers: {'Ocp-Apim-Subscription-Key' : '34dd609bcb5742de91e8474f0e27e88e' }
});
if (!res2.ok) {
    throw new Error("HTTP error " + res2.status + " on second fetch");
}
console.log("finalResult" + res2 + "simple");

---

旁注：您的代码在

fetch

API（我写了一些关于它的文章）中受到了一些攻击

fetch

仅拒绝其关于网络错误的承诺，而不是HTTP错误。您需要明确地检查在HTTP级别的工作情况。以下是您可以如何做到这一点：

const url = "https://something";
let data2 = JSON.stringify({ source: 'https://someimage.jpg'});
fetch(url_to_formRecognizer, {
    method: "POST",
    headers: { 'Content-Type': 'application/json' , 'Ocp-Apim-Subscription-Key': 'mykey'},
    body: data2
}).then(res1 => {
    if (!res1.ok) {
        throw new Error("HTTP error " + res1.status + " on first fetch");
    }
    return fetch(res1.headers.get("Operation-Location"), {
         method: "GET",
         headers: {'Ocp-Apim-Subscription-Key' : '34dd609bcb5742de91e8474f0e27e88e' }
    });
}).then(res2 => {
    if (!res2.ok) {
        throw new Error("HTTP error " + res2.status + " on second fetch");
    }
    console.log("finalResult" + res2 + "simple");
});

（或者使用

fetch

包装器为您执行

ok

检查，正如我在链接的博文中所描述的那样。）

---

---

旁注2：务必处理承诺拒绝（在这种情况下，可能在末尾使用

.catch

），或者将承诺链传递回调用方，以便调用方可以检查它。您的代码似乎也不起作用。

调试实现处理程序正在干扰，将

fetch

中的实现值替换为

未定义的
（console.log的返回值）。请尝试使用async/await。它将更清晰易读，然后更容易调试阅读它的easyYour调试实现处理程序正在干扰，将
获取
中的实现值替换为
未定义的
（console.log的返回值
）。尝试使用异步/等待。这将是更干净和可读性，然后它将更容易调试阅读关于它很容易，为您的完整答案和抱歉，如果我问（仍然问）愚蠢的问题很多。我刚开始用typescript编程2-3周。你能告诉我怎样才能拿到res2的尸体吗？我已经尝试了
res2.status
，它是ok和200，这意味着一切似乎都很好，但是
res2.text
、
res2
、和
res2.body
都没有返回我期望的响应。我只是得到一些不相关的对象或文本。@user13578-不用担心！您可以使用响应对象上执行该操作的方法之一来读取正文。例如，如果您希望它作为文本，您可以调用并等待它返回的承诺实现。但是当我使用text（）时，我得到
text（）{return consumerbody.call（this）。然后（函数（buffer）{return buffer.toString（）；}）；}
@user13578-正如我前面所说的，您需要等待承诺实现。例如：
。然后（res2=>{if（！res2.ok）{抛出新错误（/*…*/）；}返回res2.text（）；}）。然后（text=>{/*使用此处的文本*/}）
。再次感谢。现在，我又犯了一个错误。你能看看我问题的更新1吗？非常感谢你的完整回答，如果我问了（并且仍然问）愚蠢的问题，我感到抱歉。我刚开始用typescript编程2-3周。