web-dev-qa-db-ja.com

Angular 4 Http POST動作していません

みんながうまくやってくれていることを願っています。私は最近angular 4.4で作業を開始しました。APIサーバーにデータを投稿しようとしましたが、残念ながら機能していません。そして、すでに angular.io からでも6-7の記事を試しました。私は両方を試しました Http および Httpclient モジュールですが、何も機能していないようです。

問題は、サーバーにデータを投稿しようとするたびにAngularがhttp[〜＃〜] options [〜＃〜][〜＃〜] post [〜＃〜]の代わりにリクエストを入力します。

this.http.post('http://myapiserver.com', {email: '[email protected]'}).subscribe(
    res => {
        const response = res.text();
    }
);

また、リクエストでカスタムオプションを送信しようとしましたが、それでも成功しませんでした。

const headers = new Headers({ 'Content-Type': 'x-www-form-urlencoded' });
const options = new RequestOptions({ headers: headers });
options.method = RequestMethod.Post;
options.body = {name: 'Adam Smith'};
//options.body = JSON.stringify({name: 'Adam Smith'}); // i also tried this
//options.body = 'param1=something&param2=somethingelse'; // i also tried this

私はASP.NETコア2.0を使用していましたが、動作していなかったため、簡単なPHPコードも試してみました。PHP用のサーバーサイドコードはこちらです。また、機能していません。

<?php
print_r($_POST);
?>

注：サーバーでCorsも有効になっています。さらに、単純なgetリクエストも試してみましたが、正常に機能します。

私はいくつかの助けに本当に感謝します。

前もって感謝します

javascriptangularhttp-postangular-httpangular-httpclient
6
Osama Sheikh

Content-Typeをapplication/x-www-form-urlencodedに設定することで解決しました：

  const headers = new Headers({ 'Content-Type': 'application/x-www-form-urlencoded' });
  const options = new RequestOptions({ headers: headers });
  const params = new URLSearchParams();
  params.append('mypostField', 'myFieldValue');
  http.post('myapiendpoint.com', params, options).subscribe();
7
Osama Sheikh

postメソッドの3番目の引数としてヘッダーを渡そうとしましたか？

this.http.post('http://myapiserver.com', JSON.stringify({name: 'Adam Smith'}), { headers: new Headers({ 'Content-Type': 'application/json' }) }).subscribe(
    res => {
        const response = res.text();
    }
);

必ず@ angular/httpからヘッダーをインポートしてください

2
JayDeeEss

私は同じ問題を抱えていて、私はこのように使用しました（FormDataを使用して）試してみてください。それは私のために働く。

let formdata = new FormData();
formdata.append('email', '[email protected]');

this.http.post('http://myapiserver.com', formdata).subscribe(
    res => {
        const response = res.text();
    }
);
1
Reshan Pubudu

import @ HttpClient、HttpHeaders} from '@ angular/common/http'; 'rxjs'から{Observable}をインポートします。

saveGame(route,game):Observable<any>{

  let json = JSON.stringify(game);
        let params = 'json=' + json;

  let headers = new HttpHeaders().set('Content-Type', 'application/x-www-form-urlencoded');
  return this.http.post(this.URL + route, params, { headers: headers });

}
0
Ferdys Duran