使用chrome连接手机浏览页面效果

在pc端运行移动项目，使用手机进行查看页面效果；前提：手机和电脑都安装了chrome浏览器

参考自:https://www.cnblogs.com/huaji/p/5925819.html

步骤：

1. 手机打开“开发者选项”

安卓手机进入“设置”—>“关于手机”—> 在“版本号”上点7次（或其他的版本号位置，一个个试肯定有……）

然后“开发者选项”就出现在“设置”里面了。

 

2. 手机打开“USB调试”

进入“开发者选项”—>打开“USB调试”（如果想手机长亮还要打开“不锁定屏幕”）

 

3. 连接并允许调试

用USB数据线将手机与电脑连接—>手机上出现“允许该电脑调试”时点“允许”（可能会晚点出现，先去第二步）

 

第二步：用电脑启动手机浏览

 

1. 打开chrome的inspect

在电脑chrome地址栏中输入chrome://inspect—>勾选“Discover USB devices”

如无意外在Devices中会出现手机型号。

如果没有，再确认下：开发者选项、USB调试、允许该计算机调试

 

2. 手机打开chrome app

在手机中打开chrome，这时电脑的chrome inspect中会出现输网址的地方。

 

3. 测试手机浏览的控制

在电脑chrome inspect输入框中随便输个在线网址，点Open，手机chrome就会打开该页面。用电脑chrome可以控制刷新、关闭，但是用来调试的inspect点开是空白，应该是被墙了。

 

第三步：用手机测试本地页面

 

1. 开启本地服务器

对的，很遗憾手机chrome不能进行静态页面的调试。

所以必须开本地服务器，所幸现在有gulp+webserver，用法这里不讲了。

总之，完成这一点后，你应该在电脑上用 http://localhost 来浏览网页了。

 

2. 电脑chrome开启端口转发

在chrome inspect中点“Port forwarding...”—>把端口和localhost链接输进去（比如8000和localhost:8000）—>勾选“Enable port forwarding”—>Done

 

3. 打开手机浏览localhost

如：输入http://localhost:8000 点Open

这样手机就能打开页面了。