When attempting to send a post request to my API, I encountered an error indicating that the connection to 'http://127.0.0.1:3000/api/v1/users/login' was refused due to a Content Security Policy directive violation. The specific error message that was caught from the API reads as follows: "Network Error". This issue arises despite using a simple post request through axios.
import axios from 'axios';
export const login = async (email, password) => {
try {
const res = await axios({
method: 'POST',
url: 'http://127.0.0.1:3000/api/v1/users/login',
data: {
email,
password
}
});
console.log(res);
} catch (err) {
console.log(err);
}
};
The problem lies in reaching the endpoint of the API. It seems that the middleware being used could be causing this issue. Below is a list of all the middleware currently implemented:
app.use(express.static(path.join(__dirname, 'public'))); //to use static files like css in public folder
app.use(cookieParser());
app.use(helmet());
app.use(express.json());
app.use(mongoSanitize());
app.use(xss());
app.use(
hpp({
whitelist: [
'duration',
'ratingquantity',
'pricediscout',
'maxGroupSize',
'difficulty',
'price',
'ratingAverage',
],
}),
);
Even after removing some of the middleware, the issue persists and I am still unable to reach the API endpoint.