The app couldn’t be loaded

[tayyab910629]

Issue summary

I am using rails 7, whenever i install then app i get this The app couldn’t be loaded , "This app can’t load due to an issue with browser cookies. Try enabling cookies in your browser, [switching to another browser]or contacting the developer to get support."

I am using Windows, but tried Ubuntu as well with the same error , Please let know if anyone have the solution

[TimFletcher]

We're on Rails 7 with the latest version of shopify_app. We also get this message on installation but a) only in development and b) the app actually installed just fine and can be used without issue. No issues in production.

[tayyab910629]

@TimFletcher Thank you for the response, i tried to upload to Heroku and got the same error, one thing is strange that i am able to install this from Brave browser even if its a develpment mode, I can install in brave browser only, all other browsers giving me the above error.

[adtm]

Having the same with Safari 17.0, Chrome, Firefox, Brave on new apps in development on my Mac. I was basically just following the official documentation: https://shopify.dev/docs/apps/getting-started/create

Update: after deleting stores, creating new ones with test data and creating new apps, managed to install properly in dev.

[nelsonwittwer]

👋 Can you provide the version of the gem / api gem you are using? Have you converted to using app bridge on your frontend or is this cookie based auth? We are aware of this type of error showing up with cookie based auth that doesn't use app bridge as browsers are starting to fail on 3rd party cookies. We introduced app bridge with embedded apps to help prepare for the lack of continued support for 3rd party cookies which is what I suspect this is related to.

[tayyab910629]

I attempted several versions. Initially, I used the latest version, 21.7.0, with Rails 7, but it didn't work. I then tried it with version 6.1 and encountered the same issue. Eventually, I resolved the problem by using version 18 of the 'shopify_app' gem in conjunction with Rails 6.1, which proved successful. Also, I am indeed utilizing App Bridge.

[TimFletcher]

Our app started life in Jan 2023 using app bridge.

These were the deps back then:

# Ruby
shopify_app 21.3.1
rails 7.0.4

# JS
"@shopify/app": "3.21.0",
"@shopify/app-bridge": "^3.4.3",
"@shopify/app-bridge-react": "^3.4.3",

And today:

# Ruby
shopify_app 21.6.0
rails 7.0.4

# JS
"@shopify/app": "3.49.5"
"@shopify/app-bridge": "^3.7.9"
"@shopify/app-bridge-react": "^3.7.9"

IIRC this The app couldn’t be loaded issues has persisted through a couple of intermediate version upgrades too.

[nelsonwittwer]

Thanks for the context! Do you have any other tips on how to reproduce the error? That'll be the next step in zeroing in on the problem and providing a fix. I'll try and reproduce the issue with a fresh app install using our ruby app template to see if I see anything, but if you have any other steps to reproduce the issue that'll be key in finding a fix.

[TimFletcher]

Because a) it doesn't seem particularly widespread and b) it's only locally I feel it's something to do with my setup. Perhaps related to puma-dev or ngrok. Our app is hosted on / route-constrained using 4 different domains. These are hosted locally with https via puma-dev, one of these domains is for the shopify app.

The local Shopify app is running on http://s.kutoku.test:9280 / https://s.kutoku.test:9283 but I'm only able to get Ngrok to proxy through to the http protocol. Spent a lot of time trying to get it to go to https. :) I may try the Cloudflare tunnel to see if I can consistently use https from Ngrok => local.

When I see the error there's a query param: oauth_error=same_site_cookies.

I can share my config/initializers/shopify_app.rb — or any other code / logs — if that helps.

[tayyab910629]

Thanks for the context! Do you have any other tips on how to reproduce the error? That'll be the next step in zeroing in on the problem and providing a fix. I'll try and reproduce the issue with a fresh app install using our ruby app template to see if I see anything, but if you have any other steps to reproduce the issue that'll be key in finding a fix.

YEs please do, or i can try to make a video, I tired last night with the same error, i am using ngrok and i can only install in Brave browser, other than that all browsers gives me same cookies error.

[ziaulrehman40]

Following, same issue on a fresh install on newly created app(with old codebase which is upgraded and tested on another store with another app distro, working fine there).

And yes, app is there in the list, but when i open it i get a weird errors:

Access to XMLHttpRequest at 'https://SHOP.myshopify.com/admin/oauth/authorize?client_id=xxx&scope=xxxxxxxxx' (redirected from 'https://MY_APP_URL/api/v1/suppliers?shop=SHOP.myshopify.com') 
from origin 'https://MY_APP_URL' has been blocked by CORS policy: 
Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

UPDATE: If i even manually click on the link which is blocked, i am shown the same error as of this issues's subject App couldn't be loaded...

SOLVED: Had mism-atching keys,

thanks stranger: #1697 (comment)

[nelsonwittwer]

Using the latest version of the version of the ruby app template that uses rails 7, I wasn't able to reproduce this issue. I'd recommend looking at the code base and validating your apps follow similar patterns and you have the correct API keys/secrets.

I'm going to close this issue, though if you have concrete steps to reproduce the issue feel free to re-open.

[TimFletcher]

I updated our app to Rails 7.1.1 (without any changes from the Rails 7 ruby app template) and this issue does, at least for me, seem resolved.

[skillmatic-co]

This bug is happening for me with:

Rails 6.1.7
Ruby 2.7.1
shopify_app 18.1.2
shopify_api 9.4.1

Keys are accurate, I can get past the error occasionally. Seems like some sort of intermittent issue. Basically if I get to the screen in the OP's screenshot, I hit the 3 dots next to my app name and click "Open App" and then it will indeed open.