首页 > 解决方案 > 获取路线是正确的,但 api 仍然无法正常工作(什么都没有)

问题描述

我正在尝试为此 API 创建一条获取路线:

https://api.nasa.gov/mars-photos/api/v1/rovers/opportunity/photos?sol=1000&api_key=92Ll6nGuQhfGjZnT2gxaUgiBhlCJ9K1zi2Fv5ONn

尽管 get 路由的语法,API 仍然不能在邮递员和客户端工作。

这是获取路线代码:

app.get('/roverInfo/:rover_name', async (req, res) => {
  const { rover_name } = req.params

  try {
    let images = await fetch(`https://api.nasa.gov/mars-photos/api/v1/rovers/${rover_name}/photos?sol=1000&api_key=${process.env.API_KEY}`).then((res) => res.json())
    res.send({ images })
  } catch (err) {
    console.log('error:', err)
  }
})

沙箱在这里

这是客户端请求:

const showRovers = async (rovers) => {
  try {
    await fetch(`https://localhost:3000/roverInfo/:rover_name`)
      .then((res) => {
        return res.json()
      })
      .then((rovers) => updateStore(store, { rovers }), console.log(rovers))
  } catch (error) {
    console.log('errors:', error)
  }
}

这是我得到的错误:

Failed to load resource: net::ERR_SSL_PROTOCOL_ERROR

标签: javascriptexpress

解决方案


建议:不要将 await/async 与 .then 混合使用,使用其中之一

app.get("/roverInfo/:rover_name", async (req, res) => {
  const { rover_name } = req.params;

  try {
    const res = await fetch(
      `https://api.nasa.gov/mars-photos/api/v1/rovers/${rover_name}/photos?sol=1000&api_key=${process.env.API_KEY}`
    ) // removed .then
    const images = await res.json(); // await response to json
    res.send({ images });
  } catch (err) {
    console.log("error:", err);
  }
});

02.应该是http而不是https

03.需要将流动站名称传递给参数而不是使用:rover_name

let getRovers = showRovers('opportunity');

const showRovers = async (roverName) => {
  try {
    console.log("roverName", roverName)
    // use http here
    await fetch(`http://localhost:3000/roverInfo/${roverName}`) 
      .then((res) => {
        return res.json();
      })
      .then((rovers) => updateStore(store, { rovers }));
  } catch (error) {
    console.log("errors:", error);
  }
};

推荐阅读