Post Request in Angular to Node.js is not sending

Question

My goal is simple : I want to send a post request from Angular and via http to my node.js

But, the request is not received.

Here is my Angular Code

const Data =  [{
'name' : this.userForm.controls.name.value,
'email' : this.userForm.controls.email.value,
'Object': this.userForm.controls.Object.value,
'message': this.userForm.controls.message.value
}];
console.log('ready to send');
this.http.post('http://localhost:8012/sendmail', Data).subscribe();

I just format my data in Data to send it. It was part of all my try. The url is good, since I test with get method and it worked !

Now in Node.js

const express = require('express');
const path = require("path");
const bodyParser = require('body-parser');
const mongoose = require('mongoose');

var db = mongoose.connect("mongodb://localhost:27017/test", 
function( err, response){
if(err){console.log(err);}
});

var app = express();
app.use(bodyParser());
app.use(bodyParser.json({limit:'10mb'}));
app.use(bodyParser.urlencoded({extended:true}));

app.use(function(req,res,next){
res.setHeader('Access-Control-Allow-
Origin','http://localhost:4200');
res.setHeader('Access-Control-Allow-
Methods','http://localhost:4200','POST');
res.setHeader('Access-Control-Allow- 
Credentials','http://localhost:4200', true);
next();
});

app.post("/sendmail",function (req, res, next){
console.log("wddddddf");
res.end('buck');
})


app.listen(8012, ()=>{
console.log('waf waf 8012 waf waf');
})

Here I just want to receive data and console.log to know it's working.

My problem is that the request doesn't seems able to reach my node.

Does someone could help me to understand why ?

Edit : It still doesn't work with the subscribe. I've this error:

Arnaud Scieur · Accepted Answer · 2018-10-02 21:11:04Z

4

After hours of search, I found the solution : I add this line in as setHeader:

res.setHeader( 'Access-Control-Allow-Headers', 'Accept,Accept- 
Language,Content-Language,Content-Type');

answered Oct 2, 2018 at 21:11

Arnaud Scieur

611 silver badge8 bronze badges

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

3 Comments

codeepic Over a year ago

What Angular version do you use? You don't have to set headers with HttpClient as opposed to Http service.

Arnaud Scieur Over a year ago

6.2.2 And effectively, with Postman, the request was working. It's only with angular

codeepic Over a year ago

There has to be something else at play too, haven't used 6.0 yet, but since I moved to HttpClient I never had to set headers.

Amit Chigadani · Accepted Answer · 2018-10-02 14:35:21Z

1

Your request is not being sent because you have not subscribed to post request

this.http.post('http://localhost:8012/sendmail', Data)
            .subscribe((result) => console.log(result));

answered Oct 2, 2018 at 14:35

Amit Chigadani

29.9k14 gold badges88 silver badges102 bronze badges

1 Comment

Arnaud Scieur Over a year ago

Thanks, but it seem it's not the only mistake there is in my code.

codeepic · Accepted Answer · 2018-10-02 14:58:44Z

1

You need to subscribe to post request:

this.http.post('http://localhost:8012/sendmail', Data)
    .subscribe();

Angular Http and from version 4.3 HttpClient use RxJS streams to send (emit using RxJS terminology) data to backend. These streams are lazy evaluated, which means they will not emit any value unless something is subscribed to them. Hence you need to construct your http calls like this:

    this.http.post(url, data)
        .map((response) => {    //optional
           //map over data - do some computation
        })
        .subscribe();

Usually the first 4 lines are in the service - wrapped in a function that returns an Observable(), the .subscribe() block is in a component calling the service method.

edited Oct 2, 2018 at 14:58

answered Oct 2, 2018 at 14:50

codeepic

4,1528 gold badges39 silver badges60 bronze badges

1 Comment

Arnaud Scieur Over a year ago

Thanks for the explanation. However, it seem it was not the only error in my code since it is still not working. Could the problem come that I import HttpClient from @angular/http and don't importe anything from rxjs ?

Govind Sah · Accepted Answer · 2018-10-02 17:29:15Z

0

You need to import the HttpClient from @angular/common/http, like below.

import {HttpClient, HttpHeaders} from '@angular/common/http';

See if it works.

answered Oct 2, 2018 at 17:29

Govind Sah

11610 bronze badges

1 Comment

Arnaud Scieur Over a year ago

It's already is, I just forgotten I had already set up this route. Thanks anyway !

Collectives™ on Stack Overflow

Post Request in Angular to Node.js is not sending

4 Answers 4

3 Comments

1 Comment

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

3 Comments

1 Comment

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related