Javascript：检测/防止外部脚本 [英] Javascript: Detect/Prevent External Scripts
问题描述
是否可以检测可能通过浏览器加载项，代理，xss等加载到页面中的外部脚本？
Is it possible to detect external scripts that might be loaded into a page by browser add-ons, a proxy, xss, etc?
说我有这个网页页面：
<html>
<head>
<title>Hello world!</title>
<script src="http://mydomain.com/script.js"></script>
</head>
<body>
Hello world!
</body>
</html>
是否可以在我的 script.js中包含一些脚本文件将检测页面上的其他脚本元素何时 不 来自 http：/ /mydomain.com ？
Would it be possible to include some script in my script.js file that would detect when other script elements on the page do not originate from http://mydomain.com?
我想要的东西能够以某种方式检测其他脚本包含在源中（即它们在onload事件触发时出现并且在页面加载之后的任何时间添加脚本
I want something that could detect other scripts somehow included in the source (i.e. they are present when the onload event fires) and scripts added any time after page load.
如果我能检测到这些脚本，我是否也可以停止他们不知何故？
If I can detect those scripts, can I also stop them somehow?
如果我知道还有其他事情发生的话，这对调试用户报告的javascript / ui问题非常有用。
This would be useful in debugging javascript/ui issues reported by users if I knew there was other stuff going on.
我使用jQuery，所以jQuery的答案对我有用。我只是不想限制jQuery的答案。
I use jQuery, so a jQuery answer will work for me. I just didn't want to limit answers to jQuery only.
编辑
我的解决方案如下。但是，它有两个（潜在的）问题：
My solution is below. However, there are two (potential) problems with it:
- 这取决于jQuery。
- 它不会检测通过CSS @import规则（或具有
url（）值的任何规则）加载的外部资源。
- It depends on jQuery.
- It will not detect foreign resources loaded via CSS @import rules (or any rule with a
url()value).
如果有人想提交解决其中一个或两个问题的答案，我会对其进行投票。
If someone would like to submit an answer that solves one or both of those issues, I will upvote it.
如果你两个都解决了，我会接受你的回答。
推荐答案
我对收到的答案不满意（虽然我很欣赏AndreasKöberle的建议），所以我决定自己解决这个问题。
I wasn't satisfied with the answers I received (though I appreciate Andreas Köberle's advice), so I decided to tackle this myself.
我写了一个可以按需运行的函数，并识别任何带有外源的html元素。这样，我可以在报告javascript错误时运行此命令以获取有关环境的更多信息。
I wrote a function that could be run on demand and identify any html elements with foreign sources. This way, I can run this whenever reporting a javascript error to get more information about the environment.
取决于jQuery（对不起，元素选择更容易）和 parseUri（）（复制在这个答案的底部）
Depends on jQuery (sorry, element selection was just so much easier) and parseUri() (copied at the bottom of this answer)
/**
* Identifies elements with `src` or `href` attributes with a URI pointing to
* a hostname other than the given hostname. Defaults to the current hostname.
* Excludes <a> links.
*
* @param string myHostname The hostname of allowed resources.
* @return array An array of `ELEMENT: src` strings for external resources.
*/
function getExternalSources(myHostname)
{
var s, r = new Array();
if(typeof myHostname == 'undefined')
{
myHostname = location.hostname;
}
$('[src], [href]:not(a)').each(function(){
s = (typeof this.src == 'undefined' ? this.href : this.src);
if(parseUri(s).hostname.search(myHostname) == -1)
{
r.push(this.tagName.toUpperCase() + ': ' + s);
}
});
return r;
}
用法
Usage
var s = getExternalSources('mydomain.com');
for(var i = 0; i < s.length; i++)
{
console.log(s[i]);
}
// Can also do the following, defaults to hostname of the window:
var s = getExternalSources();
搜索包含子域名，因此源代码为 www.mydomain的元素上面的例子中允许使用.com 或 img.mydomain.com 。
The search is inclusive of subdomains, so elements with sources of www.mydomain.com or img.mydomain.com would be allowed in the above example.
请注意，这不会在CSS @import 规则（或任何带有 url的CSS规则）中获取外来源（）就此而言）。如果有人愿意提供可以做到这一点的代码，我会upvote并接受你的回答。
Note that this will not pick up on foreign sources in CSS @import rules (or any CSS rule with a url() for that matter). If anyone would like to contribute code that can do that, I will upvote and accept your answer.
以下是代码for parseUri（），我是从 https：//获得的gist.github.com/1847816 （稍加修改）。
Below is the code for parseUri(), which I obtained from https://gist.github.com/1847816 (and slightly modified).
(function(w, d){
var a,
k = 'protocol hostname host pathname port search hash href'.split(' ');
w.parseUri = function(url){
a || (a = d.createElement('a'));
a.href = url;
for (var r = {}, i = 0; i<8; i++)
{
r[k[i]] = a[k[i]];
}
r.toString = function(){return a.href;};
r.requestUri = r.pathname + r.search;
return r;
};
})(window, document);
这篇关于Javascript：检测/防止外部脚本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
