Блог

Я хотел бы прочитать заголовок ответа с помощью клиента Apollo, но не могу.

Я использую сервер Apollo и клиент Apollo для взаимодействия с GraphQL API, и я хотел бы отправлять заголовки туда и обратно. Я настроил клиент так, чтобы он отправлял заголовок x-client-version, и я настроил сервер так, чтобы иногда он также отвечал с тем же заголовком.

Проблема в том, что когда я пытаюсь прочитать заголовок x-client-version (или любой другой заголовок на самом деле) с помощью Apollo client, я получаю undefined. Ниже я настроил некоторые дополнительные программы на основе примеров, которые я нашел в Интернете, и даже пошаговых руководств YouTube:

 const clientVersionAfterware = new ApolloLink((operation, forward) =>
  forward(operation).map(response => {
    const {
      response: { headers },
    } = operation.getContext();
    console.log(headers);
    if (headers) {
      const token = headers.get("x-client-version");
      console.log(token);
      if (token) {
        localStorage.setItem("clientVersion", token);
      }
    }

    return response;
  }),
);
  

Присоедините его к цепочке ссылок:

     const httpLink = handleErrors.concat(
  clientVersionAfterware.concat(new HttpLink(linkOptions)),
);
const batchHttpLink = handleErrors.concat(
  clientVersionAfterware.concat(
    new BatchHttpLink({ ...linkOptions, batchInterval: 10 }),
  ),
);
  

В конечном счете подключение ссылок в конструкторе ApolloClient:

 new ApolloClient({
    link: split(
      ({ operationName = "" }) => operationName.startsWith("findOrCreate"),
      httpLink,
      batchHttpLink,
    ),
    cache,
    ...opts,
  });
  

Я слышал, что объект headers пуст, но заголовки все еще можно прочитать, но, по моему опыту, это определенно неверно. Я вижу, что сервер действительно возвращает x-client-version заголовок, который я ожидаю прочитать:

Я думал, что, возможно, обновление моих пакетов поможет, но этого не произошло. Версии, которые я использую:

 "apollo-cache-inmemory": "^1.5.1",
"apollo-client": "^2.5.1",
"apollo-link-batch-http": "^1.2.4",
"apollo-link-error": "^1.1.2",
"apollo-link-http": "^1.5.11",
  

Я чего-то не понимаю? Заранее спасибо!

Я понял это.

Оказывается, обновления apollo-client недостаточно. Я обновил следующие пакеты, и теперь объект headers заполнен:

 "apollo-link-batch-http": "^1.2.9",
"apollo-link-error": "^1.1.8",
"apollo-link-http": "^1.5.12",
  

Я уверен, что вам не нужно обновлять apollo-link-error, но двух других должно быть достаточно (особенно apollo-link-http).

Мне не хватало Access-Control-Expose-Headers конечной точки / graphql:

   app.use((req, res, next) => {
    res.append("x-version-backend", `${BUILD_VERSION}`);
    res.append("Access-Control-Expose-Headers", "x-version-backend");
    next();
  });
  

После этого я мог видеть свои заголовки:

 const responseLogger = new ApolloLink((operation, forward) => {
    return forward(operation).map(result => {
      const headers = operation.getContext().response.headers;
      const backendVersion = headers.get("x-version-backend");
      console.info(`x-version-backend:${backendVersion}`);
      return resu<
    });
  });