Questions and discussions about using the Shopify CLI and Shopify-built libraries.
I followed the Shopify App Node and React tutorial and made an embedded app. Now every time I switch pages on the top navigation bar I get the error "Expected a valid shop query parameter".
I'm not sure what's causing this and how to fix it. I would appreciate any help!
Thanks!
Hey @ReachMoreOnline,
Have a look at this forum post addressing a related question and error. I believe this should help resolve the issue.
awwdam | API Support @ Shopify
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
- To learn more visit Shopify.dev or the Shopify Web Design and Development Blog
Hey @awwdam,
Thanks for your reply! This issue has been bugging me for some time. I already do that the other post suggests. I currently do pass the "shop" query param in the URL and redirect using:
ctx.redirect(`/?shop=${shop}`);
^ This is in my server.js.
Hence, it is able to load the app and actually load my _app.js. Whatever is in my index.js page actually shows up on the page. However, if I click a tab in the embedded app navigation bar, I get the error "Expected a valid shop query parameter".
Also, how should we be storing shopOrigin? Is it okay to store it in cookies in server.js like:
ctx.cookies.set('shopOrigin', shop, {
httpOnly: false,
secure: true,
sameSite: 'none'
});
? And then getting the cookies in the frontend?
Have you solved this?
I am facing the same issue.
It's probably either a bug or bad documentation.
I found a lot of similar questions on github, stackoverflow and this community.
I discovered that I am getting the error
"Expected a valid shop query parameter"
after I add a link to navigation with "../index" at the end
Then I added the link ".../" as an index link and navigation is working now.
But this index link is always active now.
Hey @ReachMoreOnline,
Thanks for getting back with more info. I did a bit of digging and found this related GitHub issue. A post in this thread suggests this message might be related to the tutorial steps for adding a 'ClientRouter' to your app. Have you completed that section of the tutorial already? There are some other resources that offer additional insights on shopOrigin, consider taking a look through this getting and storing the shop origin guide, as well as the following tutorial on session tokens for embedded apps.
awwdam | API Support @ Shopify
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
- To learn more visit Shopify.dev or the Shopify Web Design and Development Blog