Ad

OPTIONS Net::ERR_EMPTY_RESPONSE Angular - What Are The CORS Settings?

- 1 answer

I am trying to make a get request to a mongoDB which is on a server. This is the same server that my webpage will be hosted. I have created an API so that the webpage can make requests to the mongoDB.

My first issue was with it being blocked by CORS policy so I looked into this and the information I found led to me adding in corsOptions to server.js (the API file running on the server).

This is my server.js (The API file I am running on the server to connect the webpage with node.js connect to the mongoDB):

// Dependencies
var express = require('express');
var mongoose = require('mongoose');
var bodyParser = require('body-parser');
var cors = require('cors');
var app = express();


const corsOptions = {
    origin = true,
    methods: 'GET,HEAD,PUT,PATCH,POST,DELETE',
    credentials: true,
    preflightContinue: true,
    maxAge: 600,
};
app.options('*', cors(corsOptions))
app.use(cors(corsOptions))

// MongoDB
mongoose.connect('mongodb://serverip:27017/database');

// Express
app.use(bodyParser.urlencoded({ extended: true }));
app.use(bodyParser.json());

// Routes
app.use('/api', require('./routes/api'));

// Start server
app.listen(3000);
console.log('Listening on port 3000...');

My .component.ts runs a simple httpClient.get request to get the information, like so:

const httpOptions = {
  headers: new HttpHeaders({
    'Access-Control-Allow-Origin': '*'
  })
};

this.httpService.get('http://serverip:3000/api/collection/', httpOptions).subscribe(
    result => {
        console.log(result);
    },
    error => {
        console.log('Error occured', error);
    }
)

I get the following error in Google Chrome:

OPTIONS http://serverip:3000/api/collection/ net::ERR_EMPTY_RESPONSE

I've run Chrome with this command in WIN+R:

chrome.exe --user-data-dir="C:/Chrome dev session" --disable-web-security

I get this error on that Chrome:

OPTIONS http://serverip:3000/api/collection/ net::ERR_EMPTY_RESPONSE

If I remove the code in the server.js that is to do with CORS, and load the webpage in the Chrome with no web security then webpage loads the data from MongoDB with no issues at all.

I also tried to put OPTIONS into the methods in the server.js but I still get the same error.

I assume this error is from the corsOptions but what do i need to change/add to resolve this error.

Any help is appreciated!

Ad

Answer

First of all try to test yout API using Postman to ensure you have the correct response. secondly try to add cors withou any option. this ensures you to use default cors options, and then try to add your's one by one.

app.use(cors())

lastly, you do not need to add any headr to your http call, so you can remove this part

const httpOptions = {
  headers: new HttpHeaders({
    'Access-Control-Allow-Origin': '*'
  })
};

Ad
source: stackoverflow.com
Ad