Angular HttpClient "해석 중 Http 오류"
Angular 4에서 Larabel 백엔드로 POST 요청을 보내려고 합니다.
My Login Service에는 다음 방법이 있습니다.
login(email: string, password: string) {
return this.http.post(`http://10.0.1.19/login`, { email, password })
}
Login Component에서 다음 메서드를 구독합니다.
.subscribe(
(response: any) => {
console.log(response)
location.reload()
},
(error: any) => {
console.log(error)
})
Larabel 백엔드 메서드는 다음과 같습니다.
...
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 오류 발생
백엔드에서 빈 어레이를 반환하면 동작합니다.앵글이 내 대답을 JSON으로 해석하려고 하는 거야?어떻게 하면 비활성화 시킬 수 있나요?
반환되는 데이터가 JSON이 아님을 지정할 수 있습니다.responseType
.
이 예에서는,responseType
문자열 값text
:
return this.http.post(
'http://10.0.1.19/login',
{email, password},
{responseType: 'text'})
의 전체 옵션 목록responseType
다음과 같습니다.
json
(디폴트)text
arraybuffer
blob
상세한 것에 대하여는, 문서를 참조해 주세요.
get/post 메서드에서 일반 인수를 생략해야 한다는 것을 추가하고 싶습니다..get<T>
).
✔이 방법은 다음과 같습니다.
this.http.get(`https://myapi.com/health`, {responseType: 'text'})
❌ 이 방법은 작동하지 않습니다.
this.http.get<string>(`https://myapi.com/health`, {responseType: 'text'})
후자를 지정하면 다음과 같은 오류가 발생합니다.
필요한 유형은 속성 '응답'에서 가져옵니다.유형 '{ 헤더'에 선언된 유형':HttpHeaders | { [ header : string ]: string | string [ ] ; } | 정의되지 않았습니다.관찰: "이벤트"; 컨텍스트:Http Context | 정의되지 않음; 파라미터:HttpParams | { ...; } | 정의되지 않음; reportProgress?: boolean | 정의되지 않음; responseType ? :"json" | 정의되지 않음, credentials 포함?: boolean | 정의되지 않음; }'
옵션이 있는 경우
return this.http.post(`${this.endpoint}/account/login`,payload, { ...options, responseType: 'text' })
response Type을 추가해도 며칠 동안 대처했지만 성공하지 못했습니다.드디어 이해했어요.백엔드 스크립트에서 헤더를 -("Content-Type: application/json")로 정의하지 마십시오.
텍스트로 전환했는데 백엔드가 json을 요청하면 오류가 반환되기 때문에...
저도 같은 문제가 있었습니다만, 그 원인은 백엔드(스프링)의 스트링을 반환할 때 반환 "스프링 사용"으로 반환될 수 있다는 것입니다.그러나 이것은 스프링에 따라 올바르게 해석되지 않습니다.대신 리턴 "\" 스프링을 사용합니다.\"; - Peace out
제 경우 리소스 바로 뒤에 있는 URL 호출에 "/"가 누락된 것이 문제였습니다.그런 다음 JSON 리소스 대신 angular component(html)를 가져오려고 했습니다.저는 이 스레드에서 제 질문에 대한 답을 찾지 못했기 때문에 이것이 도움이 되기를 바랍니다.
JSON은 DevTools를 사용합니다.과 JSON의 을 겪고 Http \0
[DevTools] : Chrome 에에에에에에에 。
이 기사를 바탕으로
저도 같은 문제가 있었습니다만, 저는 api에 프록시 URL을 추가하는 것을 잊었습니다.
readonly apiUrl = this.appConfigService.appConfig.apiUrl + 'EndPointUrl';
이 답변이 도움이 되었습니다.https://stackoverflow.com/a/66887643/12134299
제 경우 PHP 결과에서 줄 바꿈이 있었습니다.
예.,
echo json_encode($row)."\<br/>";
제거했습니다.<br/>
이치노
저는 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'
아무도 안 먹혔어느니?마지막으로 문제가 Rocket Chat 설치 문제라는 것을 알 수 있었습니다.RocketChat 변경 로그에서 언급한 바와 같이 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
}
그래서 최신 Rocket Chat으로 업데이트한 후 언급한 REST API를 사용할 수 있었습니다.
저는 백엔드 태스크에 .NetCore를 사용하고 있습니다.Newtonsoft를 사용하여 이 문제를 해결할 수 있었습니다.컨트롤러에서 JSON 문자열을 반환하는 Json 라이브러리 패키지입니다.
모든 JSON 시리얼라이저가 올바른 사양으로 구축되어 있는 것은 아닌 것 같습니다.NET 5의 "return OK ("");"는 결코 충분하지 않았습니다.
언급URL : https://stackoverflow.com/questions/46408537/angular-httpclient-http-failure-during-parsing
'programing' 카테고리의 다른 글
Spring Pageable 인터페이스용 Swagger 문서 (0) | 2023.02.24 |
---|---|
Wordpress API v2에 대한 필드를 지정하는 방법 (0) | 2023.02.24 |
AngularJS를 명시적으로 지원하는 IDE가 있습니까? (0) | 2023.02.24 |
CORB(Cross-Origin Read Blocking) (0) | 2023.02.24 |
환경 변수로 JSON 내보내기 (0) | 2023.02.24 |