使用NextJs使用react-apollo进行服务器端渲染

Question

我面临一个特殊的问题。请先检查我的代码。

const token = (typeof window !== 'undefined' ? (`Bearer ${window.localStorage.getItem('userAuthToken')}`) : '');

const httpLink = createHttpLink({
        uri: publicRuntimeConfig.GRAPHQL_ENDPOINT,
    });

const authLink = setContext((_, { headers }) => {
    // get the authentication token from local storage if it exists
    const token = window.localStorage.getItem('userAuthToken');
    // return the headers to the context so httpLink can read them
    return {
        headers: {
            ...headers,
            Authorization: token ? `Bearer ${token}` : '',
        },
    };
});

const client = new ApolloClient({
        link: ApolloLink.from([
            onError(({ graphQLErrors, networkError }) => {
                if (graphQLErrors) {
                    graphQLErrors.forEach(({ message, locations, path }) => console.log(`[GraphQL error]: Message: ${message}, Location: ${locations}, Path: ${path}`));
                }
                if (networkError) {
                    notify('Please check your network connection!', 'error');
                    console.log(`[Network error]: ${networkError}`);
                };
            }),
            // authLink.concat(httpLink),
            new HttpLink({
                headers: {
                    Authorization: token ? `Bearer ${token}` : '',
                },
                uri: publicRuntimeConfig.GRAPHQL_ENDPOINT,
            }),
        ]),
        cache,
    });

当我以以下方式添加标头时，服务器端呈现工作正常。

new HttpLink({
    headers: {
        Authorization: token ? `Bearer ${token}` : '',
    },
    uri: publicRuntimeConfig.GRAPHQL_ENDPOINT,
})

但是当我以这种方式添加标头部分时，服务器端渲染无法正常工作。 authLink.concat(httpLink),

有人可以帮我吗？