音效素材网提供各类素材,打造精品素材网站!

站内导航 站长工具 投稿中心 手机访问

音效素材

使用Google CDN导致网站页面无法加载的问题解决
日期:2021-09-08 14:04:34   来源:脚本之家

国内网非常多的网站都使用免费的 Google CDN 服务来加载某些 js、字体样式库以提升网页浏览体验,例如 jQuery、Google Fonts。但是目前 Google 的大多数网站在大陆无法正常访问,因此这些本身是加快网页载入的库反而成为了阻塞网站加载的原因。这种情况国内的网站并不多,但是国外的网站却非常多地使用这些库。一般地,当 Google CDN 库称为网页加载的限制因素时,浏览器状态条会显示状态为 “正在等待 ajax.googleapis.com 的响应...” 或 “正在连接...” 等字样。
20165494100327.png (500×325)

如果打开控制台,能看见 Google CDN 确实正在阻塞网页加载。如果等待足够长的时间,浏览器最终会放弃加载,并呈现一个残缺的网页,这并不好。下面从网页开发者、浏览器用户的角度给出一些解决方案。
对于网页开发者:选用其它 CDN 库

网页开发者必须考虑到这个问题,因此在设计网站时就应该考虑弃用 Google CDN 库。如果访者大多来自国内,可以考虑使用百度 CDN、新浪 CDN 库,它们都包含了非常常用的 JS 库文件。如果有面向国际的访客,则可以考虑使用微软的 ASP.NET CDN。

例如以下是使用微软 CDN 加载 jQuery 的一个范例:

JavaScript Code复制内容到剪贴板
  1. <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.2.min.js" type="text/javascript"></script>   

如果要使用 Google Fonts,则可以使用 360 提供的代理 CDN。这样一来,即时要使用 Google Fonts 网页字体,网页的速度也不会受到干扰和阻塞。

修改 hosts

对于用户,我们无法直接令浏览的网页弃用其正在使用的 Google CDN,从而出现无法加载的情况,那应该怎么办呢?解决方案之一就是修改 hosts。通过修改 hosts,强迫 CDN 域名指向指定的 IP,得以成功从 Google 加载这些文件。

值的一提的是,有一部分 Google CDN,例如 fonts.googleapis.com、fonts.gstatic.com,它们可以被解析到首都的 IP 地址,因此如果在 DNS 解析失效的情况下,通过 hosts 将这些域名直接指向首都的 IP 是最好、最快速的。

当然,如果 Google 改变心意,首都的服务器拒绝提供这些域名的缓存服务的话,就没有办法了。至于为什么 Google 不索性把所有的 CDN 都解析到首都,也没人清楚。
20165494125670.jpg (500×388)

修改 hosts 并不一定是好方法,因为速度可能会比较缓慢,另 hosts 可能失效。

使用 Chrome 扩展主动替换为国内 CDN

国内的一些服务器通过镜像或同步拷贝等一些方法能保留一份与 Google CDN 同样的文件专供国内用户加载。我们可以使用一款名叫 Replace Google CDN 的 Chrome 扩展插件,来主动替换浏览的网页里的 Google CDN 为国内的替代服务器。

这款插件作者为 @justjavac,Github 项目地址为 github.com/justjavac/ReplaceGoogleCDN,扩展地址为 https://chrome.google.com/webstore/detail/replace-google-cdn/kpampjmfiopfpkkepbllemkibefkiice。当然你可能需要先使用一些技巧来打开这个应用商店才能安装。

扩展插件支持替换 Google CDN 为中国科技大学提供的 CDN,支持 ajax/fonts.googleapis.com、themes.googleusercontent.com 的替换,并且支持 HTTPS。在这里要感谢他们。
20165494147137.jpg (500×255)

