cancel
Showing results for 
Search instead for 
Did you mean: 

How to configure X-Frame-Options header for Spartacus?

0 Kudos

Hello experts! Our team is in the process of making our application safe from clickjacking attacks. The Spartacus application gets served by yarn. We want to configure our yarn server to include an X-Frame-Options header in every response it sends so that the page can't be placed in an iframe.

We found a guide for how to configure the header for other servers like Apache and Nginx but not for yarn. We want to add the same configuration for yarn.

You can view the guide we found here:
https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-Frame-Options

How can we set up the configuration for yarn? Or is there another way to include this header in every response from Spartacus to the browser?

Marissa
Advisor
Advisor
0 Kudos

Hi,

We helped you to accept the answer, since there were no updates after 7 days.

You can unaccept it anytime if the answer provided was not helpful enough and you have further questions.

Best Regards,

Marissa

Accepted Solutions (1)

Accepted Solutions (1)

alemasetto
Participant

To add the X-Frame-Options header to responses from a yarn server, you can write a middleware function to add the header to the response object. You need SSR enabled.

server.ts

const express = require('express');
...
const server = express();
server .use(function (req, res, next) {
res.setHeader('X-Frame-Options', 'DENY');
next();
});

Consider also these properties to protect backend APIs):

xss.filter.header.X-Frame-Options
xss.filter.header.Content-Security-Policy

I suggest you to check the compatibility with Smartedit as it opens the frontend in an iframe.

0 Kudos

I tried this and still I don't see the header in responses sent by https://localhost:4200/. For example our html page is sent without this header.

These are the response headers I am seeing when requesting the page:

HTTP/1.1 200 OK

Accept-Ranges: bytes

Access-Control-Allow-Origin: *

Connection: keep-alive

Content-Length: 2368

Content-Type: text/html; charset=UTF-8

Date: Mon, 13 Feb 2023 08:00:48 GMT

ETag: W/"940-N60Mo7hpyJJhHGubN8pei2xwSQA"

Keep-Alive: timeout=5

X-Powered-By: Express



Also, I am still able to open the page in an iframe. Is there maybe a yarn command I need to run to activate the changes from server.ts?

Answers (0)