2017-01-09 3 views
0

Я создаю мобильное приложение для отображения новостей. В моем приложении вы должны иметь возможность опубликовать статус.Angular2 - Отправить запрос POST на сервер

Статус будет отправлен на сервер PHP с использованием метода POST.

Теперь моя проблема в PHP не может прочитать запрос POST, который я отправил с помощью углового2.

Это мой код:

form.html

<form class="sample-form post-form" [formGroup]="post_form" (ngSubmit)="createStatus()"> 
      <ion-item> 
       <ion-textarea rows="7" placeholder="What's happening?'" formControlName="status"></ion-textarea> 
      </ion-item> 
      <section class="form-section"> 
       <button ion-button block class="form-action-button create-post-button" type="submit" [disabled]="!post_form.valid">Post</button> 
      </section> 
      </form> 

form.ts

import { Component } from '@angular/core'; 
import { NavController, AlertController } from 'ionic-angular'; 
import { Validators, FormGroup, FormControl } from '@angular/forms'; 

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

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

    section: string; 

    post_form: any; 

    url: string; 
    headers: Headers; 

    constructor(public nav: NavController, public alertCtrl: AlertController, public http: Http) { 
    this.headers = new Headers(); 
    this.headers.append("Content-Type", "application/x-www-form-urlencoded"); 

    this.section = "post"; 


    this.post_form = new FormGroup({ 
     status: new FormControl('', Validators.required), 
    }); 
    } 

    createStatus(){ 
    console.log(this.post_form.value); 

    this.url = "https://domain.com/mobileREST/poststatus.php"; 

    this.http.post(this.url, this.post_form.value, { headers: this.headers}) 
     .map(res => res.json()) 
     .subscribe(res => { 
     console.log(res); 
     }, 
     err => { 
     console.log(err); 
     }) 
    } 
} 

poststatus.php

<?php 
header('Access-Control-Allow-Origin: *'); 
header('Content-Type: application/json'); 

$status = $_POST["status"]; 
echo json_encode($status); 
?> 

Firebug консоли: enter image description here

Возможно, я не могу найти здесь ошибку. Очень ценю вашу помощь

ответ

6

У меня была та же проблема. Вы не можете отправлять параметры POST, как объект javascript. Вы должны передать его, как URLSearchParams. Я сделал функцию, которая сделает это за вас. Он будет проходить через объект и сделать URLSearchParam и вернуть его как строку.

private _buildParams(params: any) { 
    let urlSearchParams = new URLSearchParams(); 

    for(let key in params){ 
     if(params.hasOwnProperty(key)){ 
      urlSearchParams.append(key, params[key]); 
     } 
    } 
    return urlSearchParams.toString(); 
} 

И тогда вы звоните HTTP POST:

this._http.post(this.url, this._buildParams(params), {headers: this.headers}); 
+0

Привет, новый угловатый пользователя здесь. Можете ли вы объяснить, почему вы использовали _ для частной переменной? Нужно ли (для _http и _buildParams)? – iWillGetBetter

+0

@iWillGetBetter Это необязательно, это просто соглашение, используемое для частных методов и переменных. –

0

Чтобы получить отправленные данные просто добавьте эту строку в PHP файле

// get posted data 
$data = json_decode(file_get_contents("php://input")); 
Смежные вопросы