移动端测试之服务器搭建

移动端测试之服务器搭建

在做移动端项目时,因谷歌浏览器上的手机虚拟机跟现实中的手机在效果方面总会有一些偏差,因此我们需要开通一个服务器来在真机上测试项目

方法一:利用windows系统自带的IIS搭建本地服务器

原理:把自己的电脑当做一台小型服务器,把自己本地要测试的项目加到服务器中,让测试的手机和自己电脑处于同一个局域网环境之下,从而让手机访问本地开发的项目

1)让手机和电脑处于在同一个局域网环境下
2)搭建本地服务器

1.安装IIS

window7系统打开控制面板 ----- 程序和功能 ---- 打开或关闭window功能 ---- Internet信息服务(不需要展开,直接把前面的框选中即可)---- 安装完毕 ---- 控制面板 ---- 管理工具 ---- 查看是否有“Internet信息服务(IIS)管理工具”

2.搭建项目

点击“网站” ---- 右键“新建网站” ---- 确定 ----- 点击“默认文档” ---- 加入入口文件如:index.html

3.关掉windows防火墙

控制面板 ---- windows防火墙 ---- 点击“打开或关闭windows防火墙”

4.用手机浏览器访问电脑的IP即可看到页面效果

方法二:利用mac系统自带的 apache2搭建本地服务器

1.找到mac系统自带的apache2服务器所在位置
打开 Finder > 前往 > 前往文件夹 >  输入 “/ etc / " 即来到apache服务器放在的位置 , 如下:

1032095-20161123214322237-567545522.png

2.部署文件
部署文件放在apache的默认目录 “/资源库/WebServer/Documents/” 下面,当然了,如果你嫌麻烦,也可以自己重新更改部署文件的位置

1032095-20161123214844565-1440291661.png

3.更改部署文件的位置
找到apache服务器文件下的httpd.conf文件,修改该配置文件可以实现你所想要的更改部署文件位置,修改端口号(默认为80端口)等

1032095-20161123215243581-190425498.png
找到httpd.conf文件后,打开找到 DocumentRoot , 然后修改为你想要放置的地址
1032095-20161123215644628-1884120761.png

4.更改默认端口号
因默认的端口号为80端口,有时端口被占用,则需要更改端口号,找到httpd.conf文件里 Listen 80 那一行 , 改为你需要的端口号

1032095-20161123220015300-2051412825.png

5.开启服务器
启用apache的命令: sudo apachectl start/restart 
关闭apache的命令: sudo apachectl stop

然后在浏览器中输入localhost或者127.0.0.1,如果看到“It works!”的提示,则表示apache服务器启动成功了,若没成功,则去查看日志,找到出错的原因

1032095-20161123220908393-684884852.png
1032095-20161123220919503-1139513325.png

用真机测试时换成自己电脑的ip地址访问即可,mac ip地址通过打开wife中的网络偏好设置可快速查取

1032095-20161123221251534-1016855501.png
1032095-20161123221305925-955872203.png

转载于:https://www.cnblogs.com/worldly1013/p/5960572.html

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
1 硬件需求 1.1 基本配置 配件 数量 CPU 2核 内存 4G 硬盘 100G 1.2 最低配置 配件 数量 CPU 2核 内存 2G 硬盘 10G 2 软件需求 名称 分类 版本 Windows 操作系统 2003及以上 jdk Java虚拟机 1.5.x及以上 Tomcat Web服务器 5.x及以上 Easy do it (轻松互联网开发平台,简称轻开平台,原名WebEasy) 应用开发服务器 2014及以上 Access 数据库 97及以上 EditPlus 开发工具 2.x及以上 3 软件安装 4 发布 4.1 下载 Easy do it,轻松互联网开发平台(简称轻开平台,原名WebEasy)下载地址: CSDN下载频道:http://download.csdn.net/detail/tx18/8711175 百度云盘:http://pan.baidu.com/s/1eQElpom 官网:http://edoit.htok.net/ 最新更新的下载包:http://download.csdn.net/user/tx18 4.2 发布 复制webeasy目录到D:\下,然后进入%TOMCAT_HOME%\conf目录,用文本编辑器(如:EditPlus)打开server.xml文件,在“Host”标签下添加一“Context”标签: 保存退出并启动tomcat 5 编辑工具 轻开平台可以用任何网页或文本编辑器进行开发,我本人一直在使用EditPlus,以下推荐常用的编辑软件: • EditPlus EditPlus 是一款功能强大的文字处理软件。它可以充分的替换记事本,它也提供网页作家及程序设计师许多强悍的功能。支持 HTML、CSS、PHP、ASP、Perl、C/C++、Java、JavaScript、VBScript 等多种语法的着色显示。程序内嵌网页浏览器,其它功能还包含 FTP 功能、HTML 编辑、URL 突显、自动完成、剪贴文本、行列选择、强大的搜索与替换、多重撤销/重做、拼写检查、自定义快捷键,等等... EditPlus中文版包含在下载包中 6 开发 6.1 第一个json 新建一个扩展名json的文件,如one.json(下图) 然后录入如下内容 {"item":{ 土豆 1.24 KG T恤 68 件 可乐 2.20 瓶 书 51.24 本 @{item:name} @{item:price} @{item:unit} },"sort":@{int:@{item:getSuffix}+1} } 6.2 针对移动App(json格式)的规则及开发例子 除了基本开发标签语言及表达式(参见同一下载包中的开发手册)外,轻开平台特别针对移动App最常用的json文本格式开发的对应规则:  文件扩展名须为json(如:one.json)或用JspEasy扩展  文件内容须为闭合的json格式,静态内容则可直接书写json格式,如: {“item”: { … … },”other”:”other value” }  value属性参数表示输出不带引号的值,如: @{item:price} 输出:"pri
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值