在 Post 方法上获得 401 Unauthorized [前端 - Angular 2 & 后端 - Cakephp 3]

Question

我在 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;
      }
    });
}

我得到的回应

Answer 1

您的问题是内容类型标头丢失或错误。

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

我认为，文字/疼痛也可能有效，但我自己没有使用它。

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