JavaScript & rails 既読機能をつける方法
今日も朝6時から勉強して、いい感じです。
目次
■非同期通信のデータの流れ
■エンドポイント
■queryパラメーターとpathパラメーターの理解
■jsonとは?
非同期通信のデータの流れ
非同期通信は、HTMLではなくデータを返す
HTML
↓ ブラウザ上で既読にしたい要素をクリック
JS
↓ イベントハンドラーが働きコントローラーへデータを渡す
コントローラー
↓ DBの内容を既読に書き換え、そのデータを取得しJSへ返す
JS
↓ 返されたデータをもとに任意の値をHTMLへ反映
HTML
↓ 反映された情報をもとにCSSを適応
既読
※JS=JavaSprict
※イベントハンドラー=イベントが発生した時に行われる処理のこと。
例えば、「クリックした時に、既読マークがつく」「マウスカーソルを乗せた時に要素の色が変化する」など「XXXした時に○○○になる」と行った処理のことを指します。
エンドポイント
エンドポイントとは、Ajaxでやりとりする際の、データ返却アクションを実行するためのURL
※Ajaxとは、JSを使用して非同期通信を行う処理のプログラム手法のこと
Ajaxでやりとりするためには、railsでレスポンスをユーザーへ返す時にHTMLではなくjsonなどのデータ形式で返却する必要があります。
そのデータを取得する時にアクセスするためのURLがエンドポイントです。
エンドポイントには「 メモのid 」と言うパラメーターを渡す必要があります。
理由は、「 どのメモを既読にしたのか 」を判別するためです。
メモのパラメーターを設定する方法は2つあり、
「 queryパラメーター 」と「 pathパラメーター 」と言う
queryパラメーターとpathパラメーター
queryパラメーターとは、「 例1 http://sample.jp/?animal=panda 」のように「?」以降に情報があるパラメーターです。
「?」以降の構造は、?<変数名>=<値>となっている
例1のURLでparams[:name]とすると、pandaが戻り値となります。
pathパラメーターとは、「 http://samples.jp/tweets/1 」のように指定するパラメーターのことです。
pathパラメーターで指定するのは「 リソースを識別する場合 」です。
※リソースとは?
リソースは「 WEB上で名前を持ったあらゆる情報 」のことです。
例えば、「 WEB上に挙げた写真データ 」「 富士山頂の天気予報データ 」など。
このようにリソースに該当するデータは、WEB上に数えられないほど存在します。
その数えられないほどのリソースを探し出すために必要なものがURLです。
jsonとは
jsonとはコンピューター上でデータのやり取りをする際の、形式の一つでjson以外にも
なぜjsonを使うのか?
理由は、JSとの相性がいいからです。
以上