0

geonames API を使用しており、ポスト リクエストでデータを取得しています。今、私はこれらのデータ (lat、long) の一部を取り、それを別の API (weatherbit API) に渡したいと思っています。これは、私のプロジェクトが URL で (lat と long) を渡し、そこからデータを取得する必要があるためです。サーバー側で情報を取得してAPIキーを保護しますが、undefined. コードはundefinedURLパラメータで私に与えます

(例. https://api.weatherbit.io/v2.0/forecast/daily/&lat=undefined&lon=undefined&key=API_KEY )

ここに私のコードどうすればいいですか?

編集:ボタンをもう一度押すと、リクエストは正常に機能しました。したがって、最初の API から緯度と経度のデータを取得する前に、ボタンを 2 回押す必要があります。解決方法 >

ボタンの結果の最初のヒット

ボタンの 2 回目のヒットの結果

クライアント側で

const getWeatherIoURL = async (url) => {
  const response = await fetch(url);
  try {
    const data = await response.text();
    //console.log(data);
    return data;
  } catch (error) {
    console.error(error);
  }
};
export default getWeatherIoURL;

ポストリクエストと取得リクエストの両方のサーバー側の私のコード

weatherData = {}
app.post('/geoNamesData', (request, response) => {
  weatherData['date'] = new Date();
  weatherData['countryName'] = request.body.countryName;
  weatherData['latitude'] = request.body.latitude;
  weatherData['longitude'] = request.body.longitude;
  response.send(weatherData);
});

//console.log(`your api is: ${process.env.API_WEATHER_KEY}`);

app.get('/weatherURL', (request, respond) => {
  const url_forecast = 'https://api.weatherbit.io/v2.0/forecast/daily';
  const lat = `lat=${weatherData.latitude}`;
  const long = `lon=${weatherData.longitude}`;
  const url = `${url_forecast}?${lat}&${long}&key=${process.env.API_WEATHER_KEY}`;
  console.log(url);

  respond.send(url);
});

私のコード構造

import geoNamesData from './geoNames_data';
import getWeatherIoURL from './weather_bit';
import postData from './post_geoNames';
//import exposeWeatherIoForecast from './weather_bit'

export function main() {
  document.getElementById('search').addEventListener('click', (event) => {
    event.preventDefault();
    const baseURL = 'http://api.geonames.org/searchJSON?q=';
    const API_Credentials = '&username=*********';
    const destination = document.querySelector('#destination').value;


    geoNamesData(baseURL, destination, API_Credentials).then((data) => {
        //console.log(data);
        postData('/geoNamesData', {
          date: new Date(),
          countryName: data.countryName,
          latitude: data.lat,
          longitude: data.lng,
        });
      });
      getWeatherIoURL('/weatherURL').then((data) => {
        console.log(data);
        exposeWeatherIoForecast(data);
      });
 }


私のコードの流れは、ジオネームAPIを使用してユーザーが入力した特定の都市の緯度、経度、国名を取得し、このリクエストからの緯度と経度を別のAPI(wathearbit)のパラメーターとして使用します-リクエストを完了するためにこれらのデータが必要です-都市の現在または予測の天気を取得し、これらの情報で UI を更新する**都市、国名、天気**

4

1 に答える 1