Dev Helper2.4
开发助手Dev helper 是一款适用于 Google Chrome 的开发和分析扩展程序,具有以下功能: - 分析网页和绘制图表,显示所有资产的加载时间,按域拆分(包括接收到第一个字节的时间) - 设置重写规则以覆盖请求和响应 url,允许开发人员在不实际部署新代码的情况下进行测试。开发人员可以覆盖、添加或替
更新日期:2021年 8月 29日分类标签:开发语言:中文平台:
90.47KB 0 人已下载 手机查看
简介:
开发助手Dev helper 是一款适用于 Google Chrome 的开发和分析扩展程序,具有以下功能: – 分析网页和绘制图表,显示所有资产的加载时间,按域拆分(包括接收到第一个字节的时间) – 设置重写规则以覆盖请求和响应 url,允许开发人员在不实际部署新代码的情况下进行测试。开发人员可以覆盖、添加或替换请求和响应标头以测试不同的场景。例如,在响应头部分添加“Access-Control-Allow-Origin: *”将解决跨域脚本阻塞问题。另一种使用它的方法是用本地副本替换资产或脚本(JavaScript 和 CSS)。通过这种方式,开发人员可以在不部署的情况下进行更改和测试功能。 1.从chrome应用商店安装扩展。 2. 打开页面的源代码,找到要重写的脚本标签。 3.复制代码,并在本地托管4. 设置重写规则以从本地 Web 主机加载此文件请注意,请记住 Match url 实际上是一个正则表达式,因此任何正则表达式字符都应该被转义!例如,如果您想匹配 http://mysite.com/global.js?version=1 并将其重定向到 http://localhost?version=1你可以这样做:匹配网址:http:\/\/mysite\.com\/global.js?(.*)替换网址:http://localhost?($1) $1 将使用原始 url 中的这些参数替换替换 url 中的所有查询字符串参数。 – 设置重写规则以从不同位置加载资产。例如,开发人员可以编写一个常规的 expssion 模式来匹配他/她正在工作的特定网站中的所有 JavaScript 文件,并从他们的本地主机加载它们。通过这种方式,可以实时进行主动开发,并且可以在部署到生产之前测试新功能。此方法对于调试生产问题也很有用。示例:如果开发人员想要测试新代码将如何影响生产网站:http://www.mysite.com 所有 Java 脚本来自:http://mysite.com/scripts/all_java_script.js 文件,他们可以编写一个匹配“http://mysite.com/scripts/all_java_script.js”的规则并从本地主机“http://localhost/all_java_script.js”加载它- 设置匹配不同正则表达式模式的代理规则。开发人员可以为不同的代理规则编写不同的匹配模式。 – 脚本注入允许向网站添加新的 CSS 或 Java 脚本以进行测试。可以在此处找到有关如何使用它的详细说明和示例:https://www.toni-develops.com/a-homepage-section/projects/using-dev-helper-chrome-extension-for-local-development/