Angular on Node JS web service - GET http://127.0.0.1 net::ERR_CONNECTION_REFUSED

Question

I am developing website using AngularJS and host it within NodeJS (Express JS) web service. The AngularJS uses the data on some endpoints served by NodeJS. In another word, the NodeJS has endpoints which serve AngularJS web page and providing data needed.

Before host the webpage on my virtual machine (web service), I use my host machine to host it. The webpage then tried to request the data to my virtual machine's endpoint and it works fine.

However, when I'm hosting it on my virtual machine (web service) and changed to request data on my localhost (http://127.0.0.1:3000/data), I am now getting GET http://127.0.0.1:3000/data net::ERR_CONNECTION_REFUSED error.

What I have tried

First, I thought it was occurred because of cross origin resource sharing, so I am enabling that in my NodeJS by adding these lines of code (taken from this site):

app.use(function(req, res, next) {
  res.header("Access-Control-Allow-Origin", "*");
  res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
  next();
});

However, it still does not help at all. I am still getting the same error message.

Later, I thought it probably my firewall was blocking the access. I then turned off my firewall and it still failed to fix my problem.

I believe it happened because of my webpage trying to access endpoint on its localhost API, which should be overcome with CORS handling on my first attempt.

What is causing this exactly if it is not CORS? How do I overcome this issue? Any help would be appreciated.

Update: Node JS Route Code

var express = require('express');
var app =express();
app.use(express.static(path.join(__dirname, 'public')));

app.get('/admin/login/:user/:pass', function(appReq,appRes){
    appRes.status(200).send('1');
    appRes.end();
});

app.get('/*', function(appReq, appRes){
    fs.readFile('./public/index.html', function(err,data){
        if (err) {
            appRes.writeHead(500);
            appRes.end('Error loading html');
        }
        else {
            appRes.writeHead(200);
            appRes.end(data);
        }
    });
});

app.listen(port, function(){
    console.log('express app listening at http://'+hostname+":"+port+'/');
});

Here is my AngularJS GitHub repo

Can you please share the code over GitHub or similar, where we can look at it. The above mentioned code is not sufficiant to analyse what you are trying to serve and how you are trying to serve it. — Jeet
– Jeet, Commented May 12, 2017 at 2:53
@Jeet Sure, I will upload my angular to github and will update my node js routing code here as my node js file is huge. — Darren Christopher
– Darren Christopher, Commented May 12, 2017 at 3:02
if you want to confirm that the issue occur due to core install this extension in your browser chrome.google.com/webstore/detail/allow-control-allow-origi/… so this will allow cors and 2nd thing if you want to server your angular project in express you need to first make it build like "ng build --production" .you will get "dist" folder.place that folder in express public file or serve these file as static resources. if you share your server file it will help me to show you exact solution. — Adiii
– Adiii, Commented May 12, 2017 at 3:08
// serve angular front end files from root path app.use('/', express.static('dist', { redirect: false })); // rewrite virtual urls to angular app to enable refreshing of internal pages app.get('*', function (req, res, next) { res.sendFile(path.resolve('dist/index.html')); }); app.listen(3000,function(req,res) — Adiii
– Adiii, Commented May 12, 2017 at 3:11

Darren Christopher · Accepted Answer · 2017-05-12 04:09:16Z

1

Turns out using localhost IP is wrong. It is probably due to the JavaScript is sent to the client and the browser then interprets localhost is the client's localhost. Therefore, changing the localhost to my actual IP address solved my problem.

answered May 12, 2017 at 4:09

Darren Christopher

4,9594 gold badges25 silver badges40 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Adiii Over a year ago

Good that's why I told u look in to ip

Collectives™ on Stack Overflow

Angular on Node JS web service - GET http://127.0.0.1 net::ERR_CONNECTION_REFUSED

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related