Случайное вхождение с отсутствием ответа перед полетом разрешает заголовки - PullRequest
Новая
       11

Случайное вхождение с отсутствием ответа перед полетом разрешает заголовки

0 голосов
/ 08 января 2020

У меня довольно случайное появление с этой распространенной ошибкой: 

OPTIONS https://api.cloudfunctions.net/api/graphql 404
Access to fetch at 'https://api.cloudfunctions.net/api/graphql' from origin 'https://website.com' 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.

У меня есть конечная точка graphql с сервером apollo, развернутым в облачных функциях Google и клиентом реакции. В какой-то момент клиент выдаст ошибку в браузере, но если я попытаюсь refre sh или повторно отправлю запрос 2 или 3 раза, он будет работать.

Отправляемые заголовки предварительного запроса: 

:authority: api.cloudfunctions.net
:method: OPTIONS
:path: /api/graphql
:scheme: https
accept: */*
accept-encoding: gzip, deflate, br
accept-language: en-US,en;q=0.9,id;q=0.8,ms;q=0.7
access-control-request-headers: content-type
access-control-request-method: POST
origin: https://website.com
referer: https://website.com/
sec-fetch-mode: cors
sec-fetch-site: cross-site
user-agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/79.0.3945.88 Safari/537.36

Ожидаемый ответ 

access-control-allow-credentials: true
access-control-allow-headers: content-type
access-control-allow-methods: POST,OPTIONS
access-control-allow-origin: https://website.com
alt-svc: quic=":443"; ma=2592000; v="46,43",h3-Q050=":443"; ma=2592000,h3-Q049=":443"; ma=2592000,h3-Q048=":443"; ma=2592000,h3-Q046=":443"; ma=2592000,h3-Q043=":443"; ma=2592000
content-length: 0
content-type: text/html
date: Wed, 08 Jan 2020 00:38:16 GMT
function-execution-id: 84et92k6mvd9
server: Google Frontend
status: 200
vary: Origin, Access-Control-Request-Headers
x-cloud-trace-context: 95d25375171148a66bc629cc41a79d05
x-powered-by: Express

Случайный ошибочный ответ 

alt-svc: quic=":443"; ma=2592000; v="46,43",h3-Q050=":443"; ma=2592000,h3-Q049=":443"; ma=2592000,h3-Q048=":443"; ma=2592000,h3-Q046=":443"; ma=2592000,h3-Q043=":443"; ma=2592000
cache-control: private
content-encoding: gzip
content-length: 140
content-security-policy: default-src 'none'
content-type: text/html; charset=utf-8
date: Wed, 08 Jan 2020 00:38:05 GMT
function-execution-id: 84etgky3im1k
server: Google Frontend
status: 404
x-cloud-trace-context: 77040d2c72304cad0d645480b6814f7f;o=1
x-content-type-options: nosniff
x-powered-by: Express

Рассматривая вышеприведенный ошибочный ответ, можно понять, что в нем отсутствуют заголовки access-control-allow-* по сравнению с успешным, но, опять же, я не уверен, как это произошло.

Вот моя конфигурация cors: 

const corsConfig = {
  origin: ['https://website.com', 'http://localhost:3000'],
  methods: ['POST', 'OPTIONS'],
  credentials: true,
  optionsSuccessStatus: 200,
}

const app = express()
app
  .use(cors(corsConfig))
  .use(...)

...

apolloServer.applyMiddleware({ app, cors: corsConfig })

Основываясь на нескольких предложениях, я попробовал другую настройку, но все же иногда возникает ошибка:

  • установить cors: false в applyMiddleware
  • удалить коры
  • повторить коры, как показано выше
  • добавить app.options('*', cors()) согласно do c говорит

Все и все это происходит как 1 к 10, иногда по первому запросу после того, как пользователь открывает сайт, в другой раз после того, как пользователь некоторое время просматривает сайт.

Ответы [ 2 ]

0 голосов
/ 25 февраля 2020

Я использовал пакет apollo-server-cloud-functions для решения этой проблемы. Просто следуйте инструкциям здесь (https://github.com/apollographql/apollo-server/tree/master/packages/apollo-server-cloud-functions), но вместо использования exports.handler = server.createHandler() поменяйте его для своей собственной функции, например так: 

exports.api = functions.https.onRequest(
  server.createHandler({
    cors: {
      origin: true,
      credentials: true
    }
  })
);

Это решило это для меня!

0 голосов
/ 08 января 2020

Я думаю, что может быть другое промежуточное ПО, которое портит ваши настройки cors.

Вы можете попробовать использовать другой путь для конечной точки graphql и применить cors только к этому пути. 

apolloServer.applyMiddleware({ app, path: '/graphql', cors: corsConfig });

Кроме того, вы можете попробовать промежуточное ПО express cors и отключить cors на сервере apollo

...