Angular$HTTP响应SyntaxError:意外的令牌E

Angular $HTTP response SyntaxError: Unexpected token E

本文关键字：意外 令牌 SyntaxError HTTP 响应 Angular      更新时间：2023-09-26

使用Angular$HTTP服务进行简单的POST调用：authService.login=函数（用户名、密码）{var凭据='username='+username+'&'+'password='+密码；

        return $http({
            method: 'POST',
            url: href,
            headers: {'accept': acceptValue, 'content-type': contentType},
            data: credentials
        }).then(onSuccess, onError);
    };

无法获取错误状态，而是获取SyntaxError:意外的令牌E。控制台首先显示状态401，并且紧接在解析错误之后。想知道它在引擎盖下做什么，它试图解析什么，以及为什么我无法使error.status正常工作。

问题可能在于如何序列化数据。您可以尝试将它们作为对象直接传递到data中，而不是自己构建字符串：

data: {username: username, password: password}

Angular应该自己序列化数据对象中的信息。

如果这不起作用，Angular还有一个内置的替代默认序列化程序，它模仿了jQuery中的序列化程序。上面的文件在这里。您使用此方法的请求看起来像：

            $http({
                url: "/auth/login",
                method: "POST",
                headers: {"Content-Type": "application/x-www-form-urlencoded"},
                data: $httpParamSerializerJQLike({
                    email: email,
                    password: password
                })
            })

如果使用此选项，请不要忘记将$httpParamSerializerJQLike作为依赖项注入。

您的请求似乎被正确发送并收到了响应。

我尝试了一个返回401状态代码的RESTful服务。这是我的JavaScript代码：

var href = 'https://contactsapi.apispark.net/v1/contacts/';
var acceptValue = 'application/json';
var contentType = 'application/json';
var credentials = {}; //'something';
function onSuccess(data, status, headers, config) {
}
function onError(data, status, headers, config) {
  console.log('data = '+JSON.stringify(response, null, 2));
}
$http({
    method: 'POST',
    url: href,
    headers: {'accept': acceptValue, 'content-type': contentType},
    data: credentials
    }).then(onSuccess, onError);

在我的情况下，响应对象包含以下内容：

{
  "data": {
    "code": 401,
    "contactEmail": null,
    "description": "The request requires user authentication",
    "homeRef": "/",
    "reasonPhrase": "Unauthorized",
    "uri": "http://www.w3.org/Protocols/rfc2616/rfc2616-sec10.html#sec10.4.2"
  },
  "status": 401,
  "config": {
    "method": "POST",
    "transformRequest": [
      null
    ],
    "transformResponse": [
      null
    ],
    "url": "http://localhost:8182/contacts/",
    "headers": {
      "accept": "application/json",
      "content-type": "application/json"
    },
    "data": {}
  },
  "statusText": "Unauthorized"
}

可以帮助您的是查看响应内容（头/负载）。例如，如果有效载荷是JSON有效载荷，则Content-Type报头的值。也许在响应的Content-Type和实际内容之间存在差距。例如，您收到的纯文本内容的内容类型值为application/json。

我做了一个测试来模拟这种情况（内容类型为application/json的XML内容），我有以下错误：

SyntaxError: Unexpected token <
  at Object.parse (native)
  at vc (https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js:15:480)
  at Zb (https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js:82:229)
  at https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js:83:143
  at m (https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js:7:322)
  at dd (https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js:83:125)
  at d (https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js:84:380)
  at https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js:119:113
  at n.$eval (https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js:133:221)
  at n.$digest (https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js:130:233)

Angular试图解析JSON内容，但由于其格式不正确，因此无法解析，并引发错误。

这似乎与你的错误相似。所以我认为问题不在于Angular应用程序，而在于服务器。。。

希望它能帮助你，Thierry

相关文章：