勉強したことのメモ

Webエンジニア / プログラマが勉強したことのメモ。

PHPでAPIを作成しJavaScript(jQuery無し)からリクエストする方法

  PHP JavaScript

管理画面等から何らかのデータをMySQLに登録し、そのデータをPHPで作成したAPIでJSON形式にて出力させたい。また、そのAPIにはJavaScript(jQuery無し)でリクエストし、戻り値によって処理を分岐させたい。以下に方法をメモ。

 

PHP側

管理画面等からMySQLにデータを登録したり、MySQLからデータをひっぱってくるのは普段から行う手順なので今回は無し。

識別子(uid)があれば「識別子・リクエスト日時・ステータス(true)」を返し、なければ「ステータス(false)」をJSON形式で返す簡単なAPIを作成する。以下ソースコード。

<?php
$respons['status'] = false;

if( $_GET['uid'] ){
	$respons['uid'] = $_GET['uid'];
	$respons['date'] = date('Y-m-d H:i:s');
	$respons['status'] = true;
}

header("Access-Control-Allow-Origin: *");

echo json_encode($respons);

 

JavaScript側

<script>
const request = new XMLHttpRequest();

request.open('GET', 'http://test.com/api.php?uid=1', true); //URLは適宜変更する

request.onload = function () {
	const data = this.response;
	const json = JSON.parse(data);

	//API側で正常に処理されている場合
	if( json.status ){

		console.log(json); //Object { status: true, uid: "1", date: "2021-03-19 19:19:20" }

	//API側でエラーが発生した場合
	}else{

	}
};

request.send();
</script>

 

所感

今回はMySQL関連の処理を省いたが、実際に導入する際は「識別子が数値かどうか」等のチェックを入念に行う必要がありそう。

また、API側のエラー時に原因究明をしやすいよう、エラーコードも返す方が良さそう。

 - PHP JavaScript

  関連記事

AndroidのChromeでハマった点
AndroidのChromeでハマった点

Nexus7(Android4.3)のChromeでハマった。 iPhoneやG ...

Video.jsでテーマを指定して動画プレイヤーのデザインを変更する方法
Video.jsでテーマを指定して動画プレイヤーのデザインを変更する方法

Video.jsで動画プレイヤーのデザインを変更したい。調べたところWordPr ...

jQueryの日付&時間のピッカー(bootstrap-datetimepicker)について
jQueryの日付&時間のピッカー(bootstrap-datetimepicker)について

日付のピッカーはよく見るけど、時間のピッカーはあまり見ないので、普通のセレクトメ ...

jQueryのトースト(通知)用ライブラリ「iziToast.js」の利用方法
jQueryのトースト(通知)用ライブラリ「iziToast.js」の利用方法

システム構築の際、エラー表示をJavaScriptのアラートではなくトースト(通 ...

JavaScriptでオブジェクトのキーに変数を指定する方法
JavaScriptでオブジェクトのキーに変数を指定する方法

JavaScriptでオブジェクトのkey及びvalueに変数を指定したかった。 ...