使用Ionic 2进行POST调用 [英] POST calls with Ionic 2

问题描述

我一直在努力实现对Ionic 2的ASP.NET API的POST调用。我在一个有用的指南的帮助下管理了一个GET，但是我找不到任何类似的POST，直到我看到了一段YouTube视频。在该视频的帮助下，我在我的提供商中使用了这种方法：

I've been struggling a bit with implementing a POST call to an ASP.NET API with Ionic 2. I managed a GET with the help of a useful guide, but I couldn't really find anything similar for POST, until I came across a YouTube video. With the help of that video, I have this method in my provider:

 backendlogin() {
  if (this.data) {
      return Promise.resolve(this.data);
  }

  return new Promise(resolve => {
      var json = JSON.stringify({ email: '[e-mail]', password: 'root' });
      var params = 'json=' + json;
      var headers = new Headers();
      headers.append('Content-Type', 'application/json');

      this.http.post('http://insertipadresshere/api/login',
          params, {
              headers: headers
          })
          .map(res => res.json())
          .subscribe(data => {
              this.data = data;
              resolve(this.data);
          },
          error => alert(error),
          () => console.log("Finished")
      );
  });
}

我的GET方法基本上是Ionic在创建提供程序时提供的。它们与此代码类似，除了声明变量并附加标题的部分，以及http.get而不是post。

My GET methods are basically what was provided by Ionic when creating the provider. They are similar to this code, except for the part where the variables are declared and the headers are appended, as well as http.get instead of post of course.

这是我用来从页面控制器调用提供者功能的函数：

This is the function I use to call the function of the provider from the controller of the page:

setuplogin() {
    this.backend.backendlogin()
        .then(data => {
            this.data = data;
        });
    console.log(this.data);
} 

现在问题。如果我理解了所有内容，那么backendLogin（）应该显示一个警告，如果出现故障就会出错。警报显示[object Object]。控制台中唯一的东西是空日志，可能来自setupLogin（），因为数据是空的。 api应该使用电子邮件地址和密码并返回uID。任何人都能指出我正确的方向吗？

Now on to the issue. If I understand everything, backendLogin() should display an alert with the error if something fails, which it does. The alert says "[object Object]". The only thing in the console is an empty log, presumably from setupLogin() because data is empty. The api should take an email adress and a password and return a uID. Can anyone point me in the right direction?

推荐答案

如果出现错误，我会拒绝承诺：

I would reject the promise if there is an error:

return new Promise((resolve,reject) => {
  var json = JSON.stringify({ email: '[e-mail]', password: 'root'});
  var params = 'json=' + json;
  var headers = new Headers();
  headers.append('Content-Type', 'application/json');

  this.http.post('http://insertipadresshere/api/login',
      params, {
          headers: headers
      })
      .map(res => res.json())
      .subscribe(data => {
          this.data = data;
          resolve(this.data);
      },
      error => reject(error),
      () => console.log("Finished")
  );
});

这就是说，我认为没有必要创建原始承诺。您利用observables的 toPromise 方法：

That said, I don't think that it's necessary to create a raw promise. You leverage the toPromise method of observables:

var json = JSON.stringify({ email: '[e-mail]', password: 'root'});
var params = 'json=' + json;
var headers = new Headers();
headers.append('Content-Type', 'application/json');

return this.http.post('http://insertipadresshere/api/login',
      params, {
          headers: headers
      })
      .map(res => res.json())
      .toPromise();
);

获取错误

setuplogin() {
  this.backend.backendlogin()
    .then(data => {
        this.data = data;
        console.log(this.data);
    }, error => {
      // do something
    });
} 

要完成，你可以直接使用observable而不是返回一个promise： / p>

To finish, you could directly use the observable rather than returning a promise:

var json = JSON.stringify({ email: '[e-mail]', password: 'root'});
var params = 'json=' + json;
var headers = new Headers();
headers.append('Content-Type', 'application/json');

return this.http.post('http://insertipadresshere/api/login',
      params, {
          headers: headers
      })
      .map(res => res.json());
);

并在 setupLogin 方法中订阅：

setuplogin() {
  this.backend.backendlogin()
    .subscribe(data => {
        this.data = data;
        console.log(this.data);
    },
setuplogin() {
  this.backend.backendlogin()
    .subscribe(data => {
        this.data = data;
        console.log(this.data);
    }, error => {
        // do something with error
    });
} 

这篇关于使用Ionic 2进行POST调用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！