2015/09/22
2015/09/20
2015/09/19
FirefoxでのみGoogleに繋がらない
会社での出来事なのですが、何故かFirefoxだけ外部のサイトに繋がらないということがありました。
IEやChromeでは繋がるのに。
結論としては、プロキシサーバーの設定を行う必要がありました。
メニューから「設定」を選択し、「詳細」→「ネットワーク」→「接続設定」と進みます。
「手動でプロキシを設定する」を選択し、「HTTPプロキシ」に適切なプロキシサーバーを設定します。
これで繋がると思いました。
実際繋がりました。
しかし、何故かGoogleにだけは繋がりませんでした。
Yahooとかは繋がるのに。
どうやら上記の設定画面で「すべてのプロトコルでこのプロキシを使用する」にチェックを入れないとだめだったようです。
これでGoogleにも繋がりました。
2015/09/15
BloggerでBootstrapを使う
Bloggerでbootstrapを使おうとしたんですが、そのまま使うと所々デザインが乱れました。
というわけで、CDNをそのまま使うのではなく、少しカスタマイズして使用したほうがよさそうです。
ここで必要なコンポーネントだけを選んで使用すれば大丈夫です。
...が、結局bootstrapを使用するのは諦めました。
必要なコンポーネントを限定しても。どこかしら一部デザインがおかしくなってしまって、面倒になってきました。
Bracketsの拡張機能
- Beautify：ソース整形
- Brackets File Icons：ファイルアイコン変更
- Brackets Outline List：関数定義の一覧を表示
- Indent Guides：インデントガイド
- Nemo：テーマ
- Show Whitespace VS：スペースやタブをVisual Studioのスタイルで表示
2015/09/13
Socket.IO送信関数一覧
基本的にサーバーサイドの話。
（クライアントサイドでは、通信相手はサーバーしかいないので、socket.emitしか使用しないはず）
emitはsendに置き換え可能？（その場合、第1引数は不要）
| 送信相手 | 使用する関数 | 備考 |
|---|---|---|
| クライアントに対して送信 | socket.emit(event,message); | 自動的にシリアライズ(JSON.stringify()) される(オーバーヘッドがかかる) |
| socket.json.emit(event,message); | JSON形式であることを明示 | |
| 特定のユーザーに対して送信 (socketsは省略可?) |
io.sockets.to(socket.id).emit(event,message); | |
| io.to(socket.id).emit(event,message); | ||
| 自分を含む全員にブロードキャスト | io.sockets.emit(event,message); | |
| io.emit(event,message); | ||
| 自分以外の全員にブロードキャスト | socket.broadcast.emit(event,message); | 自動的にシリアライズ(JSON.stringify()) される(オーバーヘッドがかかる) |
| socket.json.broadcast.emit(event,message); | JSON形式であることを明示 | |
| ルーム内の自分を含む全員にブロードキャスト (socketsは省略可?) |
io.sockets.to(roomID).emit(event,message); | |
| io.sockets.in(roomID).emit(event,message); | ||
| ルーム内の自分以外の全員にブロードキャスト | socket.broadcast.to(roomID).emit(event,message); | |
| ルーム内の特定のユーザーに送信 | ----- | ソケットIDがわかるはずなので、特定のユーザーに対して送信する場合と同じでよいはず |
JavaScriptのデバッグ方法（ブラウザ）
クライアントサイドの話。
サーバーサイドの話はNode.jsのページを参照。
Firefox
デバッガの起動はCtrl+Shift+i、またはF12を押す。
動的に生成されたソースを参照したい場合は、右クリック→「選択範囲のソースを表示」でOK。(Ctrl+Aで全選択してからやるとよい)
Chrome
デバッガの起動はCtrl+Shift+i、またはF12を押す。
動的に生成されたソースを参照したい場合は、アドオンを追加する必要がある(?)。
パネルの説明
- Elementsパネル（HTML・CSSの確認と編集）
- Resourcesパネル（ネットワークの監視）
- Scriptsパネル（JavaScriptのデバッグ）
- Profilesパネル（JavaScriptのパフォーマンスチェック）
- Storageパネル（Cookie, localStorageの確認・編集）
- Timelineパネル（レンダリングを含めたパフォーマンスチェック）
- Auditsパネル（YSlowのようなパフォーマンスチェックツール）
- Consoleパネル（JavaScriptのコマンドラインツール）
デバッガのショートカット
| ショートカット | 動作 | 備考 |
|---|---|---|
| Ctrl + Shift + c | DOMインスペクタモード （HTMLの要素ごとに解析できるやつ） |
デベロッパーツールを開いてない状態で実行する。 デベロッパーツールを開いている状態であれば、Webページ上の解析したい要素の上で右クリックして「要素を検証」を選択。 |
| F8 | スクリプトの実行・停止 | |
| F10 | ステップオーバー | 現在の行を実行し、次の行に進む。 もし現在の行に関数呼び出しがあったとしても、関数へはジャンプせずに関数の処理を行い、次の行に進む。 ただし、次の行に進むだけで、その行が実行されるわけではない。 |
| F11 | ステップイン | 現在の行を実行し、次の行に進む。 もし現在の行に関数呼び出しがあった場合、その関数にジャンプし、呼び出した関数の内部に進む。 |
| Shift + F10 | ステップアウト | 現在の行の呼び出し元の関数が終了するまで実行し、関数を抜ける。 |
参考URL
http://shim0mura.hatenadiary.jp/entry/20111231/1325357395
https://app.codegrid.net/entry/breakpoint-1
