做H5页面的同学可能经常会遇到一个场景,就是电脑上调试好的页面怎么在手机上访问测试呢?

下面就介绍一种自己经常使用的方式,利用Charles代理软件来实现!

安装Charles

直接去官网下载对应的系统版本安装即可。 下载地址

软件本身是收费,免费使用的话会软甲打开之前有个延迟提醒,忽略即可,或者你也可以去找破解版

代理配置

  • 双击打开软件找到代理配置这一项,选中系统代理(我这边使用的是Mac版本):

  • 打开代理配置,设置好代理端口

  • 手机上设置 WIFI 代理为手动,端口和地址填入上面配置好的端口和电脑的IP地址

手机上配置wifi手动代理可以根据机型搜一下就知道了

手机访问测试

例如在电脑上有一个H5项目已经配置好了虚拟主机 域名是demo.yangbai.com,没有配置虚拟主机的直接使用ip和端口访问项目

这时候不出意外的话电脑上回弹出来一个是否允许这个手机连接这么一个弹窗,点击允许即可!

然后就可以访问到了,Charles左边还可以看到请求数据。

利用Charles做代理测试电脑上写的H5页面的更多相关文章

  1. Charles做代理的Map Remote路径配置

    使用Webpack做前端开发时,本地localhost使用了Webpack-dev-server搭建一个服务,开发阶段如果想把对本地后台的请求改为对外网的请求,可以使用Charles开启代理,把路径修 ...

  2. 使用Apache Benchmark做压力测试遇上的5个常见问题

    这一篇文章主要记录我在使用Apache Benchmark(一下检测ab)做网站压力测试的过程中,遇到的一些问题以及解决办法,方便日后使用. 这一篇文章主要记录我在使用Apache Benchmark ...

  3. 用iPhone查看pc电脑上写的html(Mac电脑Charles)简单版

    对于客户端同学开发来说,写一段代码想在真机上看看,是非常容易的. 那么在这么一个大前端的环境下,客户端开发想写点html和js代码,又想在手机上看看效果,怎么办呢? 需要以下几个步骤: 大体流程:1. ...

  4. 如何利用Jmeter做代理录制脚本

    如果对于这个Jmeter不太会使用的童鞋,可以去参考其他的教学文档,本文只提供Jmeter的代理使用. 第一步:添加线程组

  5. 利用花生壳在自己电脑上建立外网可访问的svn

    下载花生壳并注册账号 2.花生壳会送你一个免费的二级域名 3.登陆到路由器界面192.168.0.1或者192.168.0.0进入动态dns选项输入你的花生壳账号密码 4.在路由器设置界面设置转发规则 ...

  6. 让外界可以访问电脑上的网站的几种方式——花生壳,域名,IIS(待)

    前话: 每次“养大“一个网站,都有种骄傲地想秀给朋友们看的冲动. 之前可能是困于电脑,实在不方便. 现在,不用克制了! 该秀就秀,能装逼就装逼. 养大孩子就该拉出来秀秀,见见世面. 正题:这次实习,我 ...

  7. Java基础-继承 利用接口做参数,写个计算器,能完成+-*/运算

    38.利用接口做参数,写个计算器,能完成+-*/运算 (1)定义一个接口Compute含有一个方法int computer(int n,int m); (2)设计四个类分别实现此接口,完成+-*/运算 ...

  8. 在macOS苹果电脑上安装Azure DevOps Server(TFS)代理

    1. 概述 MacOS是一套运行于苹果Macintosh系列电脑上的操作系统,是首个在商用领域成功的图形用户界面操作系统.Iphone应用软件的开发人员,都使用运行macOS的电脑或mini盒子进行软 ...

  9. 利用nginx做反向代理解决前端跨域问题

    最近朋友再群里提了一个问题,他们公司给他提供了一个获取数据的接口,在浏览器访问这个接口能获取到json数据,但是放在项目里使用ajax就产生了跨域问题,一般这个需要提供接口的后台方面需要做跨域处理,但 ...

随机推荐

  1. docker入门-docker应用场景和优势

    一.什么是docker Docker是一个使用 Go 语言开发的,并且开源的应用容器引擎,基于LXC(Linux Container)内核虚拟化技术实现,提供一系列更强的功能,比如镜像.Dockerf ...

  2. [ Skill ] 文件读写 & IO 句柄

    https://www.cnblogs.com/yeungchie/ 在 Skill 中使用一种叫做 ioport 类型的变量来操作文件.不过我一般更习惯称为 IO 句柄 (IO/File Handl ...

  3. SQL从零到迅速精通【数据更新】

    1.[导入表]在两个表的格式一样的情况下,将一个表的数据导入另外一个表. person_old表中现在有两条记录.接下来将person_old表中所有的记录插入到person表中,语句如下: INSE ...

  4. Navicat v15 破解

    特别注意: 1.断网,否则在安装过程中会失败 2.关闭防火墙及杀毒软件 3.选择对应版本:mysql版就选择mysql 4.如果出现 就卸载,删除注册表,重新安装,出现rsa public key n ...

  5. Mybatis 多对一和一对多 学习总结04

    1.Mybatis 组件的声明周期 ​ 声明周期是组件的重要问题,Mybatis也常用语多线程环境,错误使用会造成多线程并发问题,为正确编写Mybatis应用程序,我们要掌握Mybatis组件的声明周 ...

  6. C++移动语义 详细讲解【Cherno C++教程】

    移动语义 本文是对<最好的C++教程>的整理,主要是移动语义部分,包含视频85p左值和右值.89p移动语义与90p stdmove和移动赋值操作符. 移动语义是C++11的新feature ...

  7. hadoop学习笔记 一

    Hadoop 2.x * common * HDFS 存储数据 NameNode 主从结构 * 存储文件系统的元数据,命名空间namespace DataNode * 存储数据 SecondaryNa ...

  8. Parrot Linux安装教程

    镜像下载.域名解析.时间同步请点击 阿里云开源镜像站 一.Parrot Linux介绍 Parrot 是一个由开发人员和安全专家组成的全球社区,他们共同构建一个共享的工具框架,使他们的工作更轻松.标准 ...

  9. 74CMS 3.0 任意文件删除漏洞

    一. 启动环境 1.双击运行桌面phpstudy.exe软件 2.点击启动按钮,启动服务器环境 二.代码审计 1.双击启动桌面Seay源代码审计系统软件 2.因为74CMS3.0源代码编辑使用GBK编 ...

  10. wifi钓鱼

    无线网络的加密方式和破解方式 1.WEP加密及破解 1).WEP加密方式 有线等效保密(wired euivalent pricacy,WEP)协议的使用RC4(rivest cipher4)串流加密 ...