when i try to open this page, it showing this login error and some time redirect to last open page, after login it shows this error accounts.shopify.com refused to connect.
Seeing accounts.shopify.com refused to connect usually means the embedded app can’t be rendered in the admin because the OAuth process hasn’t completed or the domain is not authorized. Here are some things to check:
Make sure you are passing the shop parameter when navigating to your app. In embedded apps built with the Remix template the /?shop=your-store.myshopify.com query string is used to bootstrap the OAuth flow. If shop is null in your logs it means the parameter is missing.
Check your .env configuration – SHOPIFY_APP_URL (or APP_URL) must match the HTTPS URL where the app is running (for local development this is usually an ngrok tunnel). If the URL stored in the app settings on your Partner dashboard does not match, Shopify will refuse to frame it.
Confirm that third party cookies are enabled in your browser. The Admin relies on cookies to authenticate embedded apps; if they are blocked, the iframe will show a “refused to connect” message. You can also test using Chrome Incognito with third‟party cookies allowed.
Upgrade your Shopify remix template and dependencies (@shopify/shopify-app-remix, @shopify/app-bridge) to the latest versions. There was a recent change to the Shopify Admin domain (accounts.shopify.com) and older versions of App Bridge needed patching.
In your Remix loader logic, ensure you redirect to /auth when the session is missing rather than rendering the app. The Shopify example templates show how to validate the shop session and re‑initiate OAuth.
Finally, double‑check that the app is installed on the store you’re testing against. If you created a second store, you need to install the app there via the Partners dashboard.
Applying these steps should resolve the “shop null” issue and let your embedded app load correctly.
If shop is missing, Shopify can’t authenticate the request and shop becomes null.
App bridge and session handling
In Remix apps, ensure you have the correct <ShopifyAppBridgeProvider> setup and that the app is loading inside the Shopify admin (embedded).
If the app tries to open outside the embedded context, it may trigger a redirect loop or the “refused to connect” iframe error.
Environment variables
Double-check that your .env file has the correct values for:
Even a small typo or missing URL scheme (https://) can break authentication.
Auth callback route
Make sure your callback route (/auth/callback) matches exactly in both:
Shopify Partners dashboard (App setup)
Your Remix app route structure.
Compare with your working demo app
Since your demo app works, compare these files:
shopify.server.ts
.env values
server.js or index.js where you handle shopifyApp({ ... })
A missing or incorrect config there usually causes shop: null.
In short:
The problem happens because Shopify can’t identify the store (shop = null).
Fix the redirect URL or ensure the app always starts with the ?shop=store.myshopify.com parameter, and confirm your .env + callback URLs match.