How to use apollo client on the server? How to deal with explicit whatwg-fetch require?

[ryancole]

I was reading over #645. The issue is discussing how to appropriately change createNetworkInterface so that it works, out of the box, on node.js. The issue being that the networkInterface.ts file has a hard dependency on the browser-only whatwg-fetch.

Because that file still depends on that module, how have folks been doing server rendering so far? I'm trying to determine the best way to approach this.

We cannot simply include our own fetch implementation, because networkInterface.ts will always depend on whatwg-fetch. Are folks using webpack to resolve this to perhaps node-fetch on their server build? Is there a third party network interface that somebody has provided that uses a universal fetch module, instead?

What are the options? Thanks.

[stubailo]

What's the problem you are experiencing? Does simply also importing node-fetch not work? That's what we do in our SSR example as far as I know.

[ryancole]

Hmm. I think I see why this would work, actually. It looks like whatwg-fetch doesn't do anything if a global fetch already exists. So, importing node-fetch before-hand should fix the fetch is undefined issue with just whatwg-fetch. I hadn't yet provided my own global fetch and was just getting the expected fetch is undefined error. I had assumed though that whatwg-fetch would always fail on node.js, but if a global fetch exists it looks like it just uses that.

I'll try that!

[stubailo]

Yeah I think the polyfill situation is quite confusing, we're thinking of possibly removing all the polyfills for 1.0 and asking people to import the ones they want. On the other hand, it's nice that things "just work" on the client.

[ryancole]

@stubailo It's just a bit unintuitive in node, because you don't typically deal with globals. So seeing a require("whatwg-fetch") doesn't immedietly convey that if a global fetch already exists then that require basically does nothing. In the browser though that is a bit more intuitive.

After realizing this, I think the way it currently is is actually quite nice. The client will work in the browser out of the box, which is likely to cover most people's initial experiences with the apollo client. If we need (or want) to bring our own global fetch, which we will need to in a node environment, then we are currently free to choose any of the available libs that we like. It's the most flexible of both worlds, imo.

An additional note in the docs about how whatwg-fetch works might make this clearer. Perhaps on the server rendering section somewhere.

In my case, I just made an incorrect assumption about how whatwg-fetch worked. If I had just imported my own fetch polyfill without thinking, it'd have worked. shrug

[stubailo]

Yeah, it's a general issue with polyfills - they change something about the environment rather than actually exporting a function that is used.