阿西河

所有教程

公众号
🌙
阿西河前端的公众号

我的收藏

    最近访问  (文章)

    教程列表

    数据库
    抓包专区
    测试专区

    charles 映射到本地文件/文件夹

    charles 映射到本地

    本地映射/Map Local Settings

    功能:把需要请求网络的文件映射为请求本地文件

    本地映射工具

    本地映射工具使您能够使用本地文件,就好比他是你访问的目标网站一部分一样,流程是,客户端获取资源文件的时候,可以向服务器正常发起资源请求,但在charles就已经被截断了,并且把当前的资源请求重定向到你设置的备注;

    假设你需要用到 https://zhubangbang.com/ssl/blog/img/logo.png 这个文件;

    客户端会正常的向服务器发起请求,但charles把这个资截断,

    并返回了 C:\Users\Administrator\Desktop\charles_app\ssl\blog\img\logo.png这个文件给客户端;

    这样你实际看到的是C盘下面这些的文件,并不是真正的文件;

    根据这个原理,您可以在本地开发您的文件,然后刷新浏览器即可看到效果,本地文件的内容将返回给客户端,就像它是正常的远程响应一样。

    (如果不清楚原理可以看下charles使用方法中的实现原理介绍)

    本地映射可以大大加快开发和测试的效率,否则您将不得不将文件上传到网站来测试结果。使用Map Local,您可以在开发环境中安全地测试。

    如下图,我把自己博客的2张图片映射到本地的;

    本地映射后,方便线上调试,我此时可以在本机上随便修改(不借助测试机),但是并不影响真正的用户去使用;

    如果您是个人开发者,类似我这样本机写好后,直接发布到线上的,那么推荐你可以试试这种开发,避免了频繁发布和修改的繁琐事;等修改满意后,直接发到线上,和你测试的时候一样的效果,不会影响别的用户,虽然也没有几个人来看 – -、;
    动态文件

    动态文件(如包含服务器端脚本的文件)不会由Map Local执行,因此如果文件中有任何脚本将脚本返回到浏览器(可能不是预期的结果)。
    如果您希望使用动态文件,就像它们是远程网站的一部分一样,请参阅“远程映射”工具。

    怎么实现的
    当请求与Map Local映射匹配时,它会检查与该路径匹配的本地文件。它不包括查询字符串,如果有一个。如果所请求的文件在本地找到,则作为响应返回,就像从远程站点加载一样,因此对客户端是有欺骗性的。如果请求的文件在本地找不到,你也不用担心,请求会像平常一样由网站提供,返回给你真正的服务器数据

    例子

    如果您正在更改测试css,swf或图片 JS,您可以将这些文件类型映射到本地网站的开发副本,以便您可以浏览具有所有开发资产的实时网站。创建从live.com/*.css到本地开发副本的根的映射,以及其他文件类型的类似映射。或者,您可以根据需要映射整个目录或单个文件。

    上面图片,我是把 x.xxx.com 全部映射到某个文件夹下的;*是通配符,表示这个域名下的所有资源;

    位置匹配

    每个位置匹配可能包含协议,主机,端口和路径模式,以匹配特定的URL。位置可能包括通配符。

    本地映射

    本地映射包含一个位置匹配和本地目录,从该目录尝试提供匹配。
    使用相对路径在本地目录中搜索文件。

    相对路径是匹配路径部分之后剩下的请求位置的一部分;
    本地映射可以区分大小写;

    卖前端学习教程

    只需几十元,就能买到培训班的内部教程!开启高薪之路!

    零基础小白阿里P7的教程都有!

    同时长期收购所有培训班的前端教程

    目录
    本文目录
    目录