Embeded app have problem after install non required redirect

Shopify Apps
1

I have an external application hosted on my_app.com, and I want to create a Shopify plugin (embedded app) for it using Remix.
The plugin is very simple — I just need it to interact with Shopify products.

But I’m facing two main problems:

1. After installing the Shopify app

When I click Install, Shopify does not open my plugin inside the Shopify admin sidebar.
Instead, it directly redirects me to my_app.com inside an iframe.

It only shows my plugin after I stop the server and run shopify app dev again, which is not normal.

2. I don’t want Shopify to always redirect to my external app

I want the plugin UI to appear inside Shopify admin, not immediately redirect to my external website.

My Questions

  • How can I prevent Shopify from always redirecting to my external app after installation?

  • After installation, how can I ensure Shopify loads the embedded admin plugin, not my external site?

2

This sounds like the `App URL` in your Partner Dashboard, or the `app_url` in your `shopify.app.toml` config, isn’t correctly set to the tunnel URL provided by `shopify app dev`.

When you run `shopify app dev`, it typically sets up a tunnel (like ngrok or Cloudflare) and updates your app’s configuration in the Partner Dashboard to use that temporary URL. If your app’s `App URL` is explicitly set to `my_app.com`, Shopify will redirect there after installation, expecting your app to handle embedding itself. However, for development, you need it to point to the tunnel.

Here’s what to check:

  1. shopify.app.toml: Make sure your `app_url` in this file is empty or set to a placeholder. The `shopify app dev` command is designed to inject the correct tunnel URL when it starts. If you’ve hardcoded `my_app.com` here, that’s your problem.
  2. Partner Dashboard App Setup: Go to your app settings in the Shopify Partner Dashboard. Under “App setup,” check the “App URL” and “Allowed redirection URLs.”
    * The “App URL” should be the tunnel URL (e.g., `https://your-tunnel-id.ngrok.io`). When `shopify app dev` runs, it usually updates this automatically. If it’s still `my_app.com`, that’s why you’re being redirected there.
    * Ensure your `Allowed redirection URLs` include the full path for your OAuth callback, typically `https://your-tunnel-id.ngrok.io/auth/callback\`.

The reason it works after restarting `shopify app dev` is likely because the command successfully re-establishes the tunnel and, more importantly, updates the `App URL` in the Partner Dashboard to point to the new tunnel endpoint, allowing Shopify to correctly embed it. When it redirects to `my_app.com`, it’s breaking out of the embedded context because that’s what’s configured as the primary app URL.

Essentially, for your app to appear inside the Shopify admin, the initial redirect from Shopify *must* go to the URL that serves your embedded app, which during development is your tunnel. Your app then receives the `host` parameter from Shopify, which tells it to render within the admin iframe. If your app then makes a further client-side redirect to `my_app.com` without preserving that `host` parameter, it will break out of the embedded context. Make sure your Remix app isn’t doing any unnecessary redirects after the initial OAuth callback.

Hope that helps!