javascript - 查找所有外部 css/js 文件和文件引用

Question

我下载了一个 Bootstrap 主题。

很多主题，就像这个一样，使用来自 CDN 的外部资源链接，例如 fonts.googleapis 和 MaxCDN。我更喜欢将所有文件存储在服务器上，这样我就不必对 CDN 进行额外的调用，而且有时我在互联网质量差或没有互联网且无法上网的地方工作访问这些文件会中断程序的流程。

是否有一种工具可以遍历所有 css 和 js 文件并找到所有不使用相对路径的文件？或者也许是另一种解决方案？我尝试使用开发人员工具检查 Network，但它会输出所有正在加载的资源和调用它们的页面，但不会输出使用它们的文件。标题示例:

**General**

Remote Address:xxx.xxx.xx.xx:80
Request URL:http://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic
Request Method:GET
Status Code:200 OK

**Response Headers**

view source
Alternate-Protocol:80:quic,p=1
Cache-Control:private, max-age=86400, stale-while-revalidate=604800
Content-Encoding:gzip
Content-Length:988
Content-Type:text/css
Date:Fri, 24 Apr 2015 06:59:08 GMT
Expires:Fri, 24 Apr 2015 06:59:08 GMT
Last-Modified:Fri, 24 Apr 2015 06:59:08 GMT
Server:GSE
Timing-Allow-Origin:*
X-Content-Type-Options:nosniff
X-Frame-Options:SAMEORIGIN
X-XSS-Protection:1; mode=block

**Request Headers**

view source
Accept:text/css,*/*;q=0.1
Accept-Encoding:gzip, deflate, sdch
Accept-Language:ru-RU,ru;q=0.8,en-US;q=0.6,en;q=0.4
Cache-Control:no-cache
Connection:keep-alive
Host:fonts.googleapis.com
Pragma:no-cache
Referer:http://mycrm.ru/admin/students
User-Agent:Mozilla/5.0 (Windows NT 6.3; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/42.0.2311.90 Safari/537.36
X-Client-Data:CJO2yQEIo7bJAQiptskBCMG2yQEI8YjKAQ==

**Query String Parameters**

view source
view URL encoded
family:Source Sans Pro:300,400,600,700,300italic,400italic,600italic

如您所见，它仅指向资源以及使用使用此调用的文件的页面，http://mycrm.ru/admin/students，但不指向文件所在的位置它实际上正在被调用和使用。加上检查每一个条目以检查是否很长。

昨天在用localhost开发的时候出现了这个问题，网络断了。我以为我通常可以继续开发，但在每次加载时它都会卡住大约 40 秒，然后给我一个错误，该错误指向我的标题中的第一个 JS 文件；我的页眉设置方式首先是所有样式，然后是所有脚本。我唯一的线索是 chrome 右下角的“正在加载文件 xxx”。我使用搜索发现 @import url(//fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic); 是其中一个的罪魁祸首CSS 文件。但只是在经历了相当多的挫折之后。

有人知道可能的解决方案吗？

Answer 1

• 在 Chrome 中，打开检查器/开发人员工具(大多数情况下是 F12)。
• 检查“来源”标签

您将能够可视化大部分 css/js 文件。域中的那些很可能排在列表的第一位。然后，跟随没有指定域的那些和其他有指定域的。在那里(希望它是这样说的 ^^")，您不会只找到 CSS 和 JS。可能还有用于广告按钮等的代码。

我不能肯定这就是您的网站将使用的所有文件，但我认为这是一个很好的开始。