首页 > 技术文章 > 写的页面如何在手机上预览

qdkfyym 2019-03-26 17:18 原文

写好的手机页面按F12,可在浏览器上预览不同机型的情况,但是浏览器自带的模拟调试器,和真机还是有差别的,那么如何在手机预览自己写的项目呢?

有以下两种情况,无论那种情况,都要求手机和电脑在同一局域网下,补充,先知道本机的ip地址,方法win+R,然后输入cmd,输入ipconfig查看本机ip

方法1.如果电脑连的是wifi,那么手机必须连的和电脑同一个wifi,在浏览器里复制要预览的页面地址,把地址里127.0.0.1改成自己电脑ip地址,然后发送到手机上,在手机里打开,就可以在手机预览了

方法2.如果电脑设置的是有线连接,就不能用方法1了,此时需要打开【控制面板】,切换为【大图标】浏览,选择【管理工具】-【Internet Information Services (IIS)管理器】

然后双击打开,在展开的【网站】上右击,添加新的网站,如图一所示:网站名称填写自己的项目名称,物理路径选择本机存放该项目的地址路径,ip地址填写本机ip,端口号一般不使用默认的80,可以自己随便起一个如8081,8087等,

每添加一个新项目,端口都不能重复,然后点击确定,可在右侧看到浏览网站(如图二),点击浏览网站看在电脑上看能否正常打开,如果可以正常打开,把浏览器里打开的地址复制一份发到手机上,即可在手机上打开预览,

然后每次在项目里改东西保存后,点击手机浏览器地址旁的刷新按钮,就可以边调试边在手机上预览了,如果在浏览器上不能正常打开,则要返回检查上述信息是否填写正确(注:标红的为必须要填写的信息项)

图一:

图二:

注意:如果以上操作做了,仍然无法使用,请确保电脑上防火墙是否关闭,一定要关闭防火墙才能访问!!!

如有不正确的地方欢迎补充和指正,觉得有用就点赞关注哦,大家一起学习一起进步!

 

推荐阅读