65
64

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

覚えておくと、いざというときに役に立つ。JavaでリアルタイムWeb - WebSocket -

Last updated at Posted at 2014-06-14

Webもコミュニケーションに使われるようになってきて、ページ内でリアルタイム性が求められるようになってきました。
リアルタイムとは、チャットのように、あるユーザのメッセージが他のユーザに即座に伝わる仕組みです。

ブラウザでリアルタイム性を実現するための方法はいくつかあるのですが、本稿ではWebSocketという仕組みを利用します。

JavaでWebSocket

JavaでWebSocketを実現するためには、Java EE 7対応のサーバを使うのが簡単です。ここではTomcat7の、version7.0.52を使います。version7.0.48以降であれば動きます。
本稿ではWebSocketを使ってチャットアプリケーションを作成します。

サンプルコード

サンプルコードはGithubにおいておきます。Eclipseプロジェクトなので、importするだけで動きます。

解説

凄くシンプルですが、キモをピックアップして解説します。

サーバサイド

サーバー側のコードは恐ろしくシンプルです!
WebSocketEndpointAction.javaだけです。
いいねー。Java。

WebSocketEndpointAction.java
@ServerEndpoint("/loadMessage")
public class WebSocketEndpointAction {
	public static List<Session> sessions = new ArrayList<Session>();
	@OnOpen
	public void onOpen(Session session) {
		// 開始時
		sessions.add(session);
	}
	@OnMessage
	public void onMessage(String message) throws IOException {
		// クライアントからの受信時
		for (Session session : sessions) {
session.getBasicRemote().sendText("{\"command\":\"message\", \"text\": \"" + message.replace("\\", "\\\\").replace("\"", "\\\"") + "\"}");
		}
	}
	@OnError
	public void onError(Throwable t) throws IOException {
		// エラー発生時
		for (Session session : sessions) {
session.getBasicRemote().sendText("{\"command\":\"error\", \"text\": \"" + t.getMessage().replace("\\", "\\\\").replace("\"", "\\\"") + "\"}");
		}
	}
	@OnClose
	public void onClose(Session session) {
		// 完了時
		sessions.remove(session);
	}
}

肝は、「@」、アノテーションです。@ServerEndpoint("パス")とするだけで、Webソケットを受け付ける事ができます。あとは、4つのメソッドに付いているアノテーションが各イベントのハンドラとして動きます。

クライアントサイド

クライアントサイドも1ソース。index.htmlにすべて記載されています。

index.htmlからの抜粋
var forRtoA = document.createElement('a');
forRtoA.href = "loadMessage";
webSocket = new WebSocket(forRtoA.href.replace("http://", "ws://").replace("https://", "wss://"));
//・・・・省略
webSocket.onopen = function() {
	appendMessage("Opened", "blue");
}
webSocket.onclose = function() {
	appendMessage("Closed", "red");
}
webSocket.onmessage = function(message) {
//・・・・省略

これだけで、チャットができちゃいます。

超応用が効きますよ!リアルタイム処理!

ブラウザ同士で情報をやりとりしたい場合や、サーバの更新情報をブラウザに即時に送信したい時も、Javaならすごく簡単に作ることができます。
更新しないと最新情報が入ってこないWebアプリケーションなんて、もう古いですよ!リアルタイム処理であなたの作るものの価値を上げてください!

65
64
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
65
64

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?