ionicを勉強しているものです。
HttpClientを使ってPOSTメソッドでphpを呼び出してDBアクセスをやりたいのですがphpファイルが見つからないというエラーが
解決できず困っています。
処理の流れ:
Twitterログインボタンを押して認証が成功したらDBアクセスを行う。
login.html
html
1<ion-header> 2 <ion-navbar> 3 <ion-title>Twitterログイン</ion-title> 4 <ion-buttons end> 5 <button ion-button icon-only color="danger" *ngIf="(user | async)?.uid" (click)="logout()"> 6 <ion-icon name="log-out"></ion-icon> 7 </button> 8 </ion-buttons> 9 </ion-navbar> 10</ion-header> 11 12<ion-content padding> 13 <h2 style="margin: 100px 0 20px;">Twitterログイン</h2> 14 <button ion-button block (click)="login()"> 15 <ion-icon name="logo-twitter" style="font-weight: bold; margin-right: 10px;"></ion-icon>Twitterログイン 16 </button> 17 <br> 18 <br> 19 <ion-list> 20 <ion-list-header> 21 ユーザー情報 22 </ion-list-header> 23 <ion-item>ID:{{ (user | async)?.uid }}</ion-item> 24 <ion-item>名前:{{ (user | async)?.displayName }}</ion-item> 25 </ion-list> 26 27 <button ion-button block (click)="logout()"> 28 <ion-icon name="logo-twitter" style="font-weight: bold; margin-right: 10px;"></ion-icon>Twitterログアウト 29 </button> 30 31 32</ion-content> 33
login.ts
typedScript
1 2import { Component } from '@angular/core'; 3import { IonicPage, NavController, NavParams } from 'ionic-angular'; 4 5import { Observable } from 'rxjs/Observable'; 6import { AngularFireAuth } from 'angularfire2/auth'; 7import { HttpClient, HttpParams } from '@angular/common/http'; 8import * as firebase from 'firebase/app'; 9 10import { IndexPage } from '../../pages/index/index'; 11 12@IonicPage() 13@Component({ 14 selector: 'page-login', 15 templateUrl: 'login.html', 16}) 17export class LoginPage { 18 user: Observable<firebase.User>; 19 20 constructor( 21 private http: HttpClient, 22 public navCtrl: NavController, 23 public navParams: NavParams, 24 public afAuth: AngularFireAuth 25 ) { 26 this.user = afAuth.authState; 27 } 28 29 ionViewDidLoad() { 30 console.log('ionViewDidLoad LoginPage'); 31 } 32 33 // ログイン処理 34 login() { 35 36 const data = new HttpParams().set('user', 'khaled').set('pass', 'khaled'); 37 38 this.afAuth.auth.signInWithPopup(new firebase.auth.TwitterAuthProvider()).then(authData => { 39 40 this.http.post("http://localhosot:8100/pages/login/login.php", data, {headers:{'Content-Type': 'application/json'}}).subscribe(data => { 41 alert('ok'); 42 }, error => { 43 alert(JSON.stringify(error)); 44 }); 45 46 47 }).catch(function (error) { 48 alert("ログインできませんでした。"); 49 }); 50 } 51 52 // ログアウト処理 53 logout() { 54 // this.afAuth.auth.signOut(); 55 this.afAuth.auth.signOut().then(success => { 56 alert("ログアウト成功"); 57 }).catch(function (error) { 58 alert("ログアウトできませんでした。"); 59 }); 60 } 61} 62 63
login.php
php
1<?php 2/* 内部文字エンコーディングをUTF-8に設定 */ 3mb_internal_encoding("UTF-8"); 4 5/* リクエストを受信できるかテスト */ 6$date = array('message'=>"received!"); 7$date["msg"]="Post OK"; 8echo json_encode($date); 9 10?> 11
動かしてみた感じですとpostに指定するURLに誤りがあると思うので「ionic httpclient post php」のキーワードで
検索してみましたが参考になるソースコードや情報が見つかりませんでした。
ionicにお詳しい方がいましたらご回答いただけないでしょうか?
よろしくお願いいたします。
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。