Google CDN Jquery 加载不工作答案

【问题标题】：Google CDN Jquery load not workingGoogle CDN Jquery 加载不工作
【发布时间】：2011-09-23 22:03:38
【问题描述】：

目前，我的一个布局中有一组难看的单独 javascript 文件，我正在尝试使用 Google CDN 对其进行清理。

当前状态（我知道很可怕）：

...css...  
<%= yield :head %>

<%= javascript_include_tag "https://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js" %>
<script type="text/javascript" src="http://cdn.jquerytools.org/1.2.5/all/jquery.tools.min.js"></script>
<%= javascript_include_tag "https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/jquery-ui.min.js" %>
<%= javascript_include_tag "ui/jquery.ui.core", "ui/jquery.effects.core",
   "ui/jquery.effects.highlight", "ui/jquery.ui.widget", "ui/jquery.ui.tabs",
   "ui/jquery.ui.progressbar" %>
<%= javascript_include_tag "jquery.ui.stars.min", "application", "rails" %>

我尝试将底部标记的第二个（带有长长的文件列表）替换为：

<%= javascript_include_tag "https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/jquery-ui.min.js" %>

我没有运气 - 似乎谷歌文件根本不存在（我检查了我的页面源并已加载）。我在这里做错了什么？

【问题讨论】：

标签： javascript ruby-on-rails google-cdn

【解决方案1】：

我不知道如何将它翻译成 RAILS，但这个简单的 HTML 应该可以解决问题。

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
    if(typeof jQuery == 'undefined') {
        //<![CDATA[
        document.write("<script src='/includes/jquery-1.4.2.min.js' type='text/javascript'><\/script>");
        //]]>
    }
</script>

这将假定您的 jQuery 文件存储在 /includes/jquery-1.4.2.min.js。
在 Google 的 CDN 失败时，将获取本地副本。

【讨论】：

感谢您的回答。我注意到正在获取 Google Jquery-UI 文件，但由于某种原因，我的文档表现得好像它不存在一样。诸如 UI 选项卡、UI 进度条等之类的东西表现得就像丢失了一样。
@sscirrus 您能做的最好的事情就是使用本地系统上的所有文件运行您的应用程序。然后，慢慢地将它们传递给 CDN。从 jQuery main 开始，然后转到 UI，然后转到插件，看看它是如何为您工作的。您可能会在此过程中发现bug...
一个小注释，而不是指定协议部分...以“//ajax.googleapis.com/...”开头，使用与页面相同的协议（http/ https)。
@Tracker1 这很有意义，但是在混合了 https/http 内容的页面上弹出一个问题，如果您使用 https 加载 js 并缓存资源，它不会让整个事情变得更快您不必下载该资源两次（一个用于 http，另一个用于 https）？
@Frankie 协议应该与当前页面的协议相匹配。你不应该在 http/https 之间混合内容。

【解决方案2】：

很抱歉挖掘了一个旧帖子，但我不确定这个问题是否真的得到了回答。

我遇到了和你类似的问题，解决方案实际上很简单：我没有包含 CSS。您也可以通过 Google 的 CDN 进行操作：

<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/ui-lightness/jquery-ui.css" media="screen" rel="stylesheet" type="text/css" />

或

<%= stylesheet_link_tag 'http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/ui-lightness/jquery-ui.css' %>

显然这是针对 ui-lightness 主题的； CDN 上还有其他可用的主题（尽管不是全部）。我相信您可以通过 Google 快速搜索找到这些内容。

【讨论】：