我尝试将Angular 4的POST请求发送到我的Laravel后端。
我的LoginService有这个方法：
login(email: string, password: string) {
return this.http.post(`http://10.0.1.19/login`, { email, password })
}
我在LoginComponent中订阅了这个方法：
.subscribe(
(response: any) => {
console.log(response)
location.reload()
},
(error: any) => {
console.log(error)
})
这是我的Laravel后端方法：
...
if($this->auth->attempt(['email' => $email, 'password' => $password], true)) {
return response('Success', 200);
}
return response('Unauthorized', 401);
我的Chrome开发工具说我的请求是成功的200状态代码。但是我的Angular代码触发了error块并给了我这样的信息：
解析http://10.0.1.19/api/login时的Http失败
如果我从后端返回一个空数组，它可以工作......所以Angular试图将我的响应解析为JSON？我怎么能禁用它？
您可以使用responseType指定要返回的数据不是JSON。
在您的示例中，您可以使用responseType字符串值text，如下所示：
return this.http.post(
'http://10.0.1.19/login',
{email, password},
{responseType: 'text'})
其他选项是json（默认值），arraybuffer和blob。
有关更多信息，请参阅docs。
如果你有选择
return this.http.post(`${this.endpoint}/account/login`,payload, { ...options, responseType: 'text' })
即使添加了responseType，我也处理了几天而没有成功。终于我明白了。确保在后端脚本中没有将标题定义为 - （“Content-Type：application / json）;
因为如果你把它变成文本但后端要求json，它将返回一个错误...
我在Angular应用程序中遇到了同样的问题。我在我的应用程序中使用RocketChat REST API，我试图使用rooms.createDiscussion，但是如下所示的错误。
ERROR Error: Uncaught (in promise): HttpErrorResponse: {"headers":{"normalizedNames":{},"lazyUpdate":null},"status":200,"statusText":"OK","url":"myurl/rocketchat/api/v1/rooms.createDiscussion","ok":false,"name":"HttpErrorResponse","message":"Http failure during parsing for myrul/rocketchat/api/v1/rooms.createDiscussion","error":{"error":{},"text":"
我尝试了一些改变responseType: 'text'的东西，但没有一个能奏效。最后我能够找到问题是我的RocketChat安装。正如在RocketChat change log中所提到的，API rooms.createDiscussion已经在版本1.0.0中引入，不幸的是我使用的是较低版本。
我的建议是在花时间修复Angular代码中的错误之前检查REST API是否正常工作。我用curl命令检查一下。
curl -H "X-Auth-Token: token" -H "X-User-Id: userid" -H "Content-Type: application/json" myurl/rocketchat/api/v1/rooms.createDiscussion -d '{ "prid": "GENERAL", "t_name": "Discussion Name"}'
我也得到了一个无效的HTML作为回应。
<!DOCTYPE html>
<html>
<head>
<meta name="referrer" content="origin-when-crossorigin">
<script>/* eslint-disable */
'use strict';
(function() {
var debounce = function debounce(func, wait, immediate) {
而不是如下的有效JSON响应。
{
"discussion": {
"rid": "cgk88DHLHexwMaFWh",
"name": "WJNEAM7W45wRYitHo",
"fname": "Discussion Name",
"t": "p",
"msgs": 0,
"usersCount": 0,
"u": {
"_id": "rocketchat.internal.admin.test",
"username": "rocketchat.internal.admin.test"
},
"topic": "general",
"prid": "GENERAL",
"ts": "2019-04-03T01:35:32.271Z",
"ro": false,
"sysMes": true,
"default": false,
"_updatedAt": "2019-04-03T01:35:32.280Z",
"_id": "cgk88DHLHexwMaFWh"
},
"success": true
}
所以在更新到最新的RocketChat后，我能够使用上面提到的REST API。