将网络资源映射为本地文件

在生产实践中，我们会发现，服务器环境不容易在本地完全模拟，尤其是项目已经上线的情况下，出现bug更是难以在本地复现，往往只能在本地改文件，然后把本地的文件传到服务器再测试，浪费时间不说，已经上线的项目不可能允许你随时上传文件测试。所以，有一个迫切的需求就是将网络资源映射为本地文件，方便调试。

从Structure找到想要修改的网络文件，往往是js文件和css文件以及html文件。
右击该文件，点“Map Local”。
开始Edit Mapping。这里注意一点，就是Query字符串，是否保留这个串，要看情况而定，如果这个字符串里含有随机字符，那么应当把这个字符串删掉，因为不删掉的话，Charles会认为带着该字符串的网络请求才是你想要映射的请求，下次Query变了，你映射也就无效了。如果你就是希望映射带着Query的网络URL，当然就不要删掉Query字串。其他方面没有可说的，映射好本地的对应文件即可。

最后浏览器刷新页面，会发现映射已经生效。以后只需要修改本地文件的内容，刷新浏览器，就可以直接看到效果。

还有个小提示就是脑子清楚一点，不要把映射的效果当做真实的效果。

将网络资源映射为其他服务器资源

对于生产服务器上的文件，我们映射到本地文件上是OK的，但是，有时候是生产服务器上的接口出了问题，我们这时候不可能直接在生产服务器上调试，只能是映射到开发服务器上做调试。

这时候你可能会说，那就直接完全在开发服务器上调试不就行了？做生产服务器到开发服务器的映射有必要吗？

因为生产服务器的环境比较复杂，比开发服务器的环境要复杂得多，比如生产服务器上有一系列的生产数据库数据，开发服务器上只是测试数据。可能故障就出现在生产数据库的数据里，但是你暂时挑不出是哪个数据出的bug。

Charles也可能解决这些问题。

跟上文步骤差不多，右键菜单选择“Map Remote”，其他的都容易填。几个注意事项：

某一项为空，则代表匹配全部。
如果是代理到本机服务器，你的本机服务器通常是不支持HTTPS的，所以，Map to 里边的 protocol 一定要填成 http，不然 https 的请求转发过来也会是 https。
如果在服务器中有用到 refer 字段的要注意了，这个 refer 的值会变成你在这里配置的本地接口地址，例如 www.baidu.com 代理到 localhost:8000，实际获得的 refer 为 localhost:8000，为了解决这个问题，你需要勾选下边的 Preserve Host header 来保证 Header 信息不会改变。