通过Angular发布到ExpressJS后端的结果出现奇怪的正文格式
通过Angular发布到ExpressJS后端的结果出现奇怪的正文格式
提问于 2018-06-01 04:03:06
我正在尝试做一个简单的待办事项列表应用程序来学习angular作为前端，使用express作为后端，数据库使用sequelize进行管理。发布到节点后端以添加用户的结果为此对象格式的{ '{"first_name":"132","last_name":"132","email":"123"}': '' }
我找不到任何方法来解析它或更改发送数据的方式。
相关代码如下：
user.service.ts
import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { throwError as observableThrowError, Observable } from
'rxjs';
import { Response } from '@angular/http';
import { User } from '../user';
import { catchError, shareReplay } from 'rxjs/operators';
@Injectable({
providedIn: 'root'
})
export class UserService {
url = "http://localhost:3000";
private headers = new HttpHeaders({
'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
});
constructor(private http:HttpClient) {
}
getUsers(): Observable<User[]> {
return this.http.get<User[]>(this.url + '/users');
}
getUser(id: number): Observable<User[]> {
return this.http.get<User[]>(this.url + '/users/' + id);
}
addUser(user: User): Observable<User[]> {
const body = {
first_name: user.first_name,
last_name: user.last_name,
email: user.email
}
return this.http.post<User[]>(this.url + '/adduser', body, { headers: this.headers, responseType: 'json'}).pipe(
catchError(response => { return observableThrowError(response); }));;
}
}index.js (路由)
router.post('/adduser', /*cors(corsOptions),*/ function(req, res, next) {
console.log(req.body);
var firstName = req.body.first_name,
lastName = req.body.last_name,
email = req.body.email;
models.User.create({
first_name: firstName,
last_name: lastName,
email: email
}).then(function() {
res.send(200);
})
});回答 2
Stack Overflow用户
发布于 2018-06-01 04:09:22
使用HttpParams文档记录的here
import { HttpParams, HttpClient } from '@angular/common/http';
...
constructor(private httpClient: HttpClient) { ... }
...
let params = new HttpParams();
params = params.append("page", 1);
....
this.httpClient.get<any>(apiUrl, {params: params});Stack Overflow用户
发布于 2018-06-01 04:33:10
user184994建议的工作代码
import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { throwError as observableThrowError, Observable } from
'rxjs';
import { Response } from '@angular/http';
import { User } from '../user';
import { catchError, shareReplay } from 'rxjs/operators';
@Injectable({
providedIn: 'root'
})
export class UserService {
url = "http://localhost:3000";
constructor(private http:HttpClient) {
}
getUsers(): Observable<User[]> {
return this.http.get<User[]>(this.url + '/users');
}
getUser(id: number): Observable<User[]> {
return this.http.get<User[]>(this.url + '/users/' + id);
}
addUser(user: User): Observable<User[]> {
const body = {
first_name: user.first_name,
last_name: user.last_name,
email: user.email
}
return this.http.post<User[]>(this.url + '/adduser', body).pipe(
catchError(response => { return observableThrowError(response); }));;
}
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/50631963
复制相关文章
相似问题
腾讯云开发者
