使用 RequireJS 从 CDN 加载本地项目静态资产

Question

我有一个单页应用程序，其中节点提供主干应用程序以及所有营销材料。我想从我们的 Rackspace Cloudfiles CDN 提供所有资产（JS、html、图像），以减少加载时间，因为 gzip 文件将被交付并减少我的节点服务器上的负载。

自动化的最佳方法是什么？

我需要：

• 构建后同步文件到 CDN
• 在生产模式下为所有静态资产引用 CDN

我找到了在我的项目中使用的 Grunt 和 Node 模块的解决方案。

Grunt CDN
Grunt Cloud Files
Node Asset Rack

如果我选择 Grunt - 这是我的第一选择，

1. 如何将我正在运行的 express 应用程序设置为从生产中的 CDN 提供服务？
2. 将资产管理器用于节点是否更好，因为它仍然为我的所有资产提供服务？

Answer 1

如何将我正在运行的 express 应用程序设置为从生产中的 CDN 提供服务？

当你渲染你的视图时，你可以传递一个标志来告诉你从哪里挑选资源。

如果你有兴趣，我这里有一个例子。就我而言，我有一个关于我是否连接到网络的标志（例如在飞行期间）来决定从哪里选择我的 JS 文件：

<% if(isConnected) { %> 
      <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
      <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
      <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>    
      <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular-resource.min.js"></script>    
      <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular-cookies.min.js"></script>    
    <% } else { %>
      <script src="/js/jquery.min.js"></script>
      <script src="/js/bootstrap.min.js"></script>
      <script src="/js/angular.min.js"></script>
      <script src="/js/angular-resource.min.js"></script>
      <script src="/js/angular-cookies.min.js"></script>
    <% } %>

https://github.com/hectorcorrea/hectorcorrea.com/blob/master/views/index.ejs#L136

在我的示例中，该值是硬编码的，但您可以轻松地将 Express dev/prod 值传递给视图以自动完成相同的操作。