kikki's tech note

技術ブログです。UnityやSpine、MS製品など技術色々について解説しています。

リアルタイムウェブアプリの環境構築

本稿では、実際にリアルタイムウェブアプリ構築に必要な環境設定について解説します。

リアルタイムウェブアプリが登場するまでの背景

前回の記事の最後に「WebSocket」の技術について少し触れました。詳細について解説していなかったので、こちらで補足します。

従来のウェブアプリによるHttp通信では、「ユーザ→サーバ」のリクエストを経て、「サーバ→ユーザ」へのレスポンスだけが用いられていました。つまりユーザ起点で処理が走る、「片方向通信」が主ということです。そのため、サーバの情報が変更となった場合に、サイトを閲覧しているユーザへの更新された情報の反映ができないといった問題も散見されていました。ユーザへの通知を行える技術・仕組みが求められることは自然の流れでした。そこへ、以下の技術が登場したことで、問題の多くが解決しました。

  • Socket.IO
  • WebSocet

上記技術の登場の影響で、サーバからのユーザへの通知が簡単に行えるようになりました。

WebSocket通信の流れ

本章では、WebSocket通信の流れについて確認してみましょう。以下はイメージ図です。
f:id:kikkisnrdec:20140827101539p:plain

あるユーザからのサーバへのリクエストに対して、ウェブアプリを利用しているユーザすべてにサーバからの通信が送られてきます。これらを実装するにあたって、開発者はポーリングなどの技術を意識する必要はありません。難しい処理については、「WebSocket」の仕様側で吸収しているため、開発者は簡単に実装が行えます。

開発の準備

本記事では、「WebSocket」の機能を内包した「SignalR」を採用します。

開発に必要な環境は、「Visual Studio 2012」または「Visual Studio 2013」です。以下の図の通り、「Nugetパッケージの管理」で「SignalR」と「knockoutjs」ライブラリをインストールします。

f:id:kikkisnrdec:20140827104846p:plain
f:id:kikkisnrdec:20140827105158p:plain

まとめ

これでリアルタイムウェブアプリ構築に必須な環境は整いました。次回以降から、構築に入って行きたいと思います。
それではまた。

※無断転載禁止 Copyright (C) 2015 kikkisnrdec All Rights Reserved.