angular访问后端服务器,进行数据交互,可以通过如下4种方式传递数据给服务端;
- 参数的形式:
api/users?username=abc&age=18
- 通过表单的形式提交数据,在请求头加上:
Content-Type: application/x-www-form-urlencoded
- 直接在body下发送json数据, 在请求头加上:
Content-Type: application/json;charset=utf-8
- 在请求头下设置参数传递
服务器端也有几种接收方式,我以php
为列子
- 通过参数传递的话,可以通过
$_GET
来获取参数值; - 通过表单传递的话, 可以通过
$_POST
来获取参数值;
- 通过json传递的话,php获取数据流的形式才能获取到客户端json数据,代码如:
$str = file_get_content("php://input");
$arr = json_decode($str, true);
- 现在重点说一下前端通过请求头的形式发送数据给服务端接收
- 前端angular:
headerOptions: any;
constructor(private http: HttpClient) {
this.headerOption =
{
'Content-Type': 'application/json;charset=utf-8',
"did": "abc",
"version": "1.0"
}
}
login(username: string, password: string){
return this.http.post(
this.url + '/login',
{username: username, password: password},
{headers : this.headerOption}
);
}
- 后端一定要设置可以接收的请求头信息,不如会出现如下错误,不容许请求头 versionx 访问
- 服务端设置容许的请求头信息,不然did,version就不能接收;
header('Access-Control-Allow-Headers:x-requested-with,content-type,did,version');