Is it possible to render a fullstack application inside iframe?

Question

it might sound crzay but I want to do that. I'm trying to render a payloadcms admin dashboard, running on another application, in my next.js application.

The following is my page on next.js application:

export default function Page() {
  return(
    <main>
      <iframe className="w-full h-screen" src="https://mypayloadcmsapp.com/admin"></iframe>
    </main>
  )
}

The page renders the admin login page of the payloadcms application, but when I click login with appropriate credentials the iframe doesn't forward to the dashboard. Where am I doing it wrong?

I want to login to my payloadcms application using my next.js application running on different host.You may ask why don't I just forward the next.js page to the payloadcms application, the reason is that redirecting will also change the url but I don't want that.

Answer 1

An application can be block from running in an iframe via several different methods including HTTP headers and JavaScript. If a third party want's to stop you iframing their content, then your options are to either accept this, or reach out to them and offer them enough money for them the change their mind.