denvned/isomorphic-relay

Unmet peer dependency with react-relay@0.7.2

nodkz opened this issue · 5 comments

nodkz commented

About half hour ago was released react-relay@0.7.2
https://github.com/facebook/relay/blob/changelog072/CHANGELOG.md

In package.json fixed version to 0.7.1.
@denvned please fix this.

nodkz commented

Due to changelog:
RelayRenderer now runs queries after mount to make sure RelayRenderer does not run queries during synchronous server-side rendering.

Denis, can you confirm that from this version it is safe to render on server under high load. I follow to you on react-relay and I think that you are in the know.

Right now I use seq-queue like this:

...
import seqqueue from 'seq-queue';

const GRAPHQL_URL = `http://localhost:3000/graphql`;

// Create a queue for isomorphic loading of pages, 
// because the GraphQL network layer is a static
const queue = seqqueue.createQueue(2000);

export default (req, res, next) => {
  try {
    const headers = { ...someOtherVars };
    if (req.cookies && req.cookies.auth_token) {
      headers.Cookie = 'auth_token=' + req.cookies.auth_token;
    }
    match({ routes, location: req.originalUrl }, (error, redirectTo, renderProps) => {
      queue.push(queueTask => {
        Relay.injectNetworkLayer(new Relay.DefaultNetworkLayer(GRAPHQL_URL, { headers }));

        function render({ data: relayData, props }) {
          const data = {
            body: '',
            entry: assets.main.js,
            preloadedData: JSON.stringify(relayData),
          };

          data.body = ReactDOMServer.renderToString(
             <IsomorphicRouter.RouterContext {...props}  />
          );

          const html = ReactDOMServer.renderToStaticMarkup(<Html {...data} />);
          res.send(`<!doctype html>\n${html}`);

          queueTask.done();
        }

        if (error) {
          next(error);
        } else if (redirectLocation) {
          res.redirect(302, redirectTo.pathname + redirectTo.search);
        } else if (renderProps) {
          IsomorphicRouter.prepareData(renderProps).then(render, next);
        } else {
          res.status(404).send('Not Found');
        }
      },
      () => { next(new Error('Timeout on server side page render.')); },
      5000); // 5 second timeout for rendering an isomorphic page
    });
  } catch (error) {
    next(error);
  }
};

But I want remove queue. Can I do it with 0.7.2?

denvned commented

Can I do it with 0.7.2?

Unfortunately no, see my answer here.

nodkz commented

I wish a lot of strength and energy to you with making all Relay state contextual.
Your work is awesome!

Thanks a lot!

thelordoftheboards commented

@denvned keep up the good work the isomorphic relay is awesome!

@nodkz I am noticing that your network layer you inject does not contain any request-specific information, like a User ID read from cookies, etc.I am reading this:

Relay.injectNetworkLayer(new Relay.DefaultNetworkLayer(GRAPHQL_URL))

In this case maybe you can just initialize it outside of the request, and re-use for all requests and not have a queue? Or am I missing something?

nodkz commented

@thelordoftheboards Yep, you are right. My file is much bigger and for showing queue I removed headers 🤦
For future generations and seo engines I modify my comment above (add { headers }).

Without queue and different headers for networkLayer I cannot obtain user id on a graphQL side.

But after your comment I catch good though:

  • check UserAget for bot substring and do server rendering with default access
  • for regular users don't use server-side-rendering