用nodejs實作WebSocket服務

張貼者 於

Fillano’s Learning Notes | 用nodejs實作WebSocket服務

用nodejs實作WebSocket服務
由 Fillano(馮旭平) 發表於 [ Javascript學習日誌 , 伺服器學習日誌 ]
(2401) 閱讀, (0) 引用, (3) 回應 , 推文( 0 )

昨天跟幾位朋友分享了一下泛HTML5中的WebSocket技術，做了幾張投影片及範例程式，也在這裡分享一下好了：

http://www.fillano.idv.tw/websocket1.pdf
http://www.fillano.idv.tw/mywebsocket.tar.gz

不過需要說明一下，程式是要用nodejs來跑的，我使用的是nodejs v0.2.0。nodejs之前更版很快，而且介面變動頗大，所以需要注意到版本是否相容。另外一個問題是，WebSocket的伺服器端需要處理WebSocket Protocol，這個協定目前還是草案，目前使用的草案版本是draft 76，他會在2010-11-7過期…所以也可能會碰到瀏覽器不支援draft 76協定的狀況，讓伺服器與瀏覽器無法溝通。

Browser 與 Server 持續同步的作法介紹 (Polling, Comet, Long Polling, WebSocket)

張貼者 於

Browser 與 Server 持續同步的作法介紹 (Polling, Comet, Long Polling, WebSocket)

對 Comet 的懵懂

記得兩年多前，第一次看到 Gmail 中的 GTalk 覺得很好奇：「咦？線上聊天且是 Google 的熱門系統，只用傳統的 AJAX 應該會操爆伺服器吧？」很幸運的，當時前公司內部的 Tech Talk 就有位同事分享這個叫 Comet 的技術、是種「為了讓瀏覽器與伺服器頻繁溝通所使用的技術、主要的瓶頸在於 WWW 伺服器上。」但因為工作沒有用到這類的需求、加上找不太到好的入門文章、實作的人不多，因此我對 Comet 的認識一直停留在懵懂的階段。

這一年多，會自動更新的網站越來越多，例如 Twitter、Plurk、Facebook 都會隨時有新資料出現在頁面上。也越來越常聽到 nodeJS 這個框架、似乎成為了此類需求的最佳的解決方案。心中的疑問是：「nodeJS 是專門為了實作 Comet 的 Web 伺服器嗎？」（當然不只是這樣 =b）
一頭霧水的實作階段

最近 miiiCasa 需實作一個即時通知的功能：「當有人做了跟我有關聯的動作時（例如：設為聯絡人、上傳照片到我可以存取的設備），立刻會有一則訊息在左下角。」同事分別將 nodeJS 架設起來並做了分享，似乎萬事皆備只欠 Coding。不過真的開始 Coding、尋找文件時就開始混亂了。因先前錯誤的認知，將許多名詞都混在一起： Polling、AJAX Comet、Comet with Iframe、Non-blocking IO、Web Socket、Long Polling、Socket.io 等。而且還發現 nodeJS 的定位跟我想像的差異很大，本來只知道它是一套事件驅動的伺服器端語言、後來才了解它的強大、甚至可寫出不同類型的伺服器（A HTTP Proxy Server in 20 Lines of node.js Code），它的定位對我來說，根本就是另一套不同概念的 Apache + PHP，即時通知只是其中的一種受歡迎的實作罷了。

先把 nodeJS 放一旁吧（畢竟我對它的了解還在幼稚園階段）。這篇文章主要要介紹的是上面提到的混亂名詞，希望用最簡單的實作讓大家了解每個技術的定義、避免混淆在溝通時造成誤解。
1. 老掉牙的輪詢 – Polling

CryptGenRandom

張貼者 於

CryptGenRandom – Wikipedia, the free encyclopedia

CryptGenRandom
From Wikipedia, the free encyclopedia

CryptGenRandom is a cryptographically secure pseudorandom number generator function that is included in Microsoft’s Cryptographic Application Programming Interface. In Win32 programs, Microsoft recommends its use anywhere random number generation is needed. A 2007 paper from Hebrew University suggested security problems in the Windows 2000 implementation of CryptGenRandom (assuming the attacker has control of the machine). Microsoft later acknowledged that the same problems exist in Windows XP, but not in Vista. Microsoft released a fix for the bug with Windows XP Service Pack 3 in mid-2008.[1]

The Default View Source Editor Has Changed in Internet Explorer 8

張貼者 於

Method 1: Using the Built-in Option in IE8

Internet Explorer 8 includes a built-in option to change the default view source editor. The setting is provided in the Developer Tools.

1. Open Internet Explorer

2. Press the F12 button to start the Developer Tools

3. From the File menu, click Customize Internet Explorer View Source

4. Select one of the following options:

Default Viewer
Notepad
Other…

Ajax Image Uploading (With Less Suck)

張貼者 於

Ajax Image Uploading (With Less Suck) | CSS-Tricks

Ajax Image Uploading (With Less Suck)
By Guest Author
On 6/10/2010
With 44 Comments
This technology demo is courtesy of ZURB and the post was co-authored by ZURB and Chris.

How do you upload images now?

You select a file and click upload. Simple right? Except once you select your image you can no longer see what was selected. The name of the file is at the end of the input, and if the input is short, or the file path is deep, you’re not going to see anything useful. You forget what you selected and have not idea what you’re about to upload. “Wait, did I upload a picture of my face or something less professional?"

Resize, preview and upload an image with AJAX – Complete example

張貼者 於

AJAX Resize, preview and upload an image with AJAX – Complete example – WebDeveloper.com

Resize, preview and upload an image with AJAX – Complete example
Hello,

I wanted to do an Ajax script to resize and preview and image in an html form. Well, I didn’t find how to do with Ajax, so I had to use php.

The issue is that JavaScript cannot manage a file field to get the selected file and send it via Ajax. The only way to send a file is submitting a form. To not send all data of the form, the file field must be a separate form from the rest of the data. So it can be automatically sent to a php script, which resizes the image, uploads it and then can display it in a iframe without reloading the page.

Then you have the resized image previewed in the form without submitting all data. And then you can send all data with Ajax, including the path of the previously uploaded image, which is stored as a variable in the iframe.

I use one html file and two php scripts, which in total are less than 20 KB.

What do you think about this approach?

Kind regards

自訂 input type="file" 格式

張貼者 於

【卜維丰】自訂 input type="file" 格式

自訂 input type="file" 格式

網頁製作中，有不少難題急壞了所有設計師，例如曾經提過有關於 Flash 遮住下拉選單問題，而其中一個令人頭大的問題，則是表單中的檔案欄位，再怎麼加上 CSS 樣式來修飾，仍然控制不了按鈕中的文字，在 QuirksMode 中提過解決方案。不過我個人仍對這個解決方案不太滿意。

問題的成因仍為瀏覽器本身對元件的解釋不同所導致，如：

Uploadify

張貼者 於

Demos – Uploadify

Demos

Uploadify is a powerful and highly-customizable file upload script. In its simplest form, Uploadify is easy to get up and running with minimal effort and little coding knowledge.

Uploadify can also be modified to suits the needs of more advanced developers via the arsenal of custom options that are available. Below are a few examples of different implementations of the Uploadify plugin.