文/圖、菜鳥編
多螢幕的時代，網頁的自適應(RWD Responsive Web Design)已變成最基本的模式。加上各行各業都會有網頁需求，所以網頁設計人員的需求在市場上也供不應求。但對開發人員來說，每每網頁上線前一定都要在不同行動裝置上測試，確認文字大小是否符合小螢幕閱讀，或是版面是否有錯位等問題。
測試的方式有很多種，可透過服務平台、安裝伺服器軟體讓電腦本身變成一台Web Server等，當然也有人直接就以FTP方式直接修改立即呈現。而鳥編今天要提供給大家的是我覺得還挺好用的一個Chrome外掛應用程式。
應用程式名稱：Web Server for Chrome
軟體介紹：將Chrome變為Web Server，讓手機可直接連線查看
傳送門：https://goo.gl/q1cENI
進到應用程式安裝畫面後，點選「加到Chrome」來進行安裝。
接下來到應用程式中將Web Server啟動。
如果無法找到應用程式，可在Chrome網址列上打上「chrome://apps」。
啟動應用程式後可看到預設值是已經開啟服務。首先先選擇網頁資料夾位置。
接下來可以在自己的瀏覽器上打上「127.0.0.1:8887」，如有看到網頁資料內容，表示服務是正常執行的。
另外，在應用程式設定用，也可自動將index.html自動載入，只要勾選下面的設定即可，當然前提你的HTML檔案必須命名為「index」，而8887為應用程式預設的通訊埠，也可修改自己需要的。
勾選後，重新重整網頁，就可看到網頁效果。
到目前為止都是在本機電腦測試，而要使用手機連線觀看，則需先完成以下步驟喔。
1. 先確定你的電腦與手機是連到同一個分享器。
2. 勾選「Accessible to other computers」，並重新啟動服務。
重新啟動服務後，可在下方看到除了原本的http://127.0.0.1:8877還會出現其他的連線網址，鳥粉請注意你的畫面可能會跟鳥編不一樣喔，因鳥編電腦有裝其他虛擬裝置，所以會額外跑出許多網址列。而鳥編實體網卡的IP為192.168.0.111。
鳥編接下來就用手機直接輸入”http://192.168.0.1:8887”就可用手機看到網頁了。
這算是一套非常便利的應用程式，對於開發人員來說也是相當方便的工具。
《鳥編小提醒》
1. 此服務器只能針對HTML，如公司網頁伺服器環境為ASP或是PHP則不適合。
2. 用手機連線時，有時可能會出現無法連線，基本上問題都是防火牆或是防毒軟體造成。
官方網站：http://www.lccnet.com.tw
FB粉絲團：https://www.facebook.com/lccnetzone
菜鳥救星：https://www.facebook.com/greensn0w
延伸閱讀
留言列表