前回のチャートを追加できるようにする ガントチャートをWebアプリとしてつくる(7)ではチャートを追加しましたが、今回はチャートを削除します。
⇒ 動作確認はこちらから
ただし削除されては困るのでパスワードをかけています。なので削除の操作はできません。
チャートを削除するときは確認のダイアログを表示させます。OKが選択された場合だけ削除します。
削除するときには/delete-XXへPostしますが、このとき悪意をもったものによって変なところからPost送信がおこなわれ、チャートが削除されてしまう可能性があります。そこでPost送信元が同一ドメインで同一階層の pageedit-XXでなければ処理をしないようにしています。
task2.js
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 |
function DeleteChart(){ let check = confirm('このチャートを削除します。よろしいですか?'); if(!check) return; let obj = { Id: id, }; let jsonText = JSON.stringify(obj); let pathname = location.pathname; let last = pathname.lastIndexOf('-'); let id = pathname.substring(last +1); let post = `./delete-${id}`; xhr.open('POST', `./delete-${id}`, true); xhr.setRequestHeader('content-type', 'application/x-www-form-urlencoded;charset=UTF-8'); xhr.send(jsonText); xhr.onreadystatechange = function() { if (this.readyState == 4 && this.status == 200) window.location.href = `./`; }; } |
次にサーバーサイドでの処理を示します。Post送信元を確認して自サイトでなければ処理をしない工夫が必要です。それまらSQLiteのDBからデータを削除してもそのままではサイズは変更されません。一度大きくなってしまったものはなにもしないと大きくなったままです。そこでvacuumコマンドを実行してサイズダウンさせています。
index.php
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 |
function PostToDelete($id){ // $idをみればどれを削除するのかはわかるが、不正なアクセスでないことを確認するために // $contents["Id"]と$idが同じかどうか確認している $json = file_get_contents("php://input"); $contents = json_decode($json, true); if($contents == null || $contents["Id"] != $id){ echo '不正なリクエストです'; return; } global $table_pages; global $table_tasks, $db_path; $db = new PDO("sqlite:{$db_path}"); $taskTableName = GetTaskTableName($id); // テーブル削除 $sql = $db->prepare("drop table {$taskTableName}"); $sql->execute(); // table_pagesから一致するものを削除 $sql = $db->prepare("delete from ${table_pages} where id = ${id}"); $sql->execute(); $sql = $db->prepare("vacuum"); $sql->execute(); $db = null; } |