2月19日(木)1コマ目

今日、やったこと

REST APIでエラーを通知する（前回のつづき）

今日のホワイトボード

前回はサーバー側の途中まで作成。今日はそのつづき。

GlobalExceptionHandler.java

コントローラーでエラー(例外)が発生した際の処理をまとめてここに。


コントローラ(ItemControllerクラス)で例外DuplicateIDExceptionがスローされたら、ステータスコード400でこのメソッドの戻り値をボディ部に格納して返信する。

図　ID重複時のサーバーからの返信

これでサーバー側は完成。


API Testerで確認

Chromeの拡張機能API Testerでレスポンスを確認。

〇リクエスト送信

図　API Testerでリクエスト送信


〇登録成功の場合

見ずらいけど、以下のようにID=12の書籍が登録され、全件検索結果が返ってくる。

図　レスポンス(登録成功)


〇登録失敗の場合

IDが重複するデータを送信。

ステータスコード400、ボディ部にエラー情報が返ってくる。

図　レスポンス(登録失敗)


クライアント側

index.html

メッセージ表示用<p>タグ追加。


insert.js

insert()メソッドを改造。エラー時(response.okがfalse)に、エラーメッセージを取り出して、例外スローするために、同期処理を行っている点に注意。


今日が最終回

もしかしたら再試験があるかもしれません。

このブログの人気の投稿

1月15日(木)1コマ目

今日、やったこと [練習問題] ニュース検索・編集サイト 今日のホワイトボード [練習問題] ニュース検索・編集サイト 正解例をあげておきます。 dto/Content.java 配布ファイルどおり。 dao/ContentDAO.java 配布ファイルどおり。 controller/NewsController.java index.html 配布ファイルとおり。 css/style.css 配布ファイルとおり。 js/news.js 次回は 評価用課題を作ってもらいます。
続きを読む

10月30日(木)1コマ目

イメージ
今日、やったこと PUT、DELETEコマンド用メソッド クライアント側作成（IDで検索） 今日のホワイトボード PUTコマンド用メソッド HTTPの PUTコマンド は 更新用 。 更新データをクエリパラメータで送信する。 HTTPのPUTコマンドに対応するメソッドには　 @PutMapping() 　アノテーションを付与。 クエリパラメータで送信される更新データは、@RequestParamアノテーションが付与された引数で受け取る。 DELETEコマンド用メソッド HTTPの DELETEコマンド は 削除用 。 更新データをクエリパラメータで送信する。 HTTPのDELETEコマンドに対応するメソッドには　 @DeleteMapping() 　アノテーションを付与。 クエリパラメータで送信される削除対象のIDは、@RequestParamアノテーションが付与された引数idで受け取る。 クライアント側を作成 クライアント側はJavaScriptでリクエスト、レスポンス受信、データ書き換えを行う。 JavaScriptで HTTPのリクエスト送信、レスポンス受信 には　 fetch()関数 　が用意されている。 図　クライアント側のイメージ 作成するクライアント側の画面は下図のとおり。 IDで検索するアプリケーションを作成する。 図　クライアント側の画面 HTMLファイル(searchById.html) JavaScriptからアクセスするタグにはIDを付与している。 JavaScriptファイル(searchById.js) ポイントは fetch() の使い方。 図　fetch()関数 fetch()の引数はリク...
続きを読む

12月4日(木)1コマ目

イメージ
今日、やったこと [REST API]価格帯で検索　追加 [REST API]新規登録 今日のホワイトボード [REST API]価格帯で検索　追加 画面を下図のように価格帯で検索できるように追加。 図　価格帯で検索を追加 search.html 検索条件入力用<input>タグ、検索ボタンを追加。 search.js 価格帯で検索ボタンクリック時に、searchByPrice()関数呼び出し。 searchByPrice()関数にて、fetch()でAPIをリクエスト。 Controller.java 価格帯で検索するためのメソッドを追加。 2つの検索条件はクエリパラメータで受け取る。 [REST API]新規登録 新規登録はPOSTコマンドでリクエスト。 登録データはHTTPのボディ部にJSON形式で格納。 これに伴い、HTTPのヘッダ部にContent-typeにapplication/jsonを設定。 図　POSTコマンド送信時のパケット 画面は以下のとおり。 図　新規登録用画面 update.html update.js fetch()でPOSTコマンドでリクエストするには、第2引数で指定する。 （デフォルトはGETコマンド） また、ヘッダ部やボディ部も第2引数で指定。 Controller.java 以前、POSTコマンドリクエスト時に、HTTPのボディ部にJSON形式で格納されたデータを登録するメソッドを追加済み。今回はこれを使う。 次回は 登録機能の確認。 変更、削除機能を追加。  
続きを読む