安装好这款插件后,浏览任何带有 Google CDN 的网页时都会被跳转到这个节点,这样就不会出现阻塞的情况了。

    您感兴趣的教程

    在docker中安装mysql详解

    本篇文章主要介绍了在docker中安装mysql详解,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编...

    详解 安装 docker mysql

    win10中文输入法仅在桌面显示怎么办?

    win10中文输入法仅在桌面显示怎么办?

    win10系统使用搜狗,QQ输入法只有在显示桌面的时候才出来,在使用其他程序输入框里面却只能输入字母数字,win10中...

    win10 中文输入法

    一分钟掌握linux系统目录结构

    这篇文章主要介绍了linux系统目录结构,通过结构图和多张表格了解linux系统目录结构,感兴趣的小伙伴们可以参考一...

    结构 目录 系统 linux

    PHP程序员玩转Linux系列 Linux和Windows安装

    这篇文章主要为大家详细介绍了PHP程序员玩转Linux系列文章,Linux和Windows安装nginx教程,具有一定的参考价值,感兴趣...

    玩转 程序员 安装 系列 PHP

    win10怎么安装杜比音效Doby V4.1 win10安装杜

    第四代杜比®家庭影院®技术包含了一整套协同工作的技术,让PC 发出清晰的环绕声同时第四代杜比家庭影院技术...

    win10杜比音效

    纯CSS实现iOS风格打开关闭选择框功能

    这篇文章主要介绍了纯CSS实现iOS风格打开关闭选择框,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作...

    css ios c

    Win7如何给C盘扩容 Win7系统电脑C盘扩容的办法

    Win7如何给C盘扩容 Win7系统电脑C盘扩容的

    Win7给电脑C盘扩容的办法大家知道吗?当系统分区C盘空间不足时,就需要给它扩容了,如果不管,C盘没有足够的空间...

    Win7 C盘 扩容

    百度推广竞品词的投放策略

    SEM是基于关键词搜索的营销活动。作为推广人员,我们所做的工作,就是打理成千上万的关键词,关注它们的质量度...

    百度推广 竞品词

    Visual Studio Code(vscode) git的使用教程

    这篇文章主要介绍了详解Visual Studio Code(vscode) git的使用,小编觉得挺不错的,现在分享给大家,也给大家做个参考。...

    教程 Studio Visual Code git

    七牛云储存创始人分享七牛的创立故事与

    这篇文章主要介绍了七牛云储存创始人分享七牛的创立故事与对Go语言的应用,七牛选用Go语言这门新兴的编程语言进行...

    七牛 Go语言

    Win10预览版Mobile 10547即将发布 9月19日上午

    微软副总裁Gabriel Aul的Twitter透露了 Win10 Mobile预览版10536即将发布,他表示该版本已进入内部慢速版阶段,发布时间目...

    Win10 预览版

    HTML标签meta总结,HTML5 head meta 属性整理

    移动前端开发中添加一些webkit专属的HTML5头部标签,帮助浏览器更好解析HTML代码,更好地将移动web前端页面表现出来...

    移动端html5模拟长按事件的实现方法

    这篇文章主要介绍了移动端html5模拟长按事件的实现方法的相关资料,小编觉得挺不错的,现在分享给大家,也给大家...

    移动端 html5 长按

    HTML常用meta大全(推荐)

    这篇文章主要介绍了HTML常用meta大全(推荐),文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参...

    cdr怎么把图片转换成位图? cdr图片转换为位图的教程

    cdr怎么把图片转换成位图? cdr图片转换为

    cdr怎么把图片转换成位图?cdr中插入的图片想要转换成位图,该怎么转换呢?下面我们就来看看cdr图片转换为位图的...

    cdr 图片 位图

    win10系统怎么录屏?win10系统自带录屏详细教程

    win10系统怎么录屏?win10系统自带录屏详细

    当我们是使用win10系统的时候,想要录制电脑上的画面,这时候有人会想到下个第三方软件,其实可以用电脑上的自带...

    win10 系统自带录屏 详细教程

    + 更多教程 +
    网站运营微信营销网络赚钱