Need Advice: Next.js and iFrames
Unanswered
Alaska pollock posted this in #help-forum
Alaska pollockOP
Hello Everyone,
I have a question about security concerns with Next.js and iFrames, and I would appreciate some feedback.
My application allows users to create components and export them as iFrames. Users can copy the iframe code and paste it into their code, whether it's for their own Next.js project or other platforms like Webflow or Framer.
However, I'm encountering an issue: I can’t get the iframe to display when running my project locally, but it does display when the project is deployed.
Here's the workflow I intend:
A user creates an iframe in my project, for example, from a.com.
The user exports the iframe from the builder using <iframe src="a.com"/>.
The user then integrates this iframe code into their project, say b.com.
The iframe should display both locally and when deployed, showing the created component.
The problem I'm facing is that the iframe displays when the project is deployed, but not when running locally.
Ideally, I don't want my users to have to deal with CORS or other settings to make this work. I want it to be as simple as pasting the code and having it function correctly.
Does anyone have advice on this, or best practices and considerations to keep in mind?
I have a question about security concerns with Next.js and iFrames, and I would appreciate some feedback.
My application allows users to create components and export them as iFrames. Users can copy the iframe code and paste it into their code, whether it's for their own Next.js project or other platforms like Webflow or Framer.
However, I'm encountering an issue: I can’t get the iframe to display when running my project locally, but it does display when the project is deployed.
Here's the workflow I intend:
A user creates an iframe in my project, for example, from a.com.
The user exports the iframe from the builder using <iframe src="a.com"/>.
The user then integrates this iframe code into their project, say b.com.
The iframe should display both locally and when deployed, showing the created component.
The problem I'm facing is that the iframe displays when the project is deployed, but not when running locally.
Ideally, I don't want my users to have to deal with CORS or other settings to make this work. I want it to be as simple as pasting the code and having it function correctly.
Does anyone have advice on this, or best practices and considerations to keep in mind?