跳到主要內容

文章

目前顯示的是 八月, 2011的文章

[分享] XMLHttpRequest執行AJAX 跨網域存取

跟大家在介紹Socket.io 的時候,意外發現居然Socket.io 可以執行跨網域的存取,為什麼?這個時候問題就已經埋下,挖掘之後發現!居然是平凡無奇的XMLHttpRequest,還有針對IE做的奇怪處理,到底是怎麼辦到的?

分析
W3C 提案Cross-Origin Resource Sharing(CORS),這份文件裡面提到,可以透過文件Header 設定可存取網域限制,以及存取方法、時間等,限制的部份有幾個:

必須為http, https傳送資料方式為GET, POST資料格式為application/xml
透過剛才的CORS,發展出更高層級XMLHttpRequest,W3C裡面也有實現方式XMLHttpRequest Level 2草案,裡面的這一段介紹:

The XMLHttpRequest Level 2 specification enhances the XMLHttpRequest object with new features, such as cross-origin requests, progress events, and the handling of byte streams for both sending and receiving.
XMLHttpRequest Level 2,可以支援cross-domain 請求,這個部份符合我們的需求。與CORS結合之後,似乎就可以ajax 跨網域存取,感覺不賴。

IE呢?

IE8以上有類似XMLHttpRequest Level 2的物件,稱為XDomainRequest,在
XDomainRequest - Restrictions, Limitations and Workarounds這篇文章裡面仔細描述如何搭配CORS原則完成跨網域的實做。

[分享] elementFromPoint() 模擬 Google feedback 效果

最近很熱門的Google +,其中最讓自己感覺最深刻的部份就是feedback system,整個的回饋機制十分貼心,運作上也是十分流暢。不過最讓人好奇的地方就是,為什麼進入feedback system 之後,會發現更神奇的地方。


為何在最上層有個 iframe mask,可是當我滑鼠移動的時候卻可以取得底下的物件!?這到底是怎麼回事呢?

經過幾番尋找之後,透過Flyworld 得知,原來可以使用elementFromPoint 的方式,利用滑鼠座標取得目前指到的元素(Element)。

似乎看到了一點署光,可以試著用elementFromPoint 來取得目前的物件。

[教學] nginx 設定 virtual host.

很多時候會用到不同子域名(sub domain),這邊講解如何使用nginx 設定不同網域名稱及設定成不同資料夾。

設定
DNS server 設定好名稱之後,修改檔案default
sudo vim /etc/nginx/sites-available/default
假設目前要增加nodejs.clonn.info,資料夾為/usr/share/nginx/www/nodejs
# 其他設定資料server { listen 80; server_name nodejs.clonn.info; root /usr/share/nginx/www/nodejs; index index.html index.htm index.php; location / { try_files $uri $uri/ /index.html; } } # 其他設定資料
實測
在/usr/share/nginx/www,/usr/share/nginx/www/nodejs各增加不同的index.html,測試一下結果,的確如我們所想像。


結語
目前測試起來nginx和apache的設定方式雖然不大相同,不過能做到的功能大多可及,想要嘗試看看nginx的人可以一起來測試看看,另外歡迎加入NodeJS的行列。


分享的習慣造就了Google +

從2006年開始就進入到social network的時代,沈迷當中卻不知道為何而沈迷,當時最興盛的『無名小站』,每天生態就是看看好友動態,看看大家照片,分享照片,寫寫自己遊記分享心情故事,同時在底下與大家留言、討論、激戰,同時與『PTT』新聞同步聯播,這就是當時最興盛的social network in Taiwan.

之後網路上有了些變動,開始紅起來『twitter』『plurk』『facebook』...好多人開始進入微型網誌的時代,一開始進入網站之後大家還不瞭解,這些東西能夠幫你做什麼,而今天這些不能夠幫你做什麼的網站,卻一點一點的深入每個人的生活當中。

2011年,Google +的崛起,為什麼Google +能夠真的快速崛起?個人認為這都是習慣的養成,一個新的服務形成,大家第一步會做些什麼?

註冊編輯個人資料隨處亂點在其他social website分享此訊息給我的好友分享資料給其他人加更多人為好友
為什麼會這樣子?
可以從Social network歷史看出一點端倪,從一開始twitter,plurk來說,當時進入這個網站,能夠張貼些簡短的話,給大家看到,許多人還以為這只有白痴會做的事情,沒事情為什麼要讓大家知道你在碎碎念什麼。另外一個問題就是,你要碎碎念給誰聽啊?

接著模式形成了,大家發現,咦!?一堆網友七嘴八舌,可以同時即時得到回饋的感覺還真不賴,每個人都有機會成為萬人注目的焦點,而其中主要的關鍵就是『好友』。

沒錯!只要好友一多,分享的事情又能夠令人關注,就能夠成為這個小圈圈的王,哪怕只是雞毛蒜皮小事情。帶動了『分享』,『線上互動』的習慣開始生成。

Google + 做了什麼?
Google + 在2011年這個已經被 Facebook,Twitter所河蟹的龐大網路世界中,大家已經習慣加入好友,而Google +帶來的就是簡便的介面,其他Social network所缺少的部份,Google + 做到的部份就是:
朋友分群
特定分享
群組關注
隨意分享

這些點在其他Social network上雖然都有,但不是全部都有,而Google + 將這些缺少的部份整合了起來,也讓更多人能夠接受,簡單的介面,乾淨的版面,更是其他版面所沒有,另外一個優勢就是Google + 可以透過Chrome 結合更多extension做到更多事情。

結語
Google + …

[分享] node.exe 利用child_process做些事情

node v0.5.3 版本終於出現了,先看一下原文到底做了哪些更新。

2011.08.01, Version 0.5.3 (unstable) Fix crypto encryption/decryption with Base64. (SAWADA Tadashi) #243 Add an optional length argument to Buffer.write() (koichik) #657 convert nonbuffer data to string in fs.writeFile/Sync (Daniel Pihlström) Add process.features, remove process.useUV (Ben Noordhuis) #324 Fix crypto hmac to accept binary keys + add test cases from rfc 2202 and 4231 (Stefan Bühler) Add Socket::bytesRead, Socket::bytesWritten (Alexander Uvarov) #572 Don’t print result of –eval in CLI (Ben Noordhuis) #1223 Fix http.ClientRequest crashes if end() was called twice (koichik) #1383 Emit ‘close’ after all connections have closed (Felix Geisendörfer) Add sprintf-like util.format() function (Ben Noordhuis) Add support for TLS SNI (Fedor Indutny) New http agent implementation. Off by default the command line flag --use-http2 will enable it. make test-http2 will run the tests for the new implementation. (Mikeal Rogers) Revert AMD compatibility.…