0

I'm a new to web development, I recently finished my degree and started working for a company as a web developer. I work alone on this project, and I have encountered myself against a problem that I don't think I'm able to solve (If it has a solution at all). It's complicated to explain it but I'll try my best.

I am at the moment, building a portal website where users will be able to access the solutions we offer. To do so I've created the website portal.name.solutions, in this portal multiple web apps will be accessible. The approach taken to achieve it is using iFrames (from what I've read web components are better but also more difficult so maybe will try that on the future) most of the web apps are implemented through an iFrame with no problem. I just want to iFrame an URL and obtain full functionality, not adding JS nor anything.

This solutions that we are trying to iFrame to are self-hosted.

Problem comes for application.name.solutions which is build using ASP.NET. I couldn't iFrame it, therefore I added the next header:

Content-Security-Policy: frame-ancestos 'self' *.name.solutions:*

This would allow me to iFrame the solution. Problem comes when a pop-up window appears on the ASP.NET. Apparently this application implements a lot of its functionality with iFrames.

Popup windows included, this windows apparently are running in another port. The path for the popup is like this: application.name.solutions/path/popupdialogs/specificDialog.aspx. I can close this popup windows pressing the X, but this popups normally have two buttons that execute javascript to save information or close the window and return to the parent iframe. When I try to use any of this buttons it throws an error and does nothing.

I haven't been able to debug this, I'll add the errors that it is throwing, this vary in google chrome and Firefox and depending if the console is open or closed.

  • Google Chrome with console closed:

Uncaught SecurityError: Blocked a frame with origin "https://aplication.name.solutions" from accessing a frame with origin "https://portal.name.solutions". Protocols, domains, and ports must match.

  • Google Chrome with console open:
Uncaught DOMException: Blocked a frame with origin "https://aplication.name.solutions" from accessing a cross-origin frame. 
at HTMLAnchorElement.onclick (https://aplication.name.solutions/path/path/popupdialogs/InformationDialog.aspx:218:145)
onclick @ InformationDialog.aspx:218
  • Firefox:
Uncaught DOMException: Permission denied to access property "hidePopWin" on cross-origin object 
onclick https://aplication.name.solutions/path/path/popupdialogs/InformationDialog.aspx:1

As all error codes say I assumed this could be a CORS problem and added the next header to portal.name.solutions:

Access-Control-Allow-Origin: *

And it still wont allow me to use the popup buttons. I don't know what to do from here if there is any more information that I can provide to get a solution please let me know.

JorgeGB
  • 1
  • 1
  • I fear that you have found a flaw in the code of the pop-up window. The question has to be why is it trying to access the portal.name.solutions window since it can't know anything about it? At a guess, I'd say it's accessing it as `window.top` rather than `window.parent` which would be the main window of application.name.solutions:xxxx. This isn't really about CORS, which is for resource sharing, but about script access, and it just [isn't allowed at all](https://stackoverflow.com/questions/25098021). You're not going to be able to fix this from the portal code. – Alohci Feb 24 '21 at 02:11
  • @Alohci Thank you very much for your comment, as you said it is indeed accessing it as window.top. I assume that this is what is creating the problem in the first place. I just read about the difference between this two. If I were to change all window.top with window.parent then it wouldn't originate this errors (I assume) since it would be trying to access a website within the same domain (?) – JorgeGB Feb 24 '21 at 09:26

0 Answers0