New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

CORS Support #619

Closed
johnlo1992 opened this Issue Sep 10, 2014 · 11 comments

Comments

Projects
None yet
@johnlo1992

johnlo1992 commented Sep 10, 2014

Hi,

I was wondering if KeystoneJS had CORS support, couldn't seem to find the documentation on it from the website.

Best,
John

@pr1ntr

This comment has been minimized.

pr1ntr commented Sep 10, 2014

You can probably do this by creating a middleware for it in middleware.js

exports.setCors = function (req,res,next) {
    res.header('Access-Control-Allow-Origin', 'example.com');
    res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE');
    res.header('Access-Control-Allow-Headers', 'Content-Type');
}

[EDIT]
I am not sure how keystone picks up middleware but im sure there is a method somewhere.

@grabbou

This comment has been minimized.

Member

grabbou commented Sep 11, 2014

You can go with cors package for node which is quite easy to use as a middleware.

@JedWatson

This comment has been minimized.

Member

JedWatson commented Jan 19, 2015

Just leaving a note here that cors middleware is now baked into Keystone, to use it you can do this:

app.all('/api*', keystone.middleware.cors);

... where appropriate in your route config.

@chrisschaub

This comment has been minimized.

chrisschaub commented Nov 17, 2015

I can never get this to work. I've tried JedWatson's suggestion, but still no dice. Could it be that I have apache up front handling port 80 proxying to node/express on 3000? Add that line to my routes does nothing. Using latest keystone.

@alancwoo

This comment has been minimized.

alancwoo commented Jan 17, 2016

Was also confused about this, but eventually found this issue:
#1374

One needs to add the lines

routes: app.all('/api*', keystone.middleware.cors);

keystone.js file in root: keystone.set('cors allow origin', true);

@cvn

This comment has been minimized.

Contributor

cvn commented Mar 8, 2016

For POSTing JSON data, in addition to the steps mentioned by @alancwoo, I also had to add the following to routes, to satisfy the preflight OPTIONS request:

app.options('/api*', function(req, res) {
    res.send(200);
});
@TheDucc

This comment has been minimized.

TheDucc commented Jul 6, 2016

Thank you @cvn for that wonderful bit of code I needed.

But I still needed more when trying to use my api routes to talk to the new version of angular (2.0.0-rc.4).

app.all('/api*', keystone.middleware.cors);
app.options('/api*', function(req, res) {
   res.header('Access-Control-Allow-Headers', 'Content-Type, Authorization, X-XSRF-TOKEN');
   res.sendStatus(200);
});

I know this overwrites the keystone.middleware.cors values, so I though I would post this here in order to get opinions on the validity of this technique.

@MikelArnaiz

This comment has been minimized.

MikelArnaiz commented Jul 19, 2016

I have a weird behaviour.
I am developing an app with Ionic, locally, if I install the app on the phone these lines work:

index.js
app.all('/api*', keystone.middleware.cors); app.options('/api*', function(req, res) { res.sendStatus(200); });

keystone.js
keystone.set('cors allow origin', true);

If I run the app with livereload ionic run android --device --livereload the login works, but the api calls don't. I get a 403 Forbidden. If I disable checkAuth it works (without security). My routes/index.js is like:

exports = module.exports = function(app) {
    app.all('/api*', keystone.middleware.cors);
    app.options('/api*', function(req, res) {
        res.sendStatus(200);
    });

    app.post('/api/signin', sessionAuth.signin);
    app.post('/api/signout', sessionAuth.signout);

    app.all('/api*', sessionAuth.checkAuth);

    app.get('/', routes.views.index); // View

    app.get('/api/v1/something', keystone.middleware.api, routes.api.v1.something.getSomething);
};

Can be this related to CORS?

@wmertens

This comment has been minimized.

Contributor

wmertens commented Jul 19, 2016

You will need to look at the requests in your app, probably the livereload makes them behave differently (maybe the origin changes?). I doubt that Keystone has anything to do with this.

@steveinatorx

This comment has been minimized.

steveinatorx commented Oct 23, 2016

i kept getting OPTIONS 404s until i added @cvn suggestion

app.options('/api*', function(req, res) { res.send(200); });

@useralive003

This comment has been minimized.

useralive003 commented Jan 12, 2017

var express = require('express'); 
var app = express(); 
var bodyParser = require('body-parser');
var multer = require('multer');

app.use(function(req, res, next) { //allow cross origin requests
    res.setHeader("Access-Control-Allow-Methods", "POST, PUT, OPTIONS, DELETE, GET");
    res.header("Access-Control-Allow-Origin", "http://localhost");
    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
    next();
});

/** Serving from the same express Server
No cors required */
app.use(express.static('../client'));
app.use(bodyParser.json());  

var storage = multer.diskStorage({ //multers disk storage settings
    destination: function (req, file, cb) {
		//console.log(file);
        cb(null, './uploads/');
    },
    filename: function (req, file, cb) {
        var datetimestamp = Date.now();
        cb(null, file.fieldname + '-' + datetimestamp + '.' + file.originalname.split('.')[file.originalname.split('.').length -1]);
    }
});

var upload = multer({ //multer settings
                storage: storage
            }).single('file');

/** API path that will upload the files */
app.post('/upload', function(req, res) {
	
	console.log(req.body);
	
    upload(req,res,function(err){
        if(err){
             res.json({error_code:1,err_desc:err});
             return;
        }
		
         res.json({error_code:0,err_desc:null});
    });
});

app.listen('3000', function(){
    console.log('running on 3000...');
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment