Как вызвать api in ionic, используя почтовый запрос и передав 2 параметра?

Question

Я учусь называть api inicic для цели. и я не знаю, как правильно это назвать.

Я пытался назвать это, но это не удалось!

signin.ts

import { Component } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';
import { HTTP } from '@ionic-native/http'

@Component({
  selector: 'page-sign-in',
  templateUrl: 'sign-in.html',
})
export class SignInPage {

  private signinUrl:"*someurl*";

  email="";
  password="";

  constructor(public navCtrl: NavController, public navParams: NavParams,
  private http:HTTP) {
  }

  ionViewDidLoad() {
    console.log('ionViewDidLoad SignInPage');
  }

  signinClick(){
    this.callSignInApi(this.email,this.password);
  }

  callSignInApi(email:string,password:string){
    console.log('api email',email);
    console.log('api pass',password);

    let urlSearchParams = new URLSearchParams();
    urlSearchParams.append('username', email);
    urlSearchParams.append('password', password);

    this.http.post(this.signinUrl,urlSearchParams.toString(),{})
    .then(data => {

      console.log("data status",data.status);
      console.log("data data",data.data); // data received by server
      console.log("data headers",data.headers);

    })
    .catch(error => {

      console.error("catching error",error);
      console.log("error status",error.status);
      console.log("error error",error.error); // error message as string
      console.log("error headers",error.headers);

    });
  }

}

Каждый раз, когда я нажимаю на кнопку, чтобы вызвать API, это дает мне ошибку (но ошибка также равна нулю). Даже я не знаю, в чем ошибка.
Может кто-нибудь подсказать мне, как правильно вызывать api и как правильно передавать параметры.

Answer 1

Попробуйте преобразовать объект параметра в URI, а затем передать, как показано ниже в моем рабочем примере

this.http.post(this.signinUrl,this.formdata(urlSearchParams),{'Content-Type': 'application/x-www-form-urlencoded'})
.then(data => {
 // data received by server
})
.catch(error => {
// error message as string
});



/** Convert Object to parameter to send in http request (For not sending json object) */
 formData(myFormData) {
   return Object.keys(myFormData).map(function (key) {
     return encodeURIComponent(key) + '=' + encodeURIComponent(myFormData[key]);
 }).join('&');
}

Answer 2

Импорт из HTTP-пакета Angular.

import { Http } from '@angular/http';

и удаление toString () в случае запроса HTTP POST:

this.http.post(this.signinUrl,urlSearchParams).subscribe(
    data=>{
    ......
   },error=>{
    .....
   });

Answer 3

Попробуйте это:

let urlSearchParams  = {
      'username': email,
      'password': password
  };

this.http.post(this.signinUrl,urlSearchParams,{})
    .then(data => {
         // data received by server
     })
     .catch(error => {
         // error message as string
     });

надеюсь, это сработает! если нет, попробуйте использовать заголовки, такие как

this.http.post(this.signinUrl,urlSearchParams,{'Content-Type': 'application/x-www-form-urlencoded'})
.then(data => {
  // data received by server
})
.catch(error => {
  // error message as string
});

Answer 4

Вы можете использовать Http из @ angular / http и сделать правильный вызов API.

Сначала добавьте в app.module.ts:

import { HttpModule } from '@angular/http'; imports: [ .., HttpModule,

добавить свою страницу:

впрыскивать http: constructor(public http: Http,.....

вызов API:

this.http.post(this.signinUrl,urlSearchParams.toString(), {}).subscribe( data=>{ ...... },error=>{ ..... });