使用asp.net web api验证Ionic 2应用程序

Question

我使用ASP.net Web API 2作为我的后端和Ionic 2应用程序作为我的前端。

我在使用Microsoft的UserStore Manager验证我的应用程序。

它使用基于令牌的身份验证（请原谅我，如果我使用了错误的命名，我还是新手。）

我能够通过Postman获得一个令牌，然后在请求标题中使用此令牌，如此＆＃34; Bearer [token]＆＃34;从我的Web api获取任何数据。

如您所见，方法是帖子，内容类型是x-www-form-urlencoded。

执行此操作会生成一个access_token然后我将此标记用于我的标题中以获取我需要的内容。

在我的Ionic App中，我使用名为login（）

的公共方法创建了一个auth-service.ts

  public login(credentials) {
if (credentials.username === null || credentials.password === null) {
  let error = this.alertController.create({
    title:'Lol',
    message:'incomplete credentials, Fill them up and come back',
    buttons: ['ok']
  });

  error.present();
}
else {
  return new Promise(resolve => {
    this.http.post(`${this.baseUrl}/token`,
    {
      grant_type:'password',
      username:credentials.username,
      password:credentials.password
    }).map(res => console.log(resolve(res.json())));
  });
}

}

以下是circle.ts中的代码，它调用此方法：

  login(){
let credentials = {
  username:"01286220336",
  password:"P@$$w0rd"
}
this.authService.login(credentials)
.then(data => console.log(data))
.catch(data => console.log(data));

}

我的问题是当我在Circles中调用登录方法时，没有任何反应我不知道为什么。我已经尝试了2个星期，但我只是放弃了。

此外，我不确定我是否正在authservice.ts中实现登录方法。

最后我只需要以某种方式获得这个令牌，如果有人能以正确的方式让我感到非常感激!!

Answer 1

尝试使用以下代码替换else部分。

else{
    let authObject = "username=xxxx&password=xxxx&grant_type=password";
    let headers = new Headers({ 'Content-Type': 'application/x-www-form-urlencoded' });
    headers.append('Accept', 'application/json');
    let options = new RequestOptions({ headers: headers });
    return this.http.post(this.baseUrl + '/token', authObject, options)
      .toPromise()
      .then(res => {
           alert(JSON.stringify(res.json(), null, 4));
      });
}