MEAN-stack app: REST API calls from angular2 frontend to express backend do not work. Error: ERR_CONNECTION_REFUSED

Question

I am building a MEAN stack app, following this tutorial: https://www.youtube.com/watch?v=PFP0oXNNveg&t=3236s

The Problem: I try to do http.get() request from my angular2 frontend to my express backend. It does not work and i get the Error: ERR_CONNECTION_REFUSED: The Error

My frontend is on localhost/4200 and my backend on localhost/3000. I figured the problem might be that, so i search for solutions and tried everything described in here: Angular-CLI proxy to backend doesn't work (solution to proxy the localhost port), which does not work for me. I still get the error.

here is my code :

Service method with API call

getUsers() { return this.http.get('http://localhost/3000/api/users') .map(res => res.json()); }

server.js

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

var start = require('./routes/start');
var registration = require('./routes/registration');

var port = 3000;
var app = express();

//View Engine
app.set('views', path.join(__dirname, 'views'));
app.set('view engine', 'ejs');
app.engine('html', require('ejs').renderFile);

//Set Static Folder
app.use(express.static(path.join(__dirname, 'client')));
app.use(express.static(path.join(__dirname, 'client', 'dist')));

//Body Parser MW
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({extended: false}));

app.use('/', start);
app.use('/api', registration);

app.listen(port, () =>{
  console.log('Server started on port '+port);
});

The route i try to use with my API call

//get all the user
router.get('/users', function(req, res, next){
  db.users.find(function(err, usrs){
    if(err){
      res.send(err);
    }
    res.json(usrs);
  });
});

//get single user
router.get('/user/:id', function(req, res, next) {
  db.users.findOne({_id: mongojs.ObjectId(req.params.id)}, function(err, usr){
    if(err){
      res.send(err);
    }
    res.json(usr);
  });
});

//save a new user
router.post('/user', function(req, res, next) {
  var user = req.body;
  if(!user.name || !user.password){
    res.status(400);
    res.json({
      "error": "Bad Data"
    });
  } else {
      db.users.save(user, function(err, user) {
        if(err){
          res.send(err);
        }
        res.json(user);
      });
    }
});

module.exports = router;

Answer 1

I'm guessing because you're trying to go to 'http://localhost/3000/api/users' which has a / after localhost instead of a :, so you're going to localhost on port 80, which is the default. Switch it to 'http://localhost:3000/api/users', does that help?