Why is my http.put Request not working? MEAN-Stack

Question

I'm building an app with a API and so far all the http request (get, post) are working fine. Now i added a put Request to my Service and for some reason it's not working.

Here is where i call the Service Function:

export class ChatStartComponent implements OnInit {

  @ViewChild('d1') d1:ElementRef;

  socket = io.connect('http://localhost:3000');

  constructor(private usersService: UsersService) {
    this.currentUser = JSON.parse(localStorage.getItem('currentUser'));
    this.currentUserName = this.currentUser.name;
    this.usersService.updateUser(this.currentUser._id); <--update Users does not
    /*this.usersService.getUsers()  <-- getUsers does work
      .subscribe(users => {
        this.users.push(users);
      });*/
  }

The Parameter, currentUser._id does exist and i can console log it at that point.

Here is the Service Function:

  addUser(newUser) {
    var headers = new Headers();
    headers.append('Content-Type', 'application/json');
    return this.http.post('http://localhost:3000/api/user', JSON.stringify(newUser), {headers: headers});
  }

  updateUser(_id: string) {
    var set = {
      loggedIn: true
    };
    console.log(set, _id);
    return this.http.put('http://localhost:3000/api/update/' + _id, JSON.stringify(set))
      .map(res => res.json());
  }

The http.post call above is working fine but the updateUser put is not working at all. The console.log is getting triggered and i do get the id logged just fine, but the http.put call doesn't work.

Here is the Server-side code:

router.put('/update/:id', function(req, res) {
  console.log('hello there');
  let user = req.body;
  userService.update(req.params._id, req.body)
    .then(function() {
      res.sendStatus(200);
    })
    .catch(function(err) {
      res.sendStatus(err).send(err);
    });
});

The console.log doesn't get triggered here, which tells me that the call never reaches the API.

Here is the Server-side Service function that gets called in it (or doesn't get called right now):

function update(_id, set) {
  var deferred = Q.defer();

  db.users.findById(_id, function(err, usr) {
    if(err) deferred.reject(err.name + ': ' + err.message);

    if(usr) {
      updateLoggedIn();
    } else {
      console.log('something's wrong here');
    }
  });

  function updateLoggedIn() {
    db.users.update({ _id: _id}, { $set: set }, function(err, doc) {
      if(err) deferred.reject(err.name + ': ' + err.message);

      deferred.resolve;
    });
    return deferred.promise;
  }
}

I don't get any error, but like i said the console.log on the server-side isn't getting triggered, which makes me belive that i did something wrong with the client-side call. I just can't figure out what. Any help is appreciated!

You never subscribe to the observable, so the request is not sent. — JB Nizet, Jan 05 '18 at 08:36

score 10 · Answer 1 · answered Jan 05 '18 at 08:43

Subscribe to Observables to "trigger" them

this.usersService.updateUser(this.currentUser._id).subscribe(response => {});

Also, in your server code,

if(usr) {
  updateLoggedIn();
} else {
  console.log('something's wrong here');
}

You don't return anything in your else, you should do something here.

score 3 · Answer 2 · answered Jan 05 '18 at 08:41

Call subscribe:

this.usersService.updateUser(this.currentUser._id).subscribe((user) => {
    let index = this.users.findIndex(u => u._id === user._id);
    this.users[index] = user;
})

Alternatively, assign the observable to a field and use the async pipe.

Why is my http.put Request not working? MEAN-Stack

2 Answers2