こんにちは、中の人です。
今回も前回の『AWS Supportをsdk for phpから使ってみた②』に引き続き、aws sdk for phpを使って、AWS Supportにケースの作成・閲覧・返信・クローズを出来るようにします。
複数のアカウントを管理している方やちょっとした問い合わせがしたい時にログインしないといけない手間がなくなるので、一部のユーザーには重宝します。
フロントをHTML5で実装し、ajaxでデータを呼び出すようにしています。
今回は第3回としてケースクローズとオープンを行います。
1. 既に登録済みのケースをクローズにします。
aws_ResolveCase.php
なお、ケースIDはケース一覧取得したものをGETで引き渡すものとします。
./aws_ResolveCase.php?case= case-***************
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 31 32 33 34 35 36 37 38 39 |
<?php # credentialファイルの呼び出し $credential_path = "./.aws/credentials"; if(!file_exists($credential_path)){ exit("定義ファイルがありません"); } # aws sdk for phpを呼び出し require_once("./vendor/autoload.php"); use Aws\Support\SupportClient; # credentialsのどちらかのユーザーを指定します。 $profile = "user1"; $client = SupportClient::factory(array( 'profile' => $profile, 'region' => 'us-east-1',// サポートはUS eastのみ )); $case = $_GET['case']; $client = SupportClient::factory(array( 'profile' => $profile, 'region' => 'us-east-1',// サポートはUS east以外NG )); # ケースが無い場合はエラー if(!$case){ echo "no case"; exit(); } $result = $client->ResolveCase(array( 'caseId' => $case, )); echo json_encode($result); exit(); |
上記を実行すると、ケースをクローズすることが出来ます。
2. 続いて新規ケースの作成についてです。
新規ケースを作成するには
$result = $client->describeServices();
でサービス、カテゴリの一覧を取得する必要があります。
aws_describeServices.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 31 |
<?php # credentialファイルの呼び出し $credential_path = "./.aws/credentials"; if(!file_exists($credential_path)){ exit("定義ファイルがありません"); } # aws sdk for phpを呼び出し require_once("./vendor/autoload.php"); use Aws\Support\SupportClient; # credentialsのどちらかのユーザーを指定します。 $profile = "user1"; $client = SupportClient::factory(array( 'profile' => $profile, 'region' => 'us-east-1',// サポートはUS eastのみ )); $case = $_GET['case']; $client = SupportClient::factory(array( 'profile' => $profile, 'region' => 'us-east-1',// サポートはUS east以外NG )); $result = $client->describeServices(); echo json_encode($result); exit(); |
また、ケースを作成するスクリプトを用意します。
aws_createCase.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 31 32 33 34 |
<?php # credentialファイルの呼び出し $credential_path = "./.aws/credentials"; if(!file_exists($credential_path)){ exit("定義ファイルがありません"); } # aws sdk for phpを呼び出し require_once("./vendor/autoload.php"); use Aws\Support\SupportClient; # credentialsのどちらかのユーザーを指定します。 $profile = "user1"; $client = SupportClient::factory(array( 'profile' => $profile, 'region' => 'us-east-1',// サポートはUS eastのみ )); $result = $client->createCase(array( 'serviceCode' => $_POST['serviceCode'],// aws_describeServicesで取得 'severityCode' => $_POST['severityCode'],// 優先度 'categoryCode' => $_POST['categoryCode'], // aws_describeServicesで取得 'subject' => $_POST['subject'], 'communicationBody' => $_POST['body'], 'language' => 'ja', 'issueType' => 'technical', )); $caseId = $result['caseId']; echo $caseId; exit(); |
投稿側のHTMLについては
createCase.html
にて作成しております。
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 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 |
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title>ケース作成</title> <script src="http://code.jquery.com/jquery.min.js"></script> <script> $.ajax({ url: 'script/aws_describeServices.php', type: "POST", dataType: 'json', success: function( json ) { var len = json.length; var makerArray = {}; $("#serviceCode").append($('<option value="" selected="selected">選択</option>')); // サービス取得 for (var key in json) { var tempArray = {}; $("#serviceCode").append($('<option value="' + json[key].code + '">' + json[key].name + '</option>')); // カテゴリ取得 var len2 = json[key].categories.length; for(var j=0; j < len2; j++){ tempArray[(j+1)] = new Array( json[key].categories[j].code , json[key].categories[j].name); } makerArray[json[key].code] = tempArray; } $("body").pulldownChange("serviceCode", "categoryCode", makerArray); }, complete : function(dataRes) { console.log("jsonデータ取得完了"); } }); // select内容により次のselectを変更 $.fn.pulldownChange = function(targetid, changeid, changeItemArray){ $("#" + targetid).change(function(){ value = $(this).val(); $("#" + changeid).children().remove(); changePulldown = changeItemArray[value]; changeSellectNode = window.document.getElementById(changeid); // 1項目目を選択として追加 changeSellectNode.options[0] = new Option("選択", ""); for (var key in changePulldown) { changeSellectNode.options[key] = new Option(changePulldown[key][1], changePulldown[key][0]); } changeSellectNode.selectedIndex = 0; }); } jQuery(document).on("click", "#submit", function(){ var serviceCode = $('select#serviceCode').val(); var categoryCode = $('select#categoryCode').val(); var severityCode = $('select#severityCode').val(); var subject = $("#subject").val(); var body = $("textarea").val(); var dataRes = "profile=" + window.localStorage.getItem("account") + "&serviceCode=" + serviceCode + "&categoryCode=" + categoryCode + "&severityCode=" + severityCode + "&subject=" + subject + "&body=" + body; if(!serviceCode){ alert("サービスを選択して下さい"); $("select#serviceCode").focus(); return; } else if(!categoryCode){ alert("カテゴリを選択して下さい"); $("select#categoryCode").focus(); return; } else if(!severityCode){ alert("緊急度を選択してください"); $("select#severityCode").focus(); return; } else if(!subject){ alert("タイトルを入力して下さい"); $("select#severityCode").focus(); return; } else if(!body){ alert("ケース内容を入力して下さい"); $("textarea").focus(); return; } else if (confirm('ケースを作成します。\nよろしいですか?')) { $.ajax({ url: 'script/aws_createCase.php', type: "POST", data: dataRes, dataType: 'text', success: function( caseId ) { re = new RegExp("case-", "i"); if (caseId.match(re)) { $("#form").remove(); alert("ケースを作成しました。"); }else{ alert("ケースを作成に失敗しました。ManagementConsoleを確認して下さい"); } },error: function(XMLHttpRequest, textStatus, errorThrown) { $("#XMLHttpRequest").html("XMLHttpRequest : " + XMLHttpRequest.status); $("#textStatus").html("textStatus : " + textStatus); $("#errorThrown").html("errorThrown : " + errorThrown.message); }, complete : function(dataRes) { console.timeEnd("json"); console.log("jsonデータ取得完了"); } }); } }); </script> </head> <body id="chat"> <div id="header"> <h1>新規ケースをオープン</h1> </div> <div id="chatarea"> <ul> </ul> <ul class="form" id="form"> <li>サービス: <select name="serviceCode" id="serviceCode" style="width: 30%;"> <option value=""></option> </select></li> <li>カテゴリ: <select name="categoryCode" id="categoryCode" style="width: 30%;"> <option value=""></option> </select></li> <li>緊急度: <select name="severityCode" id="severityCode" style="width: 30%;"> <option value="">選択</option> <option value="urgent">緊急</option> <option value="high">高</option> <option value="normal" selected="selected">普通</option> <option value="low">低</option> </select></li> <li>タイトル:<input type="text" name="subject" id="subject" value="" style="width: 70%;" /></li> <li><textarea placeholder="ケースを作成"></textarea></li> <li><span id="submit" onclick="">送信</span></li></ul> </div> </body> </html> |
いかがでしたでしょうか?
デザインを適用することで以下のようにスマートフォンから利用する事も出来ます。
次回もお楽しみに!!