来自获取请求 Angular 2 的意外响应答案

【问题标题】：Unexpected Response From Get Request Angular 2来自获取请求 Angular 2 的意外响应
【发布时间】：2017-02-17 04:02:16
【问题描述】：

背景

Angular 2 应用程序正在我的本地主机上使用 PHP API。我知道我的 URL 端点设置正确，因为我使用 Postman 检查了它们。当我提出获取请求时，响应是我自己页面的 html。我得到一个成功代码 200 但响应错误，因为

错误

异常：JSON 中位置 0 处的意外标记

所以当我 console.log(res) 得到这个时，

// 我自己的 Angular 2 前端的 HTML。

"<!DOCTYPE html>↵<html>↵<head> etc...

我期待在回复中这样，

{
  "error": true,
  "api_key": false,
  "message": "User is registered in our database now use update api to fill other details"
}

问题

什么会导致响应保留我发出初始请求的页面中的我自己的 html？

代码示例

我的获取请求

  public checkRegister(model: LogReg) {
      // Parameters obj-
      let params: URLSearchParams = new URLSearchParams();
      params.set('email', model.email);
      params.set('email_verified', model.email_verified);
      //Http request-
      return this.http.get(STATICS.API_BASE + STATICS.API_LOGIN,
          { search: params }).map((res:Response) =>  res.json());
      }

这就是我处理响应的方式，

 // Login Or Register User On Our Server
        this.logreg = new LogReg(profile.email_verified, profile.email);
        this.checkRegister(this.logreg).subscribe((res)=>{
            console.log(res);
            if (profile.email_verified === false) {
                console.log(res);
                console.log("Check your email to verify your account!");
                this.logout(this.user);
            }

            else if (res.profile_exist === false) {
                console.log(res);
                this.router.navigateByUrl('/profile');

            } else if (res.profile_exist === true) {
                console.log(res);
                this.router.navigateByUrl('/overview');
            }
        });

【问题讨论】：

标签： angular

【解决方案1】：

res.json 是导致您看到回答问题的错误的原因。

res.json 正在尝试解析响应的有效负载，根据您的控制台判断要记录的响应根本不是 json。您可以将 res.json 包装在 try catch 中，以防止错误破坏您的应用程序继续前进。

您可能希望在开发工具中打开网络选项卡来触发获取请求，并验证您的请求是否发送了您期望的内容。此外，我怀疑如果您正在点击 API 调用来检查有效负载，您可能想要发送一个发布请求。

【讨论】：

这是我的 php api。它是 json。我向您展示的响应是来自我发送 get 请求的网页的 HTML。从字面上看，响应包含整个页面。不是 PHP 发送的响应，也不是我在 Postman 中检查 api 端点时显示的响应。
很可能无法发送到正确的端点。这就是为什么我建议您检查网络流量以验证其是否按预期进行。否则它可能会点击“/”，然后将页面返回给您。
我可以在节点控制台中检查它。 URL 正在完美构建。它与我在 Postman 中使用的具有相同参数的 URL 相同，但响应不是我期望的 JSON 响应。
Postman 是用于检查 api 端点的服务。如果你愿意，我可以把它的屏幕截图发给你。在这里，我将更新我的问题，待命
我每天都使用邮递员，我明白这一点。在chrome中，如果您按f12，它将打开开发工具，那里有一个网络选项卡。在查看该屏幕时触发获取请求，您应该会在其中看到获取请求。如果单击它，您可以了解更多关于正在发生的事情。 developer.chrome.com/devtools