rzane/index.html

## index.html
<html>
  <head>
    <title>Apollo Query Reproduction</title>
    <meta charset="UTF-8" />
  </head>

  <body>
    <div id="app">
      <h1>These are the headers that get sent along:</h1>
    </div>

    <pre id="headers">
    </pre>

    <script src="index.js"></script>
  </body>
</html>

## index.js
import ApolloClient from "apollo-boost";
import gql from "graphql-tag";

/**
 * Stub out fetch so we can see the problems.
 */
const originalFetch = global.fetch;
global.fetch = (url, opts) => {
  console.log('The request was sent with the following options:', opts);

  const element = document.getElementById("headers");
  element.innerHTML = JSON.stringify(opts.headers, null, 2);

  return originalFetch(url, opts);
};

/**
 * Build a client with a custom header.
*/
const client = new ApolloClient({
  uri: "/graphql",
  fetchOptions: {
    headers: {
      "x-foobar": "12345678"
    }
  }
});

/**
 * Run a query
 */
const query = gql`
  {
    hello {
      id
    }
  }
`;

client.query({ query });

## package.json
{
  "scripts": {
    "start": "parcel index.html --open"
  },
  "dependencies": {
    "apollo-boost": "0.1.1",
    "graphql": "^0.12.3",
    "graphql-tag": "2.8.0"
  },
  "devDependencies": {
    "parcel-bundler": "^1.6.1"
  }
}
	<html>
	<head>
	<title>Apollo Query Reproduction</title>
	<meta charset="UTF-8" />
	</head>

	<body>
	<div id="app">
	<h1>These are the headers that get sent along:</h1>
	</div>

	<pre id="headers">
	</pre>

	<script src="index.js"></script>
	</body>
	</html>
	import ApolloClient from "apollo-boost";
	import gql from "graphql-tag";

	/**
	* Stub out fetch so we can see the problems.
	*/
	const originalFetch = global.fetch;
	global.fetch = (url, opts) => {
	console.log('The request was sent with the following options:', opts);

	const element = document.getElementById("headers");
	element.innerHTML = JSON.stringify(opts.headers, null, 2);

	return originalFetch(url, opts);
	};

	/**
	* Build a client with a custom header.
	*/
	const client = new ApolloClient({
	uri: "/graphql",
	fetchOptions: {
	headers: {
	"x-foobar": "12345678"
	}
	}
	});

	/**
	* Run a query
	*/
	const query = gql`
	{
	hello {
	id
	}
	}
	`;

	client.query({ query });
	{
	"scripts": {
	"start": "parcel index.html --open"
	},
	"dependencies": {
	"apollo-boost": "0.1.1",
	"graphql": "^0.12.3",
	"graphql-tag": "2.8.0"
	},
	"devDependencies": {
	"parcel-bundler": "^1.6.1"
	}
	}