OWASP headers not showing up in the browser, after being set in an express server

Question

I am tring to send a request to a certain API and I keep getting this error ---

Missing OWASP Secure Headers: ["Strict-Transport-Security","X-Content-Type-Options","Content-Security-Policy","Referrer-Policy"] for URL

I have set the response headers in my node/express server and they do console.log as being set on the node server, but when I look at the request in the browser they are not there.

Furthermore, my request to the API was also rejected. The same headers worked with webpack's devServer. I just copied and pasted them over. Does anybody know why I can see them in the browser and why the API I'm hitting says that the headers are not present, I am new to OWASP and configuring CSP (content-security-policy)?

Answer 1

figured it out, a simple ordering issue.

I need to put the app.use() where I set the headers before the app.use() Where I pull in my static files. This solved the issue straight away.

`app.use((req, res, next) => {
    res.append('Access-Control-Allow-Origin', ['*']);
    res.append('X-Content-Type-Options', "nosniff");
    res.append("Strict-Transport-Security", "max-age=31536000; 
    includeSubDomains");
    res.append("Referrer-Policy", "no-referrer");
    res.append("Content-Security-Policy", 
        "default-src * data: blob: 'self' 
        wss: ws: localhost:; 
        script-src https:* 127.0.0.1:* *.spotilocal.com:* 
        'unsafe-inline' 'unsafe-eval' blob: data: 'self'; 
        style-src data: blob: 
        'unsafe-inline' 'self'");
    next();
});`

`app.use('/', express.static('public/dist'))`