Disable X-FRAME-OPTIONS in SCP Portal Cloud Foundry

[vbalko-claimate]

Motivation and problem

During project for customer I developed the standalone Fiori application. Because that project is hosted on SAP SCP multi cloud - in other words on Cloud Foundry platform - I wrapped that Fiori application to multi target application (MTA) as a HTML5 module and added approuter so I can access that application from html repository.

Next step was to add that application to a portal service (also on that same subaccout). I managed to do this pretty easily, but when I launched that app from its tile - nothing happend. Or more accurately - application launched but there was only message that webpage refused connection.

If you would open developer tools on chrome (right click and then Inspect], you will see red message

that the link was refused to display because there is X-Frame-Options set to SAMEORIGIN.

You can find more on that option here but in short - it is security directive in http header, which prevents ClickJacking attack. This is done in a way, that page prevents to be included itself in iFrame of other page.

But in case of portal - this is exactly what we want to do. Portal page opens our application in iFrame. And because application dont want to be included - we see that error.

Options we have

In order to resolve this we have 2 options 4 options:

1. In portal, you can set, that application will open in new tab instead of inside of portal page


2. 
   
   convince app router application to not include that security option into http header. This can be done in SCP cockpit. You need to go to your subaccount and space where you have your application deployed. On the left side in menu Applications find you app router. Click on its name  and this will get you to its configuration. There you have User-Provided Variables. There you have to add new variable named SEND_XFRAMEOPTIONS.


3. Set iframDomains parameter of tenant.


4. Set whitelist of secure domains in approuter config xs-app.json

In fact - only option 1 and 2 worked for me. I tried also options 3 and 4 but it doesn`t worked. I suppose that I done something wrong or forgot some setting, but both previous (1 and 2) options worked so I didn`t done any further research. Maybe in a future to sharpen my skill.

Solution

Option 1 - open page in new tab

In fact - this is the easiest and quickiest solution and works smoothly. This option works, because when you open that page in a new tab (outside of portal site) it is not in iFrame. It needs not to be, because it shows itself outside of portal. But it has also some drawbacks.

You actively navigate user out of your portal site, so this can be a little bit confusing for the user and also navigating is not that comfortable. It is also possible that user will forget to close that tab etc...

Setting for this option is really easy - just set Open in a new tab option in application attributes.

Option 2 - approuter env variable SEND_XFRAMEOPTIONS

This option is little bit complicated to set, but ensures, that page will be shown inside our portal site. When you set that env variable in an approuters config, the approuter won`t set that security directive (X-FRAME-OPTIONS) in an applications http header when served and therefore application will let itself be included in the iframe. I can imagine, that it can be a little bit higher security risk when the directive will be left off, but on the other hand - there are other security measures (e.g. you have to be authorized and authentified to access portal site and application itself). It is good to know that this directive will influence all the applications server by that particular app router. So if you want to serve two applications - one to be included in iframe and one not - it is best to serve them by two app routers.

So how to set that up?

In your space, in the Application page open configuration of your app router. On the tab for User-Provided Variables click Add Variable and fill the name and value

SEND_XFRAMEOPTIONS = false

Note: There is value TRUE on a picture, but the right value is false. I grab that picture when I was trying different options how to work that out.

After that you have to restart the app router application so the new variable will take effect. You can do that on Overview page in the left menu.

Then go to the portal, reload page and you should see the application up and running. Sometimes it is necessary also reload whole portal site.

Options 3 and 4

As I wrote that before - I found that options, tried that, but that didn`t work. But I mention it here, because it is probably just me and if that options exists - it is probable, that they works. So if you will manage them to work, please let me know in comments.

Option 3 is in fact substitution for deprecated http header directive X-FRAME-ALLOW. It is describe on a help page for Conversational AI but the functionality is same for the whole cloud foundry. Also this note for C4C can help.

Option 4 is described in SAP Help page for SCP Portal . I set that whitelist service and also added env variable CJ_PROTECT_WHITELIST for domain *.hana.ondemand.com, but that did not help.

So finally...

Finally I resolved my problem and that fiori application is able to show inside portal site. In a process I also learned a lot about app router, xsuaa and their configuration.

It would be also great if somebody knows how to implement option 3 and 4 and so much more cool if he or she will share that with us :).

 

Disclaimer: all pictures used in that blog I took by myself and I apologize to have them in czech language.

Note: This blog post was first posted on my personal blog. Here you can find original version: Disable X-FRAME-OPTIONS in SCP Portal Cloud Foundry.