学習記録（個人的な理解）

既読機能（非同期通信）の仕組み

【目的】

・非同期通信の仕組みを理解する

・必要なコード・用語を覚える

【学習概要】

既読機能を実装して以下のことを学ぶ

・フロント側の処理の流れ

・リロードせずに既読マークがつくために必要なコード

【実装の手順】

１．既読した際にイベント発火させる

メッセージをクリックした際、既読となりクリックがイベント発火になる

〈使用したコード〉

forEach

addEventListener

２．クリックした際にリクエストを送信する

フロント側（HTML）を編集してリクエストを送信できるようにする

〈使用したコード等〉

XMLHttpRequest ... オブジェクト（Ajaxを可能にする）

カスタムデータ ... HTMLに属性を持たすことができる

要素.getAttribute（”属性名”）… 指定した属性の値を戻り値として返すことができる

new XMLHttpRequest ... よく分からなかった

open ...  .....

responseType="json";  ... レスポンスの形式を指定できる（この場合はJSON形式）

send ... リクエストを送信できる

　　　　　　　　　↓

これらによってクリックした際にHTMLに属性を持して、

Javascriptで要素を選択可能にできるなど（多分😓....自信なし）

今日はここで終了

続きは明日 . . . . . . . .！