如何用本地Javascript替换生产网站的Javascript？

在我的制作网站上，我编译了Javascript

<script src="/js/mycode.min.js"></script>

如果我能让我的浏览器用

<script src="http://localhost/js/mycode1.js"></script>
<script src="http://localhost/js/mycode2.js"></script>
...

...

我知道我可以使用Greasemonkey用户脚本之类的东西来操纵DOM，但我想不出一个解决方案来阻止“mycode.min.js”的执行

---

有什么想法吗？

使用类似

http://static.example.com

用于静态文件（例如.js文件）和更改主机文件

<script type="text/javascript" src="http://static.example.com/js/mycode.min.js"></script>

当然，您必须使用

http://static.example.com/

on

127.0.0.1

另一种解决方案是使用（本地）代理服务器（如Privoxy）重定向

http://example.com/js/

至

http://localhost/js/

我的工作方式：

如果您在windows上，请下载并安装

使其能够捕获http流量[IE/Chrome默认情况下会捕获，Firefox-通过安装的附加组件启用]

加载有问题的页面

在左侧的http流量列表中找到要替换的文件，然后单击它

右边有一个自动应答器选项卡。点击它

单击复选框“启用自动响应”

单击添加。。钮扣

在右边的第二个下拉列表中，选择“查找文件”选项

在对话框中找到该文件，然后单击“保存”

重复步骤4-9，直到替换所有要替换的文件

刷新浏览器窗口，新的js文件将运行

您可以替换html文件并更改页面上的js链接，而不是替换js文件

如果您在mac/linux上，则可以安装。（非免费，有试用）步骤类似，但不相同

---

如果您使用GoogleClosure压缩文件，您可以安装它们的插件来完成压缩

假设您的脚本只是生产文件的原始版本，您只需打开您喜爱的调试器或JS控制台并导入脚本：

document.body.appendChild(document.createElement("script")).src = 
    "http://localhost/js/mycode1.js";

这样做将覆盖最初定义的函数和变量。您必须手动重新运行

window.onload

。如果您的脚本立即运行，或者加载后页面上的内容发生了很大变化，那么您可能需要做一些工作才能将其恢复到原始状态

---

祝你好运

尽管epascarello的解决方案有效，但有一个更快的解决方案用于小型文件调试。考虑使用。现代的Firefox和Chrome支持它们

源代码映射的思想是告诉浏览器在哪里可以找到未统一的版本。当您在浏览器开发人员工具中启动调试时，浏览器将加载未统一版本的脚本，并在调试器中向您显示易于阅读的JavaScript（或编译为JavaScript的任何代码）。

要添加一个新的文件，您可以使用类似于另一篇文章的内容：

document.body.appendChild(document.createElement("script").src = "http://example.com/addThisJSFile.js");

此脚本可以将网页上的任何JS文件替换为域中的自定义JS文件：

// ==UserScript==
// @name         ReplaceJS
// @namespace    http://example.com/
// @version      1.0.0
// @description  Replace javascript files on any webpage!
// @author       Mr.Sonic Master
// @match        *
// @run-at       document-start
// ==/UserScript==

var newJSFile = "http://example.com/newJSFile.js"; //The JS file to load in replacment od old JS file

var oldJSFile = "oldJSFile.replaceThis.js"; //The old JS file as it is named in inspect element (make sure its spelled EXACTLY the same)

var pattern = new RegExp(oldJSFile, "i"); //Create the RegExp pattern with the /i switch to make it case-insensitive

function injectScript(originalPage) { //Function injectScript replaces the file
    console.log('Replace stage 2: Replace text matching', oldJSFile, 'with', newJSFile);
    var moddedPage = originalPage.replace(pattern, newJSFile); //Modify the HTML code that we got, replacing the old JS file with the new one
    document.open();
    console.log('Replace stage 3: Write new HTML to page...');
    document.write(moddedPage); //Write to the page the new HTML code
    document.close();
}

setTimeout(function() { //Wait a bit for the page's HTML to load...
    console.log('Replace stage 1: target HTML');
    injectScript(document.documentElement.outerHTML); //Run function injectScript with the page's HTML as oldPage in the function
}, 1111);

---

在URL中添加一些内容以区分开发环境和产品环境； 例子：

然后，使用一些javascript检查GET变量debug是否打开，或者使用
if（window.location.host.indexOf（'url\u of\u dev'）>-1）

然后使用加载函数加载或不加载文件，如本例所示：

---

不使用任何web代理，chrome功能可用于对js和css文件应用本地覆盖

---

如果IT部门出于“安全”原因没有从地狱锁定对工作场所中此文件的编辑访问权，那该多好。>：）好主意。我会的。但是这个解决方案仍然需要将所有JS代码放在一个文件中。如果原始代码操纵页面或添加事件处理程序，那么这不是一个很好的解决方案。你最终会造成更多的问题。当然。。。我在回答中也说了同样的话。但是，如果您所要做的只是调试代码，那么用这种技术替换函数就足以在代码中设置断点并进行调试。应该可以。但我会寻找其他更容易编写脚本和免费的代理解决方案。有人能为linux/osx推荐一个好的吗？更新：我为自己编写了一个小代理，它转发来自生产服务器的所有内容，并用字符串替换特定的-tag。很好，谢谢你的主意。。我欠你一杯啤酒！只是一个简短的评论，因为我不清楚：缩微版本是被解析和执行的，而不是未缩微版本。@DanielSokolowski是的，你是对的。浏览器执行缩小版本，但在开发工具中显示原始版本（未缩小），因此您可以执行逐步执行并查看变量。有趣的尝试。当我运行这段代码时，它没有达到第3阶段。关于为什么？它达到第二阶段了吗？谢谢你的回答！是的，的确如此。我已经在这个问题上创建了一个线程。

// ==UserScript==
// @name         ReplaceJS
// @namespace    http://example.com/
// @version      1.0.0
// @description  Replace javascript files on any webpage!
// @author       Mr.Sonic Master
// @match        *
// @run-at       document-start
// ==/UserScript==

var newJSFile = "http://example.com/newJSFile.js"; //The JS file to load in replacment od old JS file

var oldJSFile = "oldJSFile.replaceThis.js"; //The old JS file as it is named in inspect element (make sure its spelled EXACTLY the same)

var pattern = new RegExp(oldJSFile, "i"); //Create the RegExp pattern with the /i switch to make it case-insensitive

function injectScript(originalPage) { //Function injectScript replaces the file
    console.log('Replace stage 2: Replace text matching', oldJSFile, 'with', newJSFile);
    var moddedPage = originalPage.replace(pattern, newJSFile); //Modify the HTML code that we got, replacing the old JS file with the new one
    document.open();
    console.log('Replace stage 3: Write new HTML to page...');
    document.write(moddedPage); //Write to the page the new HTML code
    document.close();
}

setTimeout(function() { //Wait a bit for the page's HTML to load...
    console.log('Replace stage 1: target HTML');
    injectScript(document.documentElement.outerHTML); //Run function injectScript with the page's HTML as oldPage in the function
}, 1111);