source

Angular 2 XMLHttpRequest에서 열기를 실행하지 못했습니다.잘못된 URL

itover 2023. 6. 26. 22:31
반응형

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을 편집기에 복사하고 오른쪽 화살표를 사용하여 왼쪽에서 오른쪽으로 이동합니다.표시된 위치에서 오른쪽 화살표 키를 한 번 더 눌러야 합니다.

참고로 숨겨진 문자는 다음 따옴표 안에 있습니다.'​'

가능한 시나리오:

  1. api 형식이 올바르지 않습니다. 를 들어 http:localhost:8080/이어야 합니다.

  2. 당신의 api에는 CORS가 활성화되어 있지 않아 당신의 요청을 수락하지 않고 있습니다.

  3. 마지막에 / 문자가 누락되었습니다. 저의 경우 http:localhost:8080이 있었고 마지막에 / 문자가 누락되어 작동하지 않았습니다.

  4. https 대신 http를 사용하거나 그 반대입니다.

  5. 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

반응형