Я получаю ошибку Newwork: не удалось получить каждый раз в клиенте apollo - PullRequest
0 голосов
/ 09 июля 2020

Вот мой файл js App. Я запускаю свой запрос здесь. Я использую клиент apollo вместо apollo-boost.

import React, { useEffect } from "react";
import { useQuery } from "react-apollo";
import gql from "graphql-tag";
    
const MY_QUERY = gql`
  query {
    getAllSalons {
      id
      displayName
      email
    }
  }
`;
        
const App = (props) => {
  const { data, loading, error } = useQuery(MY_QUERY);
  useEffect(() => console.log("-------", data), [data]);
  useEffect(() => console.log("-------", error), [error]);
  return (
    <div className="App">
      <h1>KOMB COLLECTION</h1>
      {loading ? <h2>Loading...</h2> : <h2>Data :)</h2>}
    </div>
  );
}

Вот как я настроил клиент apollo в index. js файл Я настроил аутентификацию в своем клиенте apollo.

Вот весь импорт

import ApolloClient from "apollo-client";
import { ApolloProvider } from "react-apollo";
import { createHttpLink } from "apollo-link-http";
import { setContext } from "apollo-link-context";
import { InMemoryCache } from "apollo-cache-inmemory";

Мне не удалось получить ошибку только с этой конечной точкой, но она отлично работает в Postman, а другая конечная точка хорошо работает с этот код.

const httpLink = createHttpLink({
  uri: "http://13.125.142.93:3001/graphql",
});

const authLink = setContext((_, { headers }) => {
  const token = localStorage.getItem("token");
  return {
    headers: {
      ...headers,
      Authorization: token ? token : "",
    },
  };
});
const client = new ApolloClient({
  link: authLink.concat(httpLink),
  cache: new InMemoryCache(),
});

ReactDOM.render(
  <ApolloProvider client={client}>
    <App />
  </ApolloProvider>,
  document.getElementById("root")
);

Я новичок в graphql и не знаю, как справиться с этой ошибкой. Кроме того, мне не удалось найти никакой документации по этому поводу.

Я получаю эту ошибку на своей консоли

Access to fetch at 'http://13.125.142.93:3001/graphql' from origin
'http://localhost:3000' has been blocked by CORS policy: Response to
preflight request doesn't pass access control check: No
'Access-Control-Allow-Origin' header is present on the requested
resource. If an opaque response serves your needs, set the request's
mode to 'no-cors' to fetch the resource with CORS disabled.
...