Angular 2未能在XMLHttpRequest上执行open:无效URL

我尝试调用一个服务，它在DHC中工作，但当我尝试调用angular 2项目时，它崩溃了，方法请求是POST，从body接收一个对象，该对象具有电子邮件和密码，响应是一个令牌，我将在整个项目中使用该令牌进行授权

这是我的密码

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}`)
       );
  }
}

我尝试从angular 2中实现XMLHttp请求调用，但错误是相同的，我不知道是否可以在angular 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选项。

如果你使用localhost，那么只在你的localhost之前使用http://在我的情况下，我可以通过修复我的http请求的url来解决它从

localhost

中缺少

http://

中提到的echonax，从客户端而不是服务器端读取rom

我的问题是，在我的请求中

this.http.get（this.domain+'/api/prod/'+id）.map（res=>res.json（））

我在

api

的正面缺少了一个

/

。这应该是

/api

可能的情况：

您的api格式不正确，例如：http:localhost:8080/

在您的api中，您没有启用CORS，因此它不接受您的请求

您在结尾缺少了/字符，在我的例子中，我有http:localhost:8080，由于结尾缺少/而无法工作

您使用的是http而不是https，或者相反

您在api中创建的凭据请求不正确，这可能是由于前端部分（angular、react等）的请求代码错误造成的

---

发生此错误的另一个上下文是使用拦截器设置基本路径时。类似于以下内容：

@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);
  }
}

@Injectable（）
带有CredentialsInterceptor的导出类实现HttpInterceptor{
构造函数（专用记录器：LoggingService）{
}
拦截（请求：HttpRequest，下一步：HttpHandler）：可观察{
//一种方法是通过检查request.url来除去/仅包括一些url
const clonedRequest=request.clone({
证书：正确
});
//this.logger.logTrace（“使用凭据发送请求：”，request.urlWithParams）；
返回next.handle（clonedRequest）；
}
}

---

如果向http客户端提供对完整http/https url的请求时触发此侦听器，它将构造一个无效url。

对于那些试图使用POSTMAN并出现此错误的人。请检查他们正在使用的url。复制该url并粘贴到记事本中进行检查

---

在我的例子中，当我从其他地方复制我的方法名时，它上面有空格，而postman没有正确显示我。一旦我删除了空格，它就可以正常工作。

如果上述方法都不起作用，请在字符串中查找隐藏字符

所以在我的例子中，这很神秘。我从一个网站复制了我的url，但是一个隐藏的字符也用字符串复制了，这是不可见的

”http://localhost:3000​/地址​/创建“//错误url”
"http://localhost:3000/addresses​/创建“//好的url”

难以置信？在浏览器控制台中尝试此操作

”http://localhost:3000​/地址​/创建“==”http://localhost:3000/addresses​/创建“
//=>错误

字符串中有一个神秘的字符：

”http://localhost:3000​/地址​/创建“
//^==>这里有一个隐藏字符。

要感觉到它，请将url复制到编辑器中，然后使用右箭头从左向右导航。在显示的位置，您必须再按一次右箭头键

---

作为记录，隐藏字符位于以下引号内：

'​'
在我的例子中，我通过在api之前添加“/”解决了这个问题
最初它是
consturl=environment.api+'api/relay'；
我改为
consturl=environment.api+'/api/relay'；

如果它是
192.168..
类型的url，你是否尝试在它前面添加
http://
或
https://
？如果是，你正在进行跨域请求，需要在服务器端启用CORS选项。你是个天才，谢谢！这方面我是新手。哈哈，没问题。我会提供答案。