本节书摘来异步社区《HTML5移动Web开发实战》一书中的第1章,第1.5节,作者:石川,更多章节内容可以访问云栖社区“异步社区”公众号查看。
1.5 配置移动开发环境
HTML5移动Web开发实战
适用浏览器:所有
在开始移动网站开发之前,我们必须首先配置好开发环境。
1.5.1 准备
1.配置本地网站服务。对于Windows、Mac和Linux,最容易的方法是使用免费的XAMPP软件:
http://www.apachefriends.org/en/index.html
2.确认你有无线网络。
3.同时你需要一个移动设备,或者是移动设备的仿真器、模拟器。
4.确保你的移动设备和电脑在同一无线网络中。
1.5.2 实践
1.在你的本地服务器根目录中创建一个HTML文件并命名为ch01e1.html,在其中输入如下代码:
2.获取你的IP地址。如果你使用的是Windows,你可以在命令行中输入如下命令:
3.当你获取到你的IP地址(如192.168.1.16),把它输入到移动浏览器的URL地址栏,然后你就可以看见页面加载成功并且显示图1-3所示的文字。
1.5.3 回顾
在同一个局域网中,你的移动设备可以通过IP地址访问以桌面电脑作为主机的服务器。
1.5.4 延伸
如果你没有移动设备,你可以使用某个仿真器来测试,但建议至少有一两个真实设备来测试。仿真器可以测试到大部分的情况,但不是所有的。
使用桌面版Safari测试
如果你的主要用户使用iPhone和移动版Safari,在桌面电脑上测试可以节约很多时间:打开Safari,在偏好设置中单击高级栏打开,在菜单栏中显示“开发”菜单,如图1-4所示。
在本页面中选择开发 | 用户代理 | Mobile Safari 3.1.3 – iPhone:
社区搜集的仿真器、模拟器
如果你没有智能手机,也可以使用很多仿真器、模拟器,你可以在Mobile Boilerplate项目的wiki页面找到:
https://github.com/h5bp/mobile-boilerplate/wiki/Mobile-Emulators-&-Simulators
Fritman搜集的仿真器、模拟器
Maximiliano Firtman,一个移动网站开发人员和作家,他维护了一个仿真器列表: