JavaScriptを使わずCSSだけで構築したWebチャット

2019年5月17日 08:55

小

中

大

印刷

記事提供元:スラド

あるAnonymous Coward曰く、 JavaScriptを使わず、CSSだけでWebブラウザ上で動くチャットを実装した人が登場した(ソースコードなどを公開しているGitHubリポジトリ)。

 画面上に表示される文字ボタンをクリックして文字を入力し、「submit」をクリックするとそのテキストが送信されるという仕組み。

 CSSの「:active」セレクタでbackground-imageスタイルを指定すると、その要素がクリックされてアクティブになった際にその画像を取得するリクエストがサーバーに送信されることを文字の入力や送信に利用している。

 また、サーバーからクライアントへのメッセージ送信は、「Transfer-Encoding: chunked」ヘッダを送ってコンテンツの送信を中断状態にしておき、随時「続きのコンテンツ」を送信することで行っている。

 作者はCSSでマウスカーソルを追跡する方法に触発されたと述べている。

 スラドのコメントを読む | ITセクション | インターネット | IT

 関連ストーリー:
第三者向けにJavaScriptコードを提供していたドメインが乗っ取られ悪用される事例 2019年01月29日
非常に長い名前のBlobでFirefoxをクラッシュさせる攻撃 2018年09月28日
WebページをSafariに読み込ませるだけでiOSデバイスが再起動するCSSベースの攻撃 2018年09月19日
CSSの機能を使用してクロスオリジンのiframeから表示内容を読み取るサイドチャネル攻撃 2018年06月03日

※この記事はスラドから提供を受けて配信しています。

関連キーワードJavaScriptGitHub

広告