web-dev-qa-db-ja.com

Ionic 2-Http POST body parameters not sent

Ionic 2 Beta 11。 本体情報を送信できません必須です。次の方法で本体変数をフォーマットしようとしましたが、それぞれ成功しませんでした:

オブジェクトとして:_{email: this.email, password: this.password}_

文字列化されたオブジェクトとして:JSON.stringify({email: this.email, password: this.password})

文字列として:_'email=' + this.email + '&password=' + this.password_

ここに私のコードがあります:

_import {Component}                                      from '@angular/core';
import {NavController, MenuController}                  from 'ionic-angular';
import {Http, Headers, RequestOptions}                  from '@angular/http';
import 'rxjs/Rx';

@Component({
  templateUrl: 'build/pages/login/login.html'
})
export class LoginPage {
  nav: NavController;    
  username: string;
  password: string;

  constructor(nav: NavController, private http: Http) {
    this.nav = nav;
  }

  doLogin() {
    let body = JSON.stringify({
      email: this.username,
      password: this.password });
    let headers = new Headers({
      'NDAPI-Key': 'XXXXXXXXXX',
      'NDAPI-Host': 'XXXXXXXXXXX' });
    let options = new RequestOptions({ headers: headers });

    this.http
        .post('/api', body, options)
        .map(res => res.json())
        .subscribe(
            data => {
              console.log(data);
            },
            err => {
              console.log("ERROR!: ", err);
            }
        );
  }
}
_
7
Ian Holden

私はちょうど私の問題の解決策を発見しました。タイプYのデータを送信していることをサーバーに伝えながら、タイプXのデータをサーバーに送信しようとしていました。次のコードを使用して問題:

import {Component}                                      from '@angular/core';
import {NavController}                                  from 'ionic-angular';
import {Http, Headers, RequestOptions}                  from '@angular/http';
import 'rxjs/Rx';

@Component({
  templateUrl: 'build/pages/login/login.html'
})
export class LoginPage {
  nav: NavController;

  username: string;
  password: string;

  constructor(nav: NavController, private http: Http) {
    this.nav = nav;
  }

  doLogin() {
    let body = new FormData();
    body.append('email', this.username);
    body.append('password', this.password);
    let headers = new Headers({
      'NDAPI-Key': 'XXXXXXXXX',
      'NDAPI-Host': 'XXXXXXXXX' });
    let options = new RequestOptions({ headers: headers });

    this.http
        .post('/api', body, options)
        .map(res => res.json())
        .subscribe(
            data => {
              console.log(data);
            },
            err => {
              console.log("ERROR!: ", err);
            }
        );
  }
}
4
Ian Holden

Ionic 2が初めてですが、長い検索の後、フォームデータオプションは以下のように機能しました

let headers = new Headers({ 'Content-Type': 'application/json' });
    let body = new FormData();
    body.append('username', username);
    body.append('password', password);
    console.log(body);
    console.log(headers);
    return this.http.post('http://api/v1/get_user',body,headers).map((res: Response) => res.json());
8
Ali Farhan

パラメータがPHPサーバーに投稿されないという同じ問題がありました。パラメータを生の形式に変更し(body変数に表示)、動作を開始しました。以下のサンプルコードを参照してください。

    let headers = new Headers({
        'Content-Type': 'application/x-www-form-urlencoded'
    });
    let options = new RequestOptions({
        headers: headers
    });
    // TODO: Encode the values using encodeURIComponent().
    let body = 'email=' + email + '&password=' + password;
5
Hasnat Safder

Angular2 Ionic 2 HTTP Postメソッド

import {Http, Headers } from '@angular/http';
import 'rxjs/add/operator/map';

@Component({
selector: 'page-home',
templateUrl: 'home.html'
})
export class HomePage {


constructor(public http:Http) { }


postCall()
{
let headers = new Headers();
headers.append('Content-Type', 'application/json');
let data=JSON.stringify({username:"raja"});
this.http.post('http://localhost/ionic/postResponse.php',data,headers)
.map(res => res.json())
.subscribe(res => {
alert("success "+res);
}, (err) => {
alert("failed");
});
}


}

詳細情報をご覧ください https://ampersandacademy.com/tutorials/ionic-framework-version-2/send-data-and-receive-data-in-the-ionic-2-framework-using-angular2- http-post-method

2
Bharathiraja