Two apps on same domain share resources when window.open(url, "_blank")

12 views Asked by At

So I have a 2 different apps running on the same domain as follows

  • https://url/widget/widget-id
  • https://url/funnel/funnel-id

When I open the funnel app from the widget app using window.open(https:url/funnel/funnel-id, "_blank", "noreferrer"), it opens in the context of widget app and tries to fetch widget app's assets which in result shows a blank page and fails to load (as funnel app has different assets at different location). Although when I open the url directly it opens up fine. The widget app is built using vite and funnel app using CRA. Not sure if that's the problem. There's also some server-side routing I'm doing using the code below

main.ts

 gateway.setBaseViewsDir(join(__dirname, '..', 'views'));
  gateway.setViewEngine('hbs');

  gateway.useStaticAssets(join(__dirname, '..', 'client', 'funnel'), {
    prefix: '/funnel/',
  });
  gateway.useStaticAssets(join(__dirname, '..', 'client', 'widget'), {
    prefix: '/widget/',
  });
  gateway.useStaticAssets(join(__dirname, '..', 'client', 'dashboard'), {
    prefix: '/dashboard/',
  });

frontend.middleware.ts

   const isFunnel = containsPath(rawHeaders, originalUrl, ['/funnel']);
    const isWidget = containsPath(rawHeaders,originalUrl, ['/widget'])
    const isJobs = containsPath(rawHeaders, originalUrl, ['/jobs']);
    const isBackendEndpoint = containsPath(rawHeaders, originalUrl, [
      '/graphql',
      '/health',
      '/server-health',
    ]);

 if (isBackendEndpoint) {
      next();
    } else if (isDashboard && !isBooking && !isFunnel) {
      res.sendFile(resolvePath('client/dashboard/index.html'));
    } else if (isWidget) {
      res.sendFile(resolvePath('client/widget/index.html'))
    } else if (isBooking || isFunnel) {
      res.sendFile(resolvePath('client/funnel/index.html')
    }

0

There are 0 answers