文/圖、菜鳥編

       多螢幕的時代,網頁的自適應(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

 

延伸閱讀

聯成電腦分享: 決戰E世代,搶進電子商務的黃金門票 

聯成電腦菜鳥救星:名片製作好簡單

聯成電腦菜鳥救星:給我S曲線的PPT

聯成電腦菜鳥救星:快速製作有質感的線上問卷

, , , , , , , , ,

lccnetvip 發表在 痞客邦 PIXNET 留言(0) 人氣()