大量接続に耐えるWebSocketアプリケーションサーバ構築のコツ - pixiv inside [archive]
WebSocketの扱うサービスでは、長時間のコネクション、再接続処理、プロキシ、ロードバランサなど、インフラの面で多くの問題を抱えがちです。弊社のサービス「pixiv」の9周年企画でも、この問題に直面しました。 実際にそこで構築したインフラの事例をもとに、本運用に使えるWebSocketサーバの構成について、pixivインフラ部の南川からご紹介します。 * 9周年企画 “黒歴史”をロケットで宇宙に飛ばす pixiv黒歴史 そもそも WebSocket とは？ WebSocketはTCP上で動く双方向通信のための通信規格です。 Webページの読み込みで行われているような、クライアントがサーバにデータを要求し、サーバはクライアントにレスポンスを返すというHTTPの通信ルールとは違います。サーバと長時間コネクションを確立し、Socketのようにデータのやり取りを行います。そして、コネクションを
![大量接続に耐えるWebSocketアプリケーションサーバ構築のコツ - pixiv inside [archive]](https://cdn-ak-scissors.b.st-hatena.com/image/square/95f08ea3414673bb0131022fbc9dc354bb7483ba/height=288;version=1;width=512/https%3A%2F%2Fcdn-ak.f.st-hatena.com%2Fimages%2Ffotolife%2Fd%2Fdevpixiv%2F20161129%2F20161129204837.png)
Plack::App::WebSocketとAnyEvent::WebSocket::Serverをリリース - DebugIto's diary
PSGIアプリケーション上でお手軽にWebSocketを使うためのモジュールPlack::App::WebSocketをリリースしました。 https://metacpan.org/pod/Plack::App::WebSocket こんな感じで使います。 builder { mount "/websocket" => Plack::App::WebSocket->new( on_establish => sub { my ($conn) = @_; ## Plack::App::WebSocket::Connection object $conn->on( message => sub { my ($conn, $msg) = @_; $conn->send($msg); }, finish => sub { undef $conn; warn "Bye!!\n"; }, ); } )-
WebSocketの仕様を調べていたら頭がどうにかなりそうだった。
WebSocketを使ってゴニョゴニョしているのだが、handshakeの失敗時のエラーをどう扱うべきなのか、よくわからない。WebSocket Protocol の仕様と WebSocket API の仕様で書いてあることが違う。 protocol仕様を読む限り、サーバーはhandshakeを拒否する場合適切なHTTPエラーコードを返さなくてはいけない、と書いてある。が、クライアント側のウェブブラウザ上のjavascriptでそれを期待しているとエラーイベントからはHTTPエラーコードは受け取れない。WebSocketの異常終了コード1006が固定でセットされている。 そこでAPI仕様を読むと、これらを行わない理由が赤字で大きく書いてある。 オープンリダイレクタが設置されたサイトで脆弱性になるので、handshakeのレスポンスはHTTPとして扱わない。悪意あるスクリプトに攻撃の準備とし
websocket.el + Amon2でリアルタイム Markdown Viewer - Shohei Yoshida's Diary
WebSocketがなんなのか全然わかっていませんが、サンプルを参考に リアルタイム Markdown Viewerを作成してみました。日本語を書くとエラーになるとか、 効率を全く考えていないとか、繰り返しやってるとエラーが出るとか 問題はまだ多数ありますが、いろいろ楽しいことができそうな予感はしました。 デモ動画 初めの 10秒ぐらい戸惑っています。 必要なもの Emacsは 23以降がいいっぽいです。試したのは 24.1です。 websocket.el Amon2 3.5以降 サーバ側 Amon2付属の chat.psgiをちょっと直した程度です。 use strict; use warnings; use utf8; use Amon2::Lite; use Digest::MD5 (); use Text::MultiMarkdown qw/markdown/; get '/' =
Amon2 が WebSocket に対応していた!! - tokuhirom's blog
Amon2::Plugin::Web::WebSocket というプラグインをだしました。 Amon2 の中で非常に簡単に web socket がつかえます。 なんかよくわからん作法とかおぼえなくてもいいので楽すぎる。。 実装例は以下のとおりです。Twiggy でしかうごきません。 use strict; use warnings; use utf8; use Amon2::Lite; use Digest::MD5 (); get '/' => sub { my $c = shift; return $c->render('index.tt'); }; my $clients = {}; any '/echo2' => sub { my ($c) = @_; my $id = Digest::SHA1::sha1_hex(rand() . $$ . {} . time); $c->we
Amon2 がストリーミングに対応しました。 - tokuhirom's blog
最近、Amon2 のリアルタイムWebサポートをおこないました。 これにより、WebSocket や Long poll をつかうウェブアプリケーションを Amon2 で簡単にかくことができます。 というか、ストリーミングがちょっとあるだけで、Tatsumaki を勉強しなきゃいけないのが面倒だったので、つくりました。 Amon2::Plugin::Web::Streaming というプラギンが、今回のバージョンでついています。これをつかうとこれまで Tatsumaki でやっていたようなことが、簡単に Amon2 でできるようになります。 MXHR には対応していないけど、WebSocket と streaming に対応したので、Amon2 で Tatsumaki がやっている領域はサポートできたとおもいます。というか自分がつかってる範囲ではこれで十分です。 以下がチャットのサンプルで
PocketIOのイカ娘語echoサンプル - ゆーすけべー日記
SocketIOのサーバ側Perl実装のPocketIO。 Hachioji.pmが中心となって開発しているYairc（仮）でも使われているんで、 気になって触ってます。 実用的に使うにはPlackのMiddlewareとかAppを活用して他のWeb Application Frameworkのアプリと同居させるといいのかなぁーと なんとなく妄想してみる。そこで、Plack::App::URLMapのmountメソッドでPocketIOのHandlerとMojoliciousアプリのパスを分けて、簡単なイカ娘語変換のechoサンプルをつくってみる！といってもMojoliciousアプリの部分ってほとんど無いけど！ app.psgiはこんな感じっす。 use Mojo::Server::PSGI; use File::Spec; use File::Basename; use lib Fil
WebSocket で PNG 画像をバイナリ転送して、JavaScript で展開して表示してみた - hakobera's blog
Node.js で WebSocket-Node を使って実装しました。 転送するめぼしい画像が見当たらなかったので、デスクトップをスクリーンキャプチャして転送してみました。 ブラウザはChrome 17以上か、Firefox 11以上が必要です。サーバ側は scrrencapture コマンドを利用している関係で Mac OS X限定です。 デモ 上半分が転送元のデスクトップ、下半分が転送された画像をブラウザで表示したものです。ニコ動のコメントの飛び具合を見るとわかると思いますが、800*600の解像度の画像を、横640に縮小して転送して、1FPSくらいです。（※ これはWebSocket の限界ではありません。速度は向上させる余地はかなりありますが、今回の本質ではないので気にしないことにします） ソースは github に置いてあります。 hakobera/screencast · G
１．WebSocket仕様解説 実装WebSocketクライアント対応プロトコルバージョン確認編 (2012/09/28 Update) - gtk2kの日記
WebSocket API(日本語訳)は、全二重の双方向通信を可能にするAPIで、これによりリアルタイムなWebアプリケーションを実現することができるようになります。WebSocketのプロトコル側の仕様が半年ほど前にRFCとして策定され、ようやく落ちついたところです。(まだ仕様変更がある可能性がないとは言い切れないけど) ※なお、ブラウザーは現時点(2012/07/26)での各最新のブラウザーを対象とします。(Chrome20,Firefox14,Opera12,Safari5+Safari6) また、ブラウザーに実装されているWebSocket(API)のことを"WebSocketクライアント"と呼ぶことにします。 WebSocketクライアントが実装されているブラウザー 主要なブラウザーのうち現在においてWebSocketクライアントを実装しているのはChrome,Firefox,O
Canvas/WebSocketでディアブロクローンなネトゲを作ってみた - mizchi log
できたよー！ 遊び方 次のURLから、twitterアカウントでログインする。 http://w-mtlab.com:4444/ 対応(確認)ブラウザはGoogleChrome Firefox4.0以上。 同時に10人ログイン程度まではテスト済。それより増えるとわからん。 矢印キー or WASD 移動 数字キーでスキル設定 1 攻撃 2 強攻撃 3 回復 4 範囲攻撃 青が自分、赤が敵、緑は他のプレイヤー それぞれにクールタイムが設定してあって、一定時間立つと実行する。具体的には、スキルを選択して敵に近づけば、それを定期実行する。ディアブロ式のネトゲやったことある人なら直感的にわかると思う。 敵を一定数倒すとレベルが上がる。ゲーム的な部分は、あまり詰めてない。クライアントではまだ可視化してないイベントがたくさんある。 死んだらリロードで復活する。 セーブデータはアカウント単位で保存されて
Socket.IOがどれくらいリアルタイムなのかちょっと計ってみた - すぎゃーんメモ
node.js+Socket.IOでリアルタイムアプリケーションが作れるわけだけど、WebSocket使うにしてもXHR-Polling使うにしてもサーバ経由して通信していれば当然タイムラグはあるわけで、それってどれくらい遅延するものなんだろう？ と思っていろんなサーバで試してみた(追記しました)。 測定方法 var server = require('http').createServer(function (req, res) { require('data-section').get('html', function (err, data) { res.writeHead(200, { 'Content-Type': 'text/html' }); res.end(data); }); }); var io = require('socket.io').listen(server);
NginxでWebSocketをリバースプロキシする方法
Nginxをリバースプロキシとして動かし、その後ろでSocket.IOを動作させる方法。nginx_tcp_proxy_moduleを使用。 WebSocketのサーバーををリバースプロキシサーバーの後ろで動作させるためには、そのリバースプロキシサーバーがHTTP 1.1のUpgradeを適切に扱ってくれる必要があります（捨てたりしないこと）。Nginxはしばしばリバースプロキシとして使用されますが、nginxのproxy_passディレクティブはそのままではwebsocketの接続を期待通りに扱ってくれません。yaoweibinさんが一般的なtcp接続をリバースプロキシするためのモジュール、nginx_tcp_proxy_moduleを作成してくださっています。このnginx_tcp_proxy_moduleを使用してnginxでwebsocketサーバーをリバースプロキシできるようにし
WebSocketでスマホ用対戦ゲームを作ってみた (1/2)
スマートフォンの流行でいま注目を集めるモバイルWebアプリ開発。関西発のイノベーションカンパニー「マインドフリー」の開発チームが、WebSocketやHTML5 Canvasといった最新技術を使ったモバイルWebアプリ開発のポイントを解説します。（編集部） HTML5がものすごい勢いで盛り上がっています。SafariやChrome、Firefox、Operaに加えて、Internet ExplorerでもついにHTML5のサポートが始まり、最近ではHTML5を使ってマークアップされているWebサイトも少しずつ増えてきました。「そろそろHTML5を使って何か作ってみたい」と考えるWeb開発者も少なくないでしょう。 HTML5の「実験」にオススメなのが、スマートフォン向けWebアプリケーションの開発です。特にiPhone/Android端末のブラウザーではHTML5や関連技術の実装が進んでいま
node.jsとWebSocketで作る野球盤ゲームの裏側 (1/4)
Expressは雛型として扱うテンプレートエンジンを選択できます。デフォルトのテンプレートエンジンは「jade」です。jadeは以下のようにしてインストールします。 $ npm install jade jadeはXML形式でなく、インデント形式で記述します。jade以外にも、EJSやCoffeeKup、Hamlなどのテンプレートがありますので、好みで選びましょう。HTML形式で書きたい場合はEJSを選択するとよいでしょう。 Expressとjadeをインストールしたら、実際にWebアプリの雛形を作ってみましょう。 $express sample create : sample create : sample/app.js create : sample/logs create : sample/pids create : sample/public/images create : sam
Node.jsに強烈に個性的な「SocketStream」が登場！：Rails Hub情報局：エンジニアライフ
また1つ、Node.jsベースのWebアプリケーションフレームワーク「SocketStream」が登場しました。6月23日にロンドンで開催されたHacker Newsのミートアップで発表されたようです（@makoto_inoueさん、情報提供ありがとうございます！）。GitHubのレポジトリにはバージョン0.1のソースコードと、何ができるかというサンプルコードを含む長大なドキュメントが公開されています。 このSocketStreamは、単にまたNode.jsでWebアプリケーションフレームワークが1つ増えたという感じではないようです。従来のものとは、設計がドラスティックに異なっています。 まず、名前から自明なように、WebSocketを基本としていて、SPA（Single Page Application）が作りやすいように設計されています。SPAとは、1ページのHTMLを読み込んだら、後
WebSocketを使って重い処理の進み具合をリアルタイムにクライアントへ通知する - Csideのダイアリー
分割が可能な重い処理をサーバー側で実行して、処理の状況の変化をクライアント側で表示させたいとき（プログレスバーみたいなのを作るとき）、どういう方法がいいかちょっと考えてみた。問題は「どうやって処理の進歩状況の情報をクライアントサイドでリアルタイムに受け取るか」ということ。 まず最初に浮かぶのが、分割されたタスクを１つ行うAPIをサーバー側で用意して、クライアント側からJSのsetTimeoutなりライブラリのdeferredなり使って並行リクエストして、コールバックでプログレスバーを書き換える・・・みたいなのが浮かんだ。けれど、PerlにはCoroやAE::HTTPみたいな便利なものがあるし、「折角なので並行処理の制御はあくまでサーバー側でできないか？」と考えていた。 で、次に思い付いたのが、「分割されたタスクが１つ終わるたびにサーバー側からクライアント側に情報をpushする」こと。これを
WebSocket - Wikipedia
WebSocket（ウェブソケット）は、単一のTCPコネクション上に双方向通信のチャンネルを提供する、コンピュータの通信プロトコルの1つである。WebSocketプロトコルは、2011年にRFC 6455としてIETFにより標準化された。Web IDL（英語版）中のWebSocket APIは、当初W3Cにより標準され、後にWHATWGに引き継がれている。 WebSocketはHTTPとは異なるプロトコルである。ともにOSI参照モデルのレイヤー7に位置し、レイヤー4のTCPに依存している。両者は異なるプロトコルであるが、RFC 6455では、WebSocketは「HTTPプロキシと仲介者をサポートするために、HTTPの443番および80番ポート上で動作するように設計されている」と述べられているように、HTTPプロトコルと互換性がある。互換性を実現するために、WebSocketのハンドシェイ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Home