在 Post 方法上获取 401 Unauthorized [前端 - Angular 2 和后端 - Cakephp 3]答案

【问题标题】：Getting 401 Unauthorized on Post method [ Front end - Angular 2 & Back end - Cakephp 3]在 Post 方法上获取 401 Unauthorized [前端 - Angular 2 和后端 - Cakephp 3]
【发布时间】：2017-04-11 22:12:30
【问题描述】：

我在 Cakephp 3 中将 Angular 2 用于前端和后端。我在尝试登录时收到 401 Unauthorized 状态。我已经在 cakephp 3 中配置了 JWT，它在 POSTMAN 中运行良好。但不适用于 Angular。

这是我的 TypeScript 代码

loginToken(uname: string, pwd: string): Observable<boolean>{
  let json = JSON.stringify({ username: uname , password: pwd});
  let headers = new Headers();
  headers.append('Content-Type', 'application/json');
  headers.append('Accept', 'application/json');
  let options = new RequestOptions({ headers: headers });

  return this.http.post('http://localhost/crm/crm/api/users/token', json, options)
    .map((response: Response) => {
      let token = response.json() && response.json().token;
      if (token) {
        this.token = token;
        localStorage.setItem('currentUser', JSON.stringify({ username: uname, token: token }));
        return true;
      } else {
        return false;
      }
    });
}

Cakephp 3 代码 - 服务器端

public function token()
    {   
        $user = $this->Auth->identify();
        if (!$user) {
            throw new UnauthorizedException('Invalid username or password');
        }

        $this->set([
            'success' => true,
            'data' => [
                'token' => JWT::encode([
                    'sub' => $user['id'],
                    'exp' =>  time() + 604800
                ],
                Security::salt())
            ],
            '_serialize' => ['success', 'data']
        ]);

    }

这里有一些截图

请帮我解决这个问题。

删除选项后 -

loginToken(uname: string, pwd: string): Observable<boolean>{
  let json = JSON.stringify({ username: uname , password: pwd});
  let headers = new Headers();
  headers.append('Content-Type', 'application/x-www-form-urlencoded');
  let options = new RequestOptions({ headers: headers });

  return this.http.post('http://localhost/crm/crm/api/users/token', json, {headers: headers })
    .map((response: Response) => {
      let token = response.json() && response.json().token;
      if (token) {
        this.token = token;
        localStorage.setItem('currentUser', JSON.stringify({ username: uname, token: token }));
        return true;
      } else {
        return false;
      }
    });
}

我得到了回应

【问题讨论】：

看起来像是一个 CORS 问题，您需要在服务器上配置一些东西，或者标题中的一些东西不太正确。 developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS
是的，我确实有同样的感觉，但没有得到解决方案，有什么建议吗？
@NeerajRathod，你修好了它并且工作正常吗？我正在解决同样的问题。我正在尝试使用 cakephp 3.4.0 和 Angular 2 创建登录和注册功能。你能帮帮我吗？

标签： angular cors jwt cakephp-3.0

【解决方案1】：

您的问题是缺少或错误的内容类型标题。

对于登录不发送 OPTIONS 请求，您的内容类型应该是标准表单类型之一： application/x-www-form-urlencoded 或 multipart/form-data

我认为 text/pain 也可能有用，但我自己没有使用。

编辑：实际上有一个关于它的 SO：How to disable OPTIONS request?

【讨论】：

嗨 Vladimir M，我尝试过使用“Content-type :application/x-www-form-urlencoded”，但它不起作用，还有其他建议吗？
它仍然发送选项请求吗？如果仍然发送选项，您可能还想从请求中删除“接受”标头。
不，我已删除选项并使用 'Content-Type'、'application/x-www-form-urlencoded' 传递标头对象。
您能否使用来自开发工具的响应的最新屏幕截图进行更新。
我已经放了最新的回复截图，请浏览一下并分享一些建议等待