I have a frontend and express js server hosted on aws lightsail that uses ubuntu with nginx.
The server is set as a reversed proxy. Here is the config
location /api/ {
proxy_pass http://localhost:4000/api/;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_set_header Host $host;
proxy_cache_bypass $http_upgrade;
}
I'm trying to make a post request (login) from client to express but I get this
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource
at http://localhost:4000/api/users/login. (Reason: CORS request did not succeed). Status
code: (null).
but I have enabled cors on my server in multiple ways but with no success
const cors = require('cors');
const app = express();
const corsOption = {origin: "http://18.193.59.75:80"};
app.options("/*", function(req, res, next){
res.header('Access-Control-Allow-Origin', '*');
res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE,OPTIONS');
res.header('Access-Control-Allow-Headers',
'Content-Type, Authorization, Content-Length, X-Requested-With');
res.send(200);});
//app.use(cors(corsOptions));
//app.options('*', cors(corsOptions));
Add the next()
handler as given below and see if resolves your issue.
const cors = require('cors');
const app = express();
// const corsOption = {origin: "http://18.193.59.75:80"};
var corsOptions = function(req, res, next){
res.header('Access-Control-Allow-Origin', '*');
res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE,OPTIONS');
res.header('Access-Control-Allow-Headers',
'Content-Type, Authorization, Content-Length, X-Requested-With');
next();
}
app.use(corsOptions);
I still had problems on mobile with cors and I erased all the config and did it all again just to realize that in my front-end I called 'http://localhost:4000'
where my server was running but it was running on the server so to reach it I had to call it http://18.193.59.75/api/endpoint
and the nginx will redirect to 'http://localhost:4000'
with proxy pass.
here is my nginx config
server {
listen 80;
listen [::]:80;
server_name _;
location / {
root /var/www/website/client;
try_files $uri /index.html;
}
location /api {
proxy_pass http://localhost:4000;
}
and my index.js from express
const express = require('express');
const cors = require('cors');
const app = express();
// var corsOptions = function(req, res, next){
// res.header('Access-Control-Allow-Origin', '*');
// res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE,OPTIONS');
// res.header('Access-Control-Allow-Headers',
// 'Content-Type, Authorization, Content-Length, X-Requested-With');
// next();
// }
// app.use(corsOptions);
app.use(cors());
app.use(aux);
app.use(express.json());
app.use(express.urlencoded({extended: false}))
app.use('/api/appointments', require('./api/appointmnets'));
app.use('/api/users', require('./api/users'));
app.get('/test', (req, res) => {
res.json({'test' : 'successed'})
})
const PORT = process.env.PORT || 4000;
app.listen(PORT, () => {
console.log(`App listens to port ${PORT}`);
})
and the domain that I use from front-end to call my express server
const domain = 'http://18.193.59.75:80/api/';
const domain = 'http://localhost:80/api'; //wronge
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.