Enable CORS for all origins and requests on API (#324)

* Enable CORS for all origins and requests on API

* Whitelist CORS origins: *.p5js.org in production and also localhost in development

Author: andrewn

package.json

@@ -69,6 +69,7 @@
     "codemirror": "^5.21.0",
     "connect-mongo": "^1.2.0",
     "cookie-parser": "^1.4.1",
+    "cors": "^2.8.1",
     "csslint": "^0.10.0",
     "dotenv": "^2.0.0",
     "dropzone": "^4.3.0",
@@ -91,8 +92,8 @@
     "passport": "^0.3.2",
     "passport-github": "^1.1.0",
     "passport-local": "^1.0.0",
-    "q": "^1.4.1",
     "project-name-generator": "^2.1.3",
+    "q": "^1.4.1",
     "react": "^15.1.0",
     "react-dom": "^15.1.0",
     "react-inlinesvg": "^0.4.2",

server/server.js

@@ -2,6 +2,7 @@ import Express from 'express';
 import mongoose from 'mongoose';
 import bodyParser from 'body-parser';
 import cookieParser from 'cookie-parser';
+import cors from 'cors';
 import session from 'express-session';
 import connectMongo from 'connect-mongo';
 import passport from 'passport';
@@ -29,13 +30,28 @@ import { get404Sketch } from './views/404Page';
 const app = new Express();
 const MongoStore = connectMongo(session);
 
+const corsOriginsWhitelist = [
+  /p5js\.org$/,
+];
+
 // Run Webpack dev server in development mode
 if (process.env.NODE_ENV === 'development') {
   const compiler = webpack(config);
   app.use(webpackDevMiddleware(compiler, { noInfo: true, publicPath: config.output.publicPath }));
   app.use(webpackHotMiddleware(compiler));
+
+  corsOriginsWhitelist.push(/localhost/);
 }
 
+// Enable Cross-Origin Resource Sharing (CORS) for all origins
+const corsMiddleware = cors({
+  credentials: true,
+  origin: corsOriginsWhitelist,
+});
+app.use(corsMiddleware);
+// Enable pre-flight OPTIONS route for all end-points
+app.options('*', corsMiddleware);
+
 // Body parser, cookie parser, sessions, serve public assets
 
 app.use(Express.static(path.resolve(__dirname, '../static')));