Nginx + Отказ в соединении с GraphQL - PullRequest
Новая
       63

Nginx + Отказ в соединении с GraphQL

1 голос
/ 29 мая 2020

  1. Приложение My Client (next. js), работающее на порту 3000

  2. Приложение My Server (graphql), работающее на порту 4000

Мой веб-сайт https://example.com, nginx будет передавать прокси-порт 3000.

Если пользователь обращается к сайту, страница загружается успешно.

Но за кулисами, на моей веб-странице некоторые запросы api отправляются на сервер graphql. (http://localhost:4000)

Этот запрос api не выполнен.

Я не знаю почему, но когда я получаю доступ к http://example.com:4000/graphql, площадка graphql (graphiql?) Загружается успешно и я могу отправить запрос, и результат хорошо зарекомендовал себя. Но запрос с веб-страницы не выполнен.

nginx / sites-enabled / example.com 

server {
        listen 80;
        listen [::]:80;
        server_name www.example.com example.com;
        return 301 https://example.com$request_uri;
}


server {
    listen 80;
    listen [::]:80;
    server_name example.com;


    location / {
        proxy_pass http://localhost:3000;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
    }

    listen [::]:443 ssl ipv6only=on; # managed by Certbot
    listen 443 ssl; # managed by Certbot
    ssl_certificate /etc/letsencrypt/live/example.com/fullchain.pem; # managed by Certbot
    ssl_certificate_key /etc/letsencrypt/live/example.com/privkey.pem; # managed by Certbot
    include /etc/letsencrypt/options-ssl-nginx.conf; # managed by Certbot
    ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem; # managed by Certbot

}

графическая часть клиентского приложения 

export default function createApolloClient(initialState, ctx) {
  return new ApolloClient({
    ssrMode: Boolean(ctx),
    link: authLink.concat(new HttpLink({
      uri: 'http://localhost:4000/graphql', // Server URL (must be absolute)
      credentials: 'same-origin', // Additional fetch() options like `credentials` or `headers`
      fetch,
    })),
    cache: new InMemoryCache({ fragmentMatcher }).restore(initialState),
    credentials: 'include',
  })
}

** То, что я пробовал ... **

Я добавил ниже фрагменты в nginx conf (выше часть listen [::] 443) и перезапустил службу nginx, но ничего не изменилось. 

   location /graphql {
        proxy_pass http://localhost:4000/graphql;
   }

Кажется, я что-то пропустил в nginx конф. Как исправить?

1 Ответ

1 голос
/ 30 мая 2020

Я решил, как показано ниже.

createApolloClient 

... createApolloClient(initialState, ctx) {
  return new ApolloClient({
    ...
    link: createHttpLink({ uri: '/graphql' })

nginx

  location /graphql {
        proxy_pass http://localhost:4000/graphql;
   }
...