1

I have a Next JS app, where admin users create and manage schedules for their businesses. I want to create a robust way for users to be able to embed a public url from the next js admin app in any external website for their businesses that they might have(eg a wordpress landing page), which displays their specific schedule( A next page that can have any functionality) in their respective landing pages.

I have tried to just link any of my next routes in an external html page using

<iframe src="next app route"></iframe>

I would expect to see that page displayed within the iframe( as it would have looked if I had accessed the url in the browser, but within the constraints of the iframe), but the page doesn't display within the iframe, and I get a blank space. But the same iframe works with a simple ".html" page url that I found randomly.

This related thread suggests that CRA is more suited for this. But I don't really understand how. Especially because each user in my next app, will have a different page that needs to be embedded!

Rajarshi Chakraborty
  • 11
  • 2
  • What do you mean by "doesn't work"? Please provide exactly what didn't work. – code Nov 01 '22 at 17:27
  • Hey. I edited the question explaining what I expected to happen, and what "didn't work". – Rajarshi Chakraborty Nov 01 '22 at 17:51
  • 2
    Try opening the browser console (usually `Ctrl/⌘`+`Shift`+`J`) and see if there are any related errors. – code Nov 01 '22 at 17:53
  • I actually did have an error in the console. Was trying to embed an http served webpage, in an https webpage. Which apparently is untrusted, and is not allowed. :). Solved the issue by ensuring that both the webpages (one which will contain the iframe, and the one which will be served within the iframe ) are on the same protocol (http / https). – Rajarshi Chakraborty Nov 01 '22 at 18:11
  • Yes, the issue is solved. – Rajarshi Chakraborty Nov 01 '22 at 18:20

0 Answers0