こんにちは、技術部のTです。
今回は、「ajax」や「非同期通信」の具体的な使い方を書かせていただきます。
言葉の意味や使用されている技術、仕組みについては、前回私が担当したブログ（6月15日）を参考にしてみてください。
目次
- はじめに
- ajax通信かの判断
- POST送信かの判定
- 意図した処理かの判定
- おわりに
参考
1. はじめに
今回は、下記の3つの判定について書いて行きます。
- ajax通信か
- POST送信か
- 意図した処理か（ex. 保存処理、削除処理など）
上記の判定を入れることで、不正リクエストの防止や処理の分岐に役立てることができます。
2. ajax通信かの判断
ajax通信か判断するには、レスポンスを受け取る側に以下のコードを記載します。
```
if(isset($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') {
// Ajax からのリクエストに対する処理
} else {
// Ajax ではない場合の処理
}
```
ajax通信の場合、「HTTP_X_REQUESTED_WITH」という環境変数が用いられます。
jqueryなどのライブラリを使うと、この環境変数に「XMLHttpRequest」が設定されるため、ajax通信かの判断ができるのですね。
※Javascriptで書く場合、自身でこの環境変数に値をセットする必要があります。
3. POST送信かの判定
POST送信か判定したい場合は、$_SERVER['REQUEST_METHOD']を使用します。
リクエストを送信する際に、設定される環境変数ですね。
```
if($_SERVER["REQUEST_METHOD"] == "POST"){
// POST送信された場合の処理
}
```
ちなみに、GET送信かを判定したい場合は、POSTをGETにすればOKです。
4. 意図した処理かの判定
リクエストを受け取るファイルに、新規追加、更新、削除、検索など複数の処理を書く場合があると思います。
その際、「このリクエストはどの処理？」という判定が必要になりますよね。
まず、リクエストを送信する際、パラメーターのdataにmodeという変数を設定します。
例えば、
| 番号 | 処理 |
|---|---|
| 0 | 新規追加 |
| 1 | 更新 |
| 2 | 削除 |
| 3 | 検索 |
と定義するとし、
```
(～略～)
data : {
mode : 1,
}
(～略～)
```
と設定します。
次に、リクエスト受け取る側に下記のコードを書けば、
```
// dataを変数に代入
$post = $_POST['data'];
if(isset($post['mode'])){
if($post['mode'] == 0){
// 新規追加処理
}
if($post['mode'] == 1){
// 更新処理
}
if($post['mode'] == 2){
// 削除処理
}
if($post['mode'] == 3){
// 検索処理
}
}
```
それぞれのリクエストごとの処理の判定を行うことが可能です。
5. おわりに
最後までお読みいただきありがとうございます。
今回も引き続き、「ajaxでの非同期通信」について書かせていただきました。
初めてajaxを使おうとした際、とても混乱したことを覚えています。このブログで少しでも理解が深まれば嬉しいです！
関連記事
- 2023-09-11
- テクノロジー