Unable to pass additional params/state to app store install URL

Solved

Unable to pass additional params/state to app store install URL

optik
Shopify Partner
2 0 0

We have a public app that allows our users to connect Shopify stores to their store(s) on our e-com platform (let's call it OurApp).

  1. Our user can have many stores in OurApp.
  2. Our user can choose to connect any of their stores to a store in Shopify
  3. The authorization enables product and order sync etc

So far, the authorization started with us asking the user for their store name and then passing the OurApp's store id in the oauth state of the permissions grant URL constructed as per the doc. However, we've been requested to change this as per the below:

 

All Applications may only be installed or otherwise initiated directly on or through the Shopify Service. Your app must not request manual entry of the myshopify.com URL or shop's domain during the installation or configuration flow.

The "Shopify Service" entry point, we assume, is https://apps.shopify.com/<ourapp>/install.
Our problem is that we cannot find a documented way of passing any extra information to this entry point, which breaks our existing UX. Obviously, we cannot construct the redirect URL to contain the necessary data, as it is fixed in the app definition. 
One of the solutions would be to make the authorization flow stateful eg. by storing the id of the store to connect in OurApp (eg. in a cookie, session), but that seems far from clean and prone to issues. 
Has anyone found themselves in a similar situation and found a solution? 

Accepted Solution (1)

Liam
Shopify Staff
2846 311 811

This is an accepted solution.

 

Hi Optik,

 

The OAuth process allows you to pass a state parameter (you can see an example of that in our docs), which Shopify returns to you unmodified in the callback. This parameter is typically used for CSRF protection, but it can also be used to pass a short piece of information, such as an identifier for the user's store in OurApp. This approach is straightforward and secure but does require that you initiate the OAuth process from a context where you know which OurApp store is being linked.

 

After the Shopify store owner installs your app, you should redirect them to a configuration page within your app. On this page, you can ask them to log in to OurApp (if they are not already) and select the store they want to sync. 

 

Hope this helps,

 

 

Liam | Developer Advocate @ 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

View solution in original post

Replies 3 (3)

Liam
Shopify Staff
2846 311 811

This is an accepted solution.

 

Hi Optik,

 

The OAuth process allows you to pass a state parameter (you can see an example of that in our docs), which Shopify returns to you unmodified in the callback. This parameter is typically used for CSRF protection, but it can also be used to pass a short piece of information, such as an identifier for the user's store in OurApp. This approach is straightforward and secure but does require that you initiate the OAuth process from a context where you know which OurApp store is being linked.

 

After the Shopify store owner installs your app, you should redirect them to a configuration page within your app. On this page, you can ask them to log in to OurApp (if they are not already) and select the store they want to sync. 

 

Hope this helps,

 

 

Liam | Developer Advocate @ 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

optik
Shopify Partner
2 0 0

Hi Liam,
Thanks for your answer.
We've been doing exactly that ie. pushing our data through oauth with state param, starting from this url:
https://{shop}.myshopify.com/admin/oauth/authorize?client_id={client_id}&scope={scopes}&redirect_uri...

The problem is, you need to get "shop" from the user, which is supposedly a no-no nowadays, so instead of asking the user for a shop name, we direct them to Shopify to select their Shopify store (https://apps.shopify.com/<ourapp>/install) but any params we add to that URL are not passed further down the Oauth flow.

We were hoping that there was some way of passing state (params? cookies? headers?) starting with this URL.

tha_n
Shopify Partner
1 0 0

Hey Optik,
Did you find out how to do this?
I have landed here searching for the solution of same problem, i.e. "How do I pass extra information like store name on which the store owner installs my app(built using shopify remix), email etc., to the redirect url of my platform(built using nextjs), so that I can authenticate using the  store name?