[英]Angular 2 Post Request to Node/Express Server Endpoint
I can't seem to diagnose why I can't send a successful HTTP request in my Angular 2 Typescript application. 我似乎无法诊断为什么我无法在Angular 2 Typescript应用程序中发送成功的HTTP请求。 I send POST requests successfully through Postman, but the front-end seems to be unhappy about linking to the back-end... there's no error, and the back-end never responds.
我通过Postman成功发送了POST请求,但是前端似乎对链接到后端感到不满意……没有错误,并且后端也从未响应。 Please help!
请帮忙!
I'm working in a C9 environment. 我在C9环境中工作。
Here's my current implementation: 这是我当前的实现:
import {Component} from 'angular2/core';
import {MessageBody} from '../message-body/message-body';
import {Http, HTTP_PROVIDERS, Headers} from 'angular2/http';
@Component({
selector: 'signup',
template: require('app/signup/signup.html'),
styles: [require('app/signup/signup.css')],
viewProviders: [HTTP_PROVIDERS],
providers: []
})
export class Signup {
model = new MessageBody(
'',
'',
'',
'');
constructor(public http: Http) {
}
onSubmit() {
var headers = new Headers();
headers.append('Content-Type', 'application/x-www-form-urlencoded');
this.http.post('/email', JSON.stringify(this.model), {headers: headers})
.map(res => console.log(res.json()));
}
}
This is the endpoint on the server: 这是服务器上的端点:
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false }));
app.post('/email', sendEmail);
app.use(express.static(__dirname +'/../dist'));
app.listen(process.env.PORT, listen);
I've tried posting to /email
, http://localhost:8080/email
, https://{appName}-{username}.c9users.io/email
, all to no avail! 我尝试过发布到
/email
, http://localhost:8080/email
, https://{appName}-{username}.c9users.io/email
,但都无济于事!
What am I doing wrong? 我究竟做错了什么? I appreciate the help!
感谢您的帮助!
EDIT: Thierry already answered here, so this is a dupe. 编辑:蒂埃里(Thierry)已经在这里回答了,所以这是一个骗子。 angular2: http post not executing
angular2:http发布未执行
There is a mismatch between the content type and the content you provide to the POST method. 内容类型和您提供给POST方法的内容之间不匹配。
If you expect url-encoded form, you need to update your code this way: 如果您希望使用url编码形式,则需要通过以下方式更新代码:
onSubmit() {
var headers = new Headers();
headers.append('Content-Type', 'application/x-www-form-urlencoded');
var content = new URLSearchParams();
content.set('somefield', this.model.somefield);
(...)
this.http.post('/email', content.toString(), {headers: headers})
.map(res => console.log(res.json()));
}
If you want to send JSON content, just change the value of the Content-Type
header: 如果要发送JSON内容,只需更改
Content-Type
标头的值即可:
onSubmit() {
var headers = new Headers();
headers.append('Content-Type', 'application/json');
this.http.post('/email', JSON.stringify(this/model), {headers: headers})
.map(res => console.log(res.json()));
}
Moreover I think that you endpoint isn't located on the same machine unless you serve it through your Express application with something like this: 此外,我认为您的端点不在同一台计算机上,除非您通过Express应用程序为它提供以下服务:
app.use(express.static('public'));
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.