Hello Helical Team,
I am embedding my Helical Insight into my website using iFrame. The code is as below:
<iframe src=”https://dashboard.myurl.com/hi-ee” />
However, I am getting an error: Unable to load page.
In the console I am seeing the error: Refused to display ‘https://dashboard.myurl.com/’ in a frame because it set ‘X-Frame-Options’ to ‘sameorigin’.
I am using Helical Insight 4.0 GA. Please help to resolve this.
Thank You,
Snow.
Hello Snow,
The X-Frame-Origin issue is something that is being encountered due to the security policy on your redirection server. You might have used different kind of server for redirection like Apache, IIS, NGinx, HAProxy etc. If your referrer policy is strict-origin-cross-origin, it ensures that you cannot use iframe tag, embed tag, object tag tags.
You may want to refer to the following documentation to change the settings of your redirection server.
Thank You,
Helical Insight.
If both servers (where you are embedding) and where your BI is hosted is in the same domain like bi.helicalinsight.com (Helical BI server) and app.helicalinsight.com then settings like X-Frame-Options’ to ‘sameorigin’ might work.
But in case if they are on different domains you will have to use allow-from option along with specifying the BI server link.
Note: syntax might change based on the server you are using (like Apache, IIS, Nginx, HAProxy etc)
The Same Origin Policy (SOP) is the policy browsers implement to prevent vulnerabilities via Cross Site Scripting (XSS). In other words, the browser would not allow any site to make a request to any other site. It would prevent different origins from interacting with each other through such requests, like AJAX. This policy exists because it is too easy to inject a link to a javascript file that is on a different domain. This is a security risk - you really only want code that comes from the site you are on to execute and not just any code that is out there.
The Cross Origin Resource Sharing (CORS) is one of the few techniques for relaxing the SOP. Because SOP is “on” by default, setting CORS at the server-side will allow a request to be sent to the server via an XMLHttpRequest even if the request was sent from a different domain. This becomes useful if your server was intended to serve requests from other domains (e.g. if you are providing an API).
JSON with Padding is just a way to circumvent same-origin policy, when CORS is not an option. This is risky and a bad practice. Avoid using this.
If you want to bypass that restriction when fetching the contents with fetch API or XMLHttpRequest in javascript, you can use a proxy server so that it sets the header Access-Control-Allow-Origin to *.
If you need to enable CORS on the server in case of localhost, you need to have the following on request header.
Access-Control-Allow-Origin: http://localhost:9999
For version 4.1 GA onwards go through this blog also to learn about fixing cross origin issues