appolo-link-rest set header

Question

EDIT: The problem described below is a problem of the api i used... not a problem with apollo.

I am trying to use apollo-link-rest with a api-key set in the header. If I try to use the exact same api endpoint and set the api-key as header in Postman app, it works perfectly fine. But not for apollo-link-rest:

import { AppContainer } from 'react-hot-loader';
import React from 'react';
import ReactDOM from 'react-dom';
import App from './react-components/App';
import PropTypes from 'prop-types';
import { RestLink } from "apollo-link-rest";
import { ApolloClient } from 'apollo-client';
import { InMemoryCache } from 'apollo-cache-inmemory';
import { ApolloProvider } from 'react-apollo';
import 'normalize.css/normalize.css';
import './index.css';

const restLink = new RestLink({
    uri: 'https://a-site.net/api',
    headers: {
        'x-someapikey': '012737465334232522z2z22163r43'
    },
});

const client = new ApolloClient({
  link: restLink,
  cache: new InMemoryCache(),
});

What I am doing wrong?

Thats the Request Header printed in Chrome Devtools:

I get a 401 Error in Browser (Apollo)... But when I use the same endpoint with the same header in Postman app... it works!

Can you inspect the network request in the browser? Is the header actually missing there, or is the request failing for some other reason? — Daniel Rearden, Oct 10 '18 at 18:49
@DanielRearden I added some more informations related to your question. — christian wuensche, Oct 10 '18 at 19:08
Since you're using a customer header, I believe the browser will send a preflight OPTIONS request. Is that the request that's failing? Is your server configured to handle preflight requests? — Daniel Rearden, Oct 10 '18 at 22:10

score 1 · Accepted Answer · answered Oct 16 '18 at 20:12

1

It was a problem with the API... not with Apollo.

answered Oct 16 '18 at 20:12

christian wuensche

963
6
21

score 0 · Answer 2 · answered Oct 13 '18 at 15:48

Can you try this? I kind of based my answer on this: https://www.apollographql.com/docs/link/links/rest.html#context

var myHeaders = new Headers();
myHeaders.append('x-someapikey', '012737465334232522z2z22163r43');

const restLink = new RestLink({
    uri: 'https://a-site.net/api',
    headers: myHeaders
});

appolo-link-rest set header

2 Answers2