Debugging Blockstack React App

Apps
#1

I was trying to debug this app https://docs.blockstack.org/browser/blockstack_storage.html
But the files don’t show up in the sources of chrome developer tools for debugging.

So I created a react app using the command,
npx create-react-app my-app
and added blockstack in it.

But it shows CORS policy error while signing in.
Screenshot%20from%202019-03-02%2017-08-28

How can I fix the CORS error in blockstack.

#2

hey @probiquery.id.blocks! You have to do some modifications on your create react app folder. I actually have a video addressing this issue via my YouTube channel! Hope this helps! If you enjoy the content would love a like and subscribe as well :slight_smile: (shameless plug)

2 Likes
#3

You get this message because, when users authenticate, your DApp at one URL requested a resource (an identity) from another DApp, the Blockstack Browser. A request for a resource outside of the origin (your new website) is called as a cross-origin request (CORs). Getting data in this manner can be risky, so you must configure your website security to allow interactions across origins.

If you work through the Zero-to-Dapp tutorial you’ll encounter a section on how to deploy. That shows how to solve this:

1 Like
#4

I am using craco in order to modify the create-react-app options see https://github.com/pradel/sigle/blob/master/craco.config.js#L6 :slight_smile:

#5

I just published a npm package that contains the config to use Blockstack with create-react-app https://github.com/pradel/craco-blockstack

#6

Want to publish this to our community? Feel free to modify this file and do a PR back to docs:

Your plugin will appear in the docs here:

1 Like