Javascript

Question

我正在尝试使用 Dialogflow 的内联编辑器中的 Axios 执行一些 API 调用，但无法使其正常工作，您能帮我吗？

function calc(agent) {
    axios.get('https://maps.googleapis.com/maps/api/geocode/json?address=xxx')
      .then((result) => { 
             const Lat2 = result.data.results[0].geometry.location.lat;
             const Lng2 = result.data.results[0].geometry.location.lng;
      });
    const data = {
       "addresses": [
                {
                    "lat": Lat2,
                    "lon": Lng2,
                }
            ]
        };
    return axios.post('https://api.test.XXXX', data, {
        headers: {
            'Content-Type': 'application/json',
            'Authorization': 'YYYYYY'
        }})
    .then((result) => {
      const cant = result.data.total.amount;
            agent.add('This is ' + cant);
    });
    }

关于数据常量，我无法将 "lat" 和 "lon" 分配给 Lat2 和 Lng2 变量。

谢谢。

亲切的问候

Answer 1

请注意，Lat2 和 Lon2 的范围在传递给第一个 .then() 的函数内。要访问它们，您需要从该函数 return 它们然后在之后链接另一个 .then()，或者您可以将以后的处理移动到同一函数中。

承诺链接：

axios
  .get('https://maps.googleapis.com/maps/api/geocode/json?address=xxx')
  .then(result => {
    const Lat2 = result.data.results[0].geometry.location.lat;
    const Lng2 = result.data.results[0].geometry.location.lng;
    return { Lat2, Lng2 };
  })
  .then(({ Lat2, Lng2 }) => {
    const data = {
      addresses: [
        {
          lat: Lat2,
          lon: Lng2
        }
      ]
    };

    return axios.post('https://api.test.XXXX', data, {
      headers: {
        'Content-Type': 'application/json',
        Authorization: 'YYYYYY'
      }
    });
  })
  .then(result => {
    const cant = result.data.total.amount;
    agent.add('This is ' + cant);
  });

稍后在同一函数内处理：

axios
  .get('https://maps.googleapis.com/maps/api/geocode/json?address=xxx')
  .then(result => {
    const Lat2 = result.data.results[0].geometry.location.lat;
    const Lng2 = result.data.results[0].geometry.location.lng;

    const data = {
      addresses: [
        {
          lat: Lat2,
          lon: Lng2
        }
      ]
    };

    return axios
      .post('https://api.test.XXXX', data, {
        headers: {
          'Content-Type': 'application/json',
          Authorization: 'YYYYYY'
        }
      })
      .then(result => {
        const cant = result.data.total.amount;
        agent.add('This is ' + cant);
      });
  });

Answer 2

也许可以尝试 async/await 方法：

async function calc(agent) {
    const result = await axios.get('https://maps.googleapis.com/maps/api/geocode/json?address=xxx') 
    const Lat2 = result.data.results[0].geometry.location.lat;
    const Lng2 = result.data.results[0].geometry.location.lng;
    const data = {
        "addresses": [
            {
                "lat": Lat2,
                "lon": Lng2,
            }
        ]
    };
    const result2 = await axios.post('https://api.test.XXXX', data, {
        headers: {
            'Content-Type': 'application/json',
            'Authorization': 'YYYYYY'
        }})
    const cant = result2.data.total.amount;
    agent.add('This is ' + cant);
}

Answer 3

为什么不在 first call 的 then 子句中进行 next call？这些 axios 调用是异步的，这意味着您第一次调用的 then 子句将在其下方编写的代码之后执行。请参阅本文以了解异步调用的工作原理：https://medium.com/codebuddies/getting-to-know-asynchronous-javascript-callbacks-promises-and-async-await-17e0673281ee

Javascript - 在新请求中使用先前请求的数据

Javascript - Use data from previous request in a new request

axios

dialogflow-es

承诺链接：

稍后在同一函数内处理：