Angular 2 XMLHttpRequest에서 열기를 실행하지 못했습니다.잘못된 URL
저는 서비스를 호출하려고 합니다. DHC에서 작동하지만, 제가 제 각진 2 프로젝트를 호출하려고 할 때, 그것은 충돌하고, 방법 요청은 POST이고, 이메일과 비밀번호를 가진 물체를 수신하고, 응답은 토큰입니다. 제가 승인을 위해 전체 프로젝트에 사용할 것입니다.
여기 제 코드가 있습니다.
import { Injectable } from '@angular/core';
import { Http, Response, Headers, Request ,RequestOptions ,RequestMethod } from '@angular/http';
import {Observable} from 'rxjs/Rx';
import 'rxjs/add/operator/map';
@Injectable()
export class LoginService {
constructor(private http:Http) {
}
getToken(){
var baseUrl = "xxx.xxx.x.xxx:xxxx/project/v1/admin/login";
var headers = new Headers();
headers.append("Content-Type", 'application/json');
var options = new RequestOptions({ headers: headers });
var objeto = {'email': 'xxxxxx', 'pass':'xxxx' }
var body2 = JSON.stringify(objeto);
var xhr = new XMLHttpRequest();
return this.http
.post(baseUrl, body2, options)
.map((response: Response) => response.json())
.subscribe(
data => console.log('Success uploading the opinion '+ data, data),
error => console.error(`Error: ${error}`)
);
}
}
각도 2에서 XMLHttp Request 호출을 구현하려고 하는데 오류가 같습니다. 각도 2에서 사용할 수 있는지 모르겠습니다. 여기 방법이 있습니다.
return Observable.fromPromise(new Promise((resolve, reject) => {
// let formData: any = new FormData();
xhr.onreadystatechange = function () {
if (xhr.readyState === 4) {
if (xhr.status === 200) {
resolve(JSON.parse(xhr.response));
} else {
reject(xhr.response);
}
}
}
xhr.open("POST", baseUrl, true);
xhr.send(body2);
}));
도움말 :( 그리고 감사합니다.
만약 그것이192.168..추가해야 하는 URL 유형http://또는https://그 앞에또한 서버 측에서 CORS 옵션을 활성화해야 할 수도 있습니다.
저의 경우 누락에서 언급된 서버 쪽이 아닌 클라이언트 쪽에서 http 요청 URL을 수정하여 해결할 수 있었습니다.http://부터localhost.
내 문제는, 내 요청으로.this.http.get(this.domain + '/api/prod/' + id).map(res => res.json())
나는 a를 놓치고 있었습니다./의 정면에서api.그럴 것 같네요./api
localhost를 사용하는 경우 localhost 앞에만 http://를 사용합니다.
이 오류가 발생할 수 있는 또 다른 상황은 인터셉트를 사용하여 기본 경로를 설정하는 경우입니다.다음과 같은 것이 있습니다.
@Injectable()
export class WithCredentialsInterceptor implements HttpInterceptor {
constructor(private logger: LoggingService) {
}
intercept(request: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
// one way is to except / include only some urls by checking request.url
const clonedRequest = request.clone({
withCredentials: true
});
// this.logger.logTrace("Sending with credentials request: ", request.urlWithParams);
return next.handle(clonedRequest);
}
}
이 인터셉터가 전체 http/https URL에 대한 요청이 http 클라이언트에 제공될 때 실행되면 잘못된 URL이 생성됩니다.
해당 메서드가 작동하지 않으면 문자열에서 숨겨진 문자를 찾습니다.
그래서 저의 경우에는 이것이 신비로웠습니다.저는 웹사이트에서 제 URL을 복사했는데 숨겨진 문자도 문자열로 복사되어 시각적으로 보이지 않습니다.
"http://localhost:3000/addresses/create" // bad url
"http://localhost:3000/addresses/create" // good url
믿을 수 없어요?브라우저 콘솔에서 사용해 보십시오.
"http://localhost:3000/addresses/create" === "http://localhost:3000/addresses/create"
// => false
바로 여기 끈에 신비한 문자가 있습니다.
"http://localhost:3000/addresses/create"
// ^==> we have a hidden character here.
이를 느끼려면 URL을 편집기에 복사하고 오른쪽 화살표를 사용하여 왼쪽에서 오른쪽으로 이동합니다.표시된 위치에서 오른쪽 화살표 키를 한 번 더 눌러야 합니다.
참고로 숨겨진 문자는 다음 따옴표 안에 있습니다.''
가능한 시나리오:
api 형식이 올바르지 않습니다. 예를 들어 http:localhost:8080/이어야 합니다.
당신의 api에는 CORS가 활성화되어 있지 않아 당신의 요청을 수락하지 않고 있습니다.
마지막에 / 문자가 누락되었습니다. 저의 경우 http:localhost:8080이 있었고 마지막에 / 문자가 누락되어 작동하지 않았습니다.
https 대신 http를 사용하거나 그 반대입니다.
api에서 자격 증명에 대한 요청을 잘못 생성하고 있습니다. 프론트엔드 부분의 요청 코드에 오류가 발생할 수 있습니다(각도, 대응, ...).
POSTMAN을 사용하려고 시도하고 이 오류가 발생하는 사람들을 위해.그들이 사용하고 있는 URL을 확인해 주세요.해당 URL을 복사하여 메모장에 붙여 확인합니다.
제 경우 다른 곳에서 메소드 이름을 복사할 때 공간이 있어서 우체부가 제대로 표시하지 않았습니다.제가 공간을 제거한 후에는 잘 작동했습니다.
에 api가 나의경, api 이를에 '/'이기 하여 이 했습니다.const url = environment.api + 'api/relay';는 로바습니다꿨으로 바꿨습니다.const url = environment.api + '/api/relay';
그리고 그것은 동작한다.
음, 나는 변했어요.'"URL 예제에 있습니다.
'GET', environment.apiEndpoint + '/xxx/api/v1/xxx'`
로.
"GET", environment.apiEndpoint + "/xxx/api/v1/xxx"
제 경우에는 Axios를 사용하고 있었고 메소드 이름에는 공백이 있었습니다.
method: 'POST '
빈 공간을 삭제해야 했습니다.
method: 'POST'
언급URL : https://stackoverflow.com/questions/42461174/angular-2-failed-to-execute-open-on-xmlhttprequest-invalid-url
'source' 카테고리의 다른 글
| SSH 키를 제거하려면 어떻게 해야 합니까? (0) | 2023.06.26 |
|---|---|
| API 'variant.getExternalNativeBuildTasks()'가 더 이상 사용되지 않으며 'variant.getExternalNativeBuildProviders()'로 대체되었습니다. (0) | 2023.06.26 |
| 카운트(*) "열"에서 별칭을 사용하고 have 절에서 참조할 수 없는 이유는 무엇입니까? (0) | 2023.06.26 |
| Ruby on Rails에서 Gemfile과 Gemfile.lock의 차이점은 무엇입니까? (0) | 2023.06.26 |
| Azure VM의 성능이 매우 느림 (0) | 2023.06.06 |