I'm struggling with serving a build created with "create-react-app" using Express with Helmet. I'm getting several errors in the explorer console related to Content Security Policy:
Of course, it isn't showing the app. I noticed that if a remove Helmet as middleware in Express it works but that's not the solution I want. This is my server code:
const express = require('express');
const helmet = require('helmet');
const cors = require('cors');
const morgan = require('morgan');
const bodyParser = require('body-parser');
/**
* Server Configuration
*/
const whitelist = [];
const app = express();
// Express Configurations
// Enable reverse proxy support in Express. This causes the the "X-Forwarded-Proto" header field to be trusted so its
// value can be used to determine the protocol. See // http://expressjs.com/api#app-settings for more details.
app.enable('trust proxy');
app.use(morgan('dev')); // Log every request to the console
app.use(helmet()); // Configure secure Headers
app.use(bodyParser.urlencoded({ extended: false })); // Enable parsing of http request body
app.use(bodyParser.json());
// CORS Configuration
const corsOptions = {
origin: (origin, callback) => {
if (whitelist.indexOf(origin) !== -1 || !origin) {
callback(null, true);
} else {
callback(new Error('Not allowed by CORS'));
}
},
};
app.use(cors(corsOptions)); // Allow CORS
/**
* Launcher method
*/
app.start = () => {
// start node server
const port = process.env.PORT || 3000;
app.listen(port, () => {
console.log(`App UI available http://localhost:${port}`);
console.log(
`Swagger UI available http://localhost:${port}/swagger/api-docs`,
);
});
};
/**
* App Initialization
*/
function initializeApp(readyCallback) {
readyCallback(null, app);
}
module.exports = (readyCallback) => {
initializeApp(readyCallback);
};
Can anyone give me a hand? Thanks in advance!