angularjs 如何检测页面中使用的JS框架/库?

xyhw6mcr  于 2023-02-21  发布在  Angular
关注(0)|答案(1)|浏览(129)

我希望能够检测页面使用的所有框架/库,以帮助了解内容何时动态生成等。
我下载并解压了两个Chrome扩展Library DetectorAppspector的源代码,看起来它们只是简单地调用window.FUNCTION_NAME_HERE,例如:

'Backbone.js': function () {
  return window.Backbone && typeof(window.Backbone.sync) === 'function';
},
'Underscore.js': function () {
  return window._ && typeof(window._.identity) === 'function' &&
    window._.identity('abc') === 'abc';
},
'Spine': function () {
  return window.Spine;
},
'Angular': function () {
  return window.angular;
},
'Ning': function () {
  return window.ning;
},
'Zepto': function () {
  return window.Zepto;
}

等等。
我有几个问题:
1.每个框架的标识符是什么(例如"Spine","angular")?有没有办法通过AJAX或其他方式检索这些信息,这样我就不必手动输入它们了?
1.我真的不明白window.angular是什么意思,除了它返回Angular 对象或None之外。我知道如果Angular 函数可以通过窗口对象访问,AngularJS就已经加载了,但我真的不知道作为窗口的成员函数意味着什么。
1.为什么 Backbone 和下划线的过程与其他所有的不同?你怎么知道使用哪一个?
1.我试着在Uber主页上运行这两个扩展,它们都没有检测到React。当我尝试console.log(window)时,也没有列出React对象。这是为什么?在这些情况下,我如何仍然检测到框架?

gzszwxb4

gzszwxb41#

看起来您误解了代码检测库的工作方式,当然这与理解window对象有关。
在浏览器javascript环境中,window是全局对象,所有变量都被定义为全局window对象的属性,除非它们是在带有var关键字的函数中定义的。
假设你访问了一个使用jQuery库的页面,打开浏览器控制台,输入jQuery。它应该会响应一个函数,jQuery就是。本质上,jQuery是一个在全局作用域中定义的变量,它可以通过变量名作为变量使用,也可以作为window对象的属性使用:window.jQuery.
如果你用<script>标签包含库,默认情况下库会把自己定义为一个全局变量,所以用Backbone.js你会有一个为你定义的Backbone全局变量,它将作为window.Backbone可用,因为window是全局对象。
类似地,Angular将定义angular全局变量,Zepto将定义Zepto,以此类推。
因此,您应该能够通过库定义的全局变量来检测任何库。
然而,需要注意的是,在现代javascript应用程序中,库并不一定要注册一个全局变量。它们可以在应用程序的作用域(函数)中定义。因此,检查window.Libraryname并不能保证页面没有使用这个库。事实上,在这种情况下,检测库可能是一项非常困难的任务。
1.有太多的框架/库,所以它是由你来创建列表,或找到任何人谁维护一个。然后你会看看什么样的框架定义的全局变量,所以你可以寻找他们作为该框架的标识符。
1.正如我前面解释的,angular是全局变量,也可以作为window.angular使用,如果你创建一个作用域为angular的变量,比如function (){ var angular = "my angular"; },你仍然可以用window.angular得到全局变量。
1.代码的维护者可能知道有两个或更多的库定义了Backbone全局变量。并且只有我们知道的 Backbone.js 包含sync函数。这可能是他们额外检查Backbone.sync是否为函数的原因。他们不能只检查Backbone.sync函数而不先检查Backbone。因为在非 Backbone.js 页面上会导致错误。
类似地,对于Underscore,可能有许多库定义全局变量_,所以我们可以通过检查Underscore库的一个方法来确定它是Underscore库。
1.正如我上面提到的,库不一定要定义一个全局变量,在这种情况下,你将不能自动检测它们,例如,在一个现代的javascript应用程序中,你可以使用一个库作为BrowserifyRequireJS的依赖项,在这种情况下,库很可能不会注册任何全局变量。

相关问题