App Bridge (React) - Disabled embed for a single page

Retired Boards Appdev Tools
1

Hi guys,

I have a question about embedded apps. Using App Bridge embeds my pages “/index” “/otherPage” into the Shopify iFrame. However, I’m trying to create a pop-up window (say at “/popup”) within my app that isn’t embedded within the Shopify interface. To do this I’m using standard Javascript:

window.open("/popup")

I’m using App-Bridge-React to wrap my Nextjs/React app with the tag in “_app.js”:

const config = {
    apiKey: API_KEY,
    shopOrigin: getCookie("shopOrigin"),
    forceRedirect: false
};

<Provider config={config}>
    <AppProvider i18n={translations}>
        <Component {...pageProps} />
    </AppProvider>
</Provider>

Every page in my app opens within the Shopify interface. Obviously, when I open a popup windows from the App pointing to “domain.com/popup” it still automatically re-renders the page within Shopify because page is also wrapped in the Provider.

Can I selectively turn this feature off for this specific page? Is there a potential work-around people have used?

Thank you!

David

2

Hey @david-massive ,

I can confirm it’s not possible to selectively change the forceRedirect setting on a per page basis. I’m not aware of any workarounds but I’ll let others comment if they’ve know of one.