Oauth error invalid_request with React and Node

Shopify Partner
10 0 1

Hello,

 

I'm trying to develop an app using React and Node, following the tutorial from docs, exactly as it is in there. Right now, I'm on this step: Authenticate and test your app. When I try to execute the following URL (HTTPS://YOURNGROKADDRESS.io/auth?shop=YOURSHOPIFYSTORE.myshopify.com), replacing the ngrok address and my shopify store, I get 400 Oauth error invalid_request: Could not find Shopify API application with api_key, even if I configured the .env file correctly, with the ngrok running and npm run dev also executed.

You can see some screenshots attached with my code. I really don't know why it's not working, considering that I followed the tutorial step by step. 

 

What do you think?

 

screenshot_1.png

 

screenshot_2.png

 

screenshot_3.png

 

screenshot_4.png

 

screenshot_5.png

 

0 Likes
Highlighted
Shopify Partner
1838 174 615

That's weird. I haven't gone through that tutorial so i cannot comment about its current state or possible errata, but looking through the code how you're initialising your koa server and doing the Shopify koa auth handshake, looks kosher to me. In fact, I am doing much the same and it works fine.

 

kdsLDEa

 

The only difference is you're using Next. Fair enough, shouldn't interfere at this point. Even so, if something doesn't work and I rushed ahead pulling in too many libraries and frameworks because I thought I'll need them or someone wrote I'll need them, I dump them. Literally, get rid of any clutter even dotenv - just hardcode the keys to make sure it's not in the setup. Backtrack from the simplest point you get running then keep adding to it.

 

If you're still stuck in 24 hours, let me know and I'll run through that tutorial quickly to see what's going on.

 

Good luck!

I turn coffee in to code - since 1998
1 Like
Highlighted
Shopify Partner
1838 174 615

Heya, have you managed to sort this out? Let me know - just curious and would gladly help if need be to get more people using Shopify + Node.

I turn coffee in to code - since 1998
0 Likes
Highlighted
Shopify Partner
10 0 1

Hey Karl,

 

Sorry for being late here. Finally, it worked. It was about the .env file. Not being so familiar with Node.js, I create a file named process.env, instead of creating just a .env file. After renaming the file, it worked.

 

Thank you for your time and support. Appreciate it!

0 Likes
Highlighted
Shopify Partner
1838 174 615

Cool! Glad you sorted it out and are back on track. Feel free to ask anytime if you need more pointers regarding Shopify app development using node.js + React / Polaris components.

I turn coffee in to code - since 1998
0 Likes
Highlighted
Shopify Partner
1 0 2

Just in case this helps someone else - I had the same exact problem and had also created a process.env file.

Besides renaming, to ".env", I also encountered:

1.- I had put quotes around the API keys in the file, removed those.

2.- In the URL, make sure the second parameter doesn't have "HTTPS://", it should be like this:

https://98988989.ngrok.io/auth/inline?shop=just_the_name_of_the store.myshopify.com

(replace the bold parts with your values)

2 Likes
Highlighted
Shopify Partner
10 0 1

@KarlOffenberger, appreciate it and will do if I'm gonna encounter issues. 

@David_Fohr, thanks for sharing this. I'm sure it's helpful.

 

Have a great week!

0 Likes
Highlighted
Tourist
9 0 1

Thanks so much for sharing, I also encounter the same problem and figure it out by yours info!

0 Likes
Highlighted
Shopify Partner
35 0 4

I get the same error

my file name is ".env" and no quotes for keys...

0 Likes
Highlighted
Tourist
5 0 1

Thank you. Changing the name worked for me. 

Not sure why they would put in BOLD process.env

Also not sure why they don't just say NAME THE FILE .env

0 Likes