javascript - 移动设备上的对象 XMLHttpRequestProgressEvent 错误(Ionic、node.js)

Question

我有一个 node.js 和 Ionic( Angular )应用程序，当我尝试从手机进行 API 调用时，我收到此错误 -> object XMLHttpRequestProgressEvent

我正在为我的 Ionic 应用程序提供服务，就像这样 ionicserve --address=10.0.0.107。

仅在电话上，它不适用于客户端的每个调用，当我从桌面调用电话时，一切都很好。

这是来自 auth.service.ts 的登录部分

  loginUser(u: User): Observable<any> {
    const url = `${this.baseUrl}/auth`;
    const body = { username: u.username, password: u.password };

    // When you want to send a cookies with requests,
    // you have to put "withCredentials: true" into request option
    return this.http.post(url, body, this.noAuthOptions);
  }

这是我的选择:

 private readonly baseUrl = "http://localhost:3000";
 private readonly contentType = { "Content-Type": "application/json" };
 private readonly noAuth = { "No-Auth": "True" };

 private readonly header = new HttpHeaders(this.contentType);
 private readonly noAuthHeader = new HttpHeaders({
    ...this.contentType,
    ...this.noAuth
  });

 private readonly options = { headers: this.header, withCredentials: true };
 private readonly noAuthOptions = {
    headers: this.noAuthHeader,
    withCredentials: true
  };

这是我在 github 上的代码(前端)https://github.com/TenPetr/dashboard 和后端部分:https://github.com/TenPetr/dashboard_backend

您知道为什么会发生这种情况吗？

感谢您的建议。

Answer 1

问题出在这一行:

private readonly baseUrl = "http://localhost:3000";

它可以在 PC 上运行，因为它通过主机文件(位于 C:\Windows\System32\drivers\etc\hosts)知道该地址

但是，移动设备本地没有此文件，因此无法解析网址。

您需要运行服务器并将 localhost 替换为您的 IP 地址。 https://ngrok.com/docs#getting-started