I’ve been trying to test Blockstack’s authentication with the NextJS React Framework but running into issues.
First was the appConfig having issues due to: ReferenceError: window is not defined. I ended up manually setting the AppDomain argument.
Now I’m getting: Error:
redirectToSignInWithAuthRequest uses the
*window*.navigator API which is not available in the current environment.
It seems there is something that NextJS does to ‘window’ that is not making it play friendly with blockstack.
Has anyone come across the same issue or used/using NextJS with Blockstack? Would love to know what the workaround or setting might be to resolve this.
Btw, NextJS setup tutorial as reference if anyone has time to test it: https://nextjs.org/learn/basics/getting-started
Thanks in advance!
So next.js is a framework that allows react to be server side rendered (ssr), and through that, many of the components and things you’re building will first get run on the server (a node environment). the global
There can be a lot of things that just don’t work on the server, one of them being anything that references
document objects. You can break out the stuff that does reference those into another component, and then use a dynamic import with an option passed to not have it run on the server. see this part of the readme -> https://github.com/zeit/next.js#dynamic-import
You can also view the source code for Banter, an app built with next.js and blockstack. https://github.com/blockstack-radiks/banter
Hope this helps!
I am working on opencollective to get blockstack auth done. They use next.js as well.
You don’t need a window object if you specify the appdomain and the redirectAuthToken.
Currently, I have a problem with the session storage.
Hope it works out! I’ve since gone with Create React App after following TechRally’s tutorial series on YouTube.
The opencollective integration is working now! Please see issue github.com/opencollective/opencollective/issues/1749