ApolloError：连接器：HTTP 错误：错误请求 - 405

Question

我有一个 nextjs 14 天气项目，我第一次使用 Graphql、Apollo 和 stepzen。我遇到了这样的错误；

 ⨯ node_modules/@apollo/client/errors/index.js (28:27) @ call
ApolloError: Connector: HTTP Error: Bad Request
    at new Promise (<anonymous>)
    at Array.forEach (<anonymous>)
null
 ⨯ node_modules/@apollo/client/errors/index.js (28:27) @ call
 ⨯ ApolloError: Response not successful: Received status code 405
    at new Promise (<anonymous>)
    at Array.forEach (<anonymous>)
digest: "1155966032"

这是 page.tsx，位于位置/[城市]/[纬度]/[经度]

import { getClient } from "../../../../../../apollo-client";
import fetchWeatherQuery from "../../../../../../graphql/queries/fetchWeatherQueries";

type Props = {
  params: {
    city: string;
    lat: string;
    long: string;
  };
};

async function weatherPage({ params: { city, lat, long } }: Props) {
  const client = getClient();
  const { data } = await client.query({
    query: fetchWeatherQuery,
    variables: {
      current: "true",
      daily: "true",
      hourly: "true",
      latitude: lat,
      longitude: long,
      timezone: "GMT",
      pastdays: "false",
    },
  });

  const result: Root = data.myQuery;
  console.log(result);
  return <div>Weater page {city + lat + long}</div>;
}

export default weatherPage; 

apollo_client.ts

import { ApolloClient, InMemoryCache } from "@apollo/client";

let client: ApolloClient<any> | null = null;

export const getClient = () => {
  console.log(process.env.API_URL);
  client = new ApolloClient({
    uri: process.env.API_URL,
    cache: new InMemoryCache(),
    headers: {
      Authorization: `apikey ${process.env.STEPZEN_API_KEY}`,
    },
  });

  return client;
};

和 fetchWeatherQuery.ts

import { gql } from "@apollo/client";

const fetchWeatherQuery = gql`
  query myQuery(
    $current: String
    $daily: String
    $hourly: String
    $latitude: String
    $longitude: String
    $past_days: String
    $timezone: String
  ) {
    myQuery(
      current: $current
      daily: $daily
      hourly: $hourly
      latitude: $latitude
      longitude: $longitude
      past_days: $past_days
      timezone: $timezone
    ) {
      current {
        interval
        temperature_2m
        time
      }
      current_units {
        interval
        temperature_2m
        time
      }
      daily {
        temperature_2m_max
        time
        weather_code
      }
      daily_units {
        temperature_2m_max
        time
        weather_code
      }
      elevation
      generationtime_ms
      hourly {
        apparent_temperature
        dew_point_2m
        precipitation_probability
        relative_humidity_2m
        temperature_2m
        time
        uv_index
        uv_index_clear_sky
      }
      hourly_units {
        apparent_temperature
        dew_point_2m
        precipitation_probability
        relative_humidity_2m
        temperature_2m
        time
        uv_index
        uv_index_clear_sky
      }
      latitude
      longitude
      timezone
      timezone_abbreviation
      utc_offset_seconds
    }
  }
`;

export default fetchWeatherQuery;

````

Answer 1

问题在于不匹配。我错误地向 getClient 发送了变量。我在下面进行了编辑，现在可以使用了；

const { data } = await client.query({
    query: fetchWeatherQuery,
      variables: {
       daily: "temperature_2m_max",
       current: "temperature_2m",
       hourly: "temperature_2m",
       timezone: "Europe/Moscow",
       latitude: lat,
       longitude: long,
    }, 
  });