Nodejs express, Heroku CORS
The back end of my application was built with Node with an expression,
It worked fine locally, but now I have uploaded to Heroku
I am getting CORS errors even though I have handled it in the application
index.js
var express = require('express');
var bodyParser = require('body-parser');
var http = require('http');
var path = require('path');
var twit = require('twitter');
var app = express();
var port = process.env.PORT || 3000;
var twitter = new twit({
consumer_key: 'myKey',
consumer_secret: 'mySecret',
access_token_key: 'myKey',
access_token_secret: 'mySecret'
});
app.set('port', (port));
var server = http.createServer(app).listen(port, function() {
console.log('Server listening on port ' + port);
});
app.use(bodyParser.urlencoded({extended: true}));
app.use(function (req, res, next) {
res.setHeader('Access-Control-Allow-Origin', '*');
res.setHeader('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept');
res.setHeader('Access-Control-Allow-Methods', 'POST, GET, PATCH, DELETE, OPTIONS');
next();
});
app.get('/gettweets', function (req, res) {
twitter.get('statuses/user_timeline', { id: 23445555, count: 3 }, function(err, tweets, response) {
if (!err) {
res.json(tweets);
}
else {
return res.status(500).json({
title: 'An error has occured',
error: err
})
}
})
})
And in my http call
export class SocialService {
private url = 'https://myserver.herokuapp.com/';
constructor(private http: Http) { }
initialise(){
var headers = new Headers();
headers.append('Content-Type', 'application/json');
return this.http.get(this.url+'gettweets', {headers: headers})
.map((response: Response) => {
console.log(response.json());
return response.json();
})
.catch((error: Response) => Observable.throw(error.json()) )
}
}
And the build log from Heroku
-----> Node.js app detected
-----> Creating runtime environment
NPM_CONFIG_LOGLEVEL=error
NPM_CONFIG_PRODUCTION=true
NODE_VERBOSE=false
NODE_ENV=production
NODE_MODULES_CACHE=true
-----> Installing binaries
engines.node (package.json): unspecified
engines.npm (package.json): unspecified (use default)
Resolving node version 6.x via semver.io...
Downloading and installing node 6.10.3...
Using default npm version: 3.10.10
-----> Restoring cache
Loading 2 from cacheDirectories (default):
- node_modules
- bower_components (not cached - skipping)
-----> Building dependencies
Installing node modules (package.json)
-----> Caching build
Clearing previous node cache
Saving 2 cacheDirectories (default):
- node_modules
- bower_components (nothing to cache)
-----> Build succeeded!
-----> Discovering process types
Procfile declares types -> (none)
Default types for buildpack -> web
-----> Compressing...
Done: 17.8M
-----> Launching...
Released v5
https://myserver.herokuapp.com/ deployed to Heroku
And the error in the browser
XMLHttpRequest cannot load https://myserver.herokuapp.com/gettweets.
Response to preflight request doesn't pass access control check:
No 'Access-Control-Allow-Origin' header is present on the requested resource.
Origin 'http://localhost:4200' is therefore not allowed access. The response had HTTP status code 503.
This is the error I am getting from Heroku, something concerning the path I am requesting
2017-05-11T12:54:05.960151+00:00 heroku[router]: at=error code=H10 desc="App crashed" method=OPTIONS path="/gettweets" host=maleonserver.herokuapp.com request_id=5c052790-67df-4677-be8b-14cc2bc71292 fwd="5.67.244.130" dyno= connect= service= status=503 bytes= protocol=https
+3
source to share
2 answers
Try to allow credentials as well:
app.use(function(req, res, next) {
res.header("Access-Control-Allow-Origin", '*');
res.header("Access-Control-Allow-Credentials", true);
res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE,OPTIONS');
res.header("Access-Control-Allow-Headers", 'Origin,X-Requested-With,Content-Type,Accept,content-type,application/json');
next();
});
Edit:
Also if you want to make a local HTTP call in your heroku app; change
private url = 'https://myserver.herokuapp.com/';
to
private url = '/';
+5
source to share