如何使用Chrome瀏覽器進行移動應用開發?

對於大多數軟體開發人員來說,Native APP還是Web APP,如何選擇仁者見仁智者見智,但是在某些特定的應用場景下及基於成本的考量,Web APP 還是值得去關注和學習的,在進行Web APP開發過程中,有一個重要的環節就是除錯檢視效果,當然使用Android 或者蘋果真機進行除錯本身是沒問題,但是有些時候只是很小的改動,未來節約時間就使用谷歌瀏覽器了

工具/原料

Chrome瀏覽器

方法/步驟

下載安裝最新版的Chrome瀏覽器,位址列輸入訪問地址,例如:127.0.0.1:8080/XXX;開啟z;

如何使用Chrome瀏覽器進行移動應用開發

經過步驟一點選【開發者工具】後,瀏覽器視窗將變更其展示方式,如下圖所示,當我點選圖中標紅圖示時,左側即可模擬各種移動終端螢幕展示效果;通過拉動瀏覽視窗右下角三角圖示實現螢幕拖動模擬;

如何使用Chrome瀏覽器進行移動應用開發

經過前兩步,我們將會看到如下展示效果,這樣就實現達到模擬真機展示效果,但是和真機上進行比較,清晰度還是有點差,但是作為一般除錯足夠了

如何使用Chrome瀏覽器進行移動應用開發

進行WEBAPP開發,有一個比較重要的點就是資料儲存;在非隱私模式下,我們可使用Session Storage 或者 Local Storage 方式儲存比如登陸使用者名稱、使用者區域、性別等基本引數,同時注意涉密資料的加密;

如何使用Chrome瀏覽器進行移動應用開發

注意事項

1.因Chrome 瀏覽器版本不同,其預覽效果可能存在差異,但不影響除錯

相關問題答案