WebSocketでWeb開発を爆速に

EmacsからWebSocket通信でブラウザを更新します。

■ 目的

WebSocketサーバとコネクションを
確立した全てのブラウザを更新することで
クロスブラウザチェックを爆速にします。

■ 準備するもの

  • Emacs
  • websocket.el ①
  • websocket_server.rb ②
  • websocket_client.el ③

私のGitHub に ②と③を置いてます。

■ インストール

  1. Emacsのロードパスが通っている場所に ①~③を配置

■ 実行

1.  WebSocketサーバを起動(Ruby)
M-x ws-server-start

2. ブラウザ側でWebSocketサーバとコネクションを確立

$(function(){
    socket = new WebSocket( 'ws://localhost:8125' );

    socket.onmessage = function( msg ) {
        window.location.reload();
    };    
});

3. Emacs側でWebSocketサーバとコネクションを確立
M-x ws-client-connection

4. Emacs側からWebSocketサーバにデータを送信する
M-x ws-client-send-message

■ 仕組み

EmacsとブラウザでWebSocketServerのコネクションを確立します。
Emacs <- connection -> WebSocketSever <- connection -> ブラウザ
Emacsからのデータ送信を行い、WebSocketServerがbroadcastで
コネクションが確立している全ソケットに対してデータを流します。
ブラウザはデータ受信を契機に更新処理を行います。

■ デモ

■ 備考

以前はnode.js + elispで行っていました。
無理やりnodeでTCPソケットを開いてブラウザとEmacs 間の
WebSocket通信を行っていましたが、elispでwebsocketプロトコルを
実装して下さった方がいたので、書き直してみました。

コメントを残す

メールアドレスが公開されることはありません。