How can I fix the CORS error "No Access-Control-Allow-Origin header is present"?

Question

I'm currently learning to code and for the love of god can't figure out this issue. Following the instructions, my current server side js code looks like this:

const mongoose = require('mongoose');
const Models = require('./models.js');
const passport = require('passport');
require('./passport');
const Movies = Models.Movie;
const Users = Models.User;
const express = require('express'),
      morgan = require('morgan'),
      bodyParser = require('body-parser'),
      uuid = require('uuid/v5');
const app = express();
const cors = require('cors');
const { check,validationResult} = require('express-validator');

mongoose.connect('mongodb+srv://' + process.env.Userpass + '@darksdb-dkyuz.mongodb.net/darksdb?retryWrites=true&w=majority', {
    useNewUrlParser: true,
    useUnifiedTopology: true,
})

app.use(express.static('public'));
app.use(morgan('common'));
app.use(bodyParser.json());

var allowedOrigins = ['*'];

app.use(
    cors({
         origin: function (origin, callback) {
              if (!origin) return callback(null, true);
              if (allowedOrigins.indexOf(origin) === -1) {
                  // if specific origin isn't found on list of allowed origins
                  var message =
                      'The CORS policy for this application doesn´t allow access from origin' +
                      origin;
                  return callback(new Error(message), false);
              }
              return callback(null, true);
          }
    })
);

var auth = require('./auth')(app);

app.use(function (err, req, res, next) {
    console.error(err.stack);
    res.status(500).send('Oops! Sorry about that, something went wrong!');
});

Each time I try to register a new user, I get this response:

Access to XMLHttpRequest at 'https://dashboard.heroku.com/apps/limitless-thicket-23479/users' from origin 'http://localhost:1234' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

I'm pretty sure I've done something wrong but, being so new to this, I have no idea where I have gone wrong in order to start trouble shooting. Some suggestions I've read would require me to change code I'm already unfamiliar with and I feel I'd break this even more if I start to just "wing it".

Any help would be very appreciated. Thank you

PS: apologies if my tags are misleading or wrong, I'm still learning :/

@HereticMonkey, he has already implemented the cors property but only the thing missing that i found missing is not registered core into app. — Charanjeet Singh, May 26 '20 at 13:04
Possible duplicate of [Why doesn't adding CORS headers to an OPTIONS route allow browsers to access my API?](https://stackoverflow.com/q/7067966/215552) — Heretic Monkey, May 26 '20 at 13:15
See the answer at https://stackoverflow.com/a/38500226/441757 — in particular the part with `app.options('*', cors())`. And see the docs at https://www.npmjs.com/package/cors#enabling-cors-pre-flight — sideshowbarker, May 27 '20 at 08:07

score -1 · Answer 1 · answered May 26 '20 at 13:01

-1

Hi i think before routing you should use below mentioned code.

var cors = require('cors');
app.use(cors());

Hope this will solve your question.

answered May 26 '20 at 13:01

Charanjeet Singh

312
1
6

Pardon my ignorance but, where should I add this? – Brad May 26 '20 at 13:33

How can I fix the CORS error "No Access-Control-Allow-Origin header is present"?

1 Answers1