Grunt模块将所有静态资产上传到S3 / CloudFront,替换路径并使旧资产失效 [英] Grunt module(s) to upload all static assets to S3 / CloudFront, replace paths, and invalidate old assets

查看:99
本文介绍了Grunt模块将所有静态资产上传到S3 / CloudFront,替换路径并使旧资产失效的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

使用Grunt,NodeJs和Express,我应该使用哪个模块:

Using Grunt, NodeJs and Express, what module(s) should I use to:


  1. 发现所有静态资产(应用程序中的前端JS,CSS,图像),通过查看资产目录或通过代码库进行解析

  1. Discover all static assets (frontend JS, CSS, images) in the app, either by looking at an asset directory or parsing through the codebase

将资产上传到Amazon S3 / CloudFront,重命名每个文件都具有唯一的指纹名称

Upload assets to Amazon S3 / CloudFront, renaming each file with a unique "fingerprinted" name

使用CloudFront URL替换代码库中每个资产的路径

Replace each asset's path in the codebase with the CloudFront URL

使旧的CDN资产无效

这是我第一次使用CloudFront。我不确定是否可以使用Grunt来完成上述所有操作,或者是否最好将其作为Node / Express模块​​来完成。

This is my first time using CloudFront. I am not sure if all of the above can be accomplished with Grunt, or whether it is best accomplished as a Node/Express module.

使用Rails,我已经读过它像一样简单:

With Rails, I've read it's as easy as:

# Setup amazon CDN
config.action_controller.asset_host = "xxxxxxxxxxxxx.cloudfront.net"

,并且我正在寻找类似的Node堆栈解决方案。

and I'm looking for a similar solution for a Node stack.

推荐答案

使CDN资产无效是一个坏主意®。在CloudFront中,最多可能需要15分钟才能完成-这将为您的部署增加15分钟。另外,某些浏览器可能会因为URL相同而保存旧文件。

Invalidating CDN assets is a Bad Idea ®. In CloudFront, it may take up to 15 minutes to complete - that would be adding 15 minutes to your deploy. Also, some browsers may hold old files because the URL is the same.

相反,您应该对静态资产进行版本控制,并以不同的版本名称发布新版本。

Instead, you should probably version you static assets and publish new versions under different version names.

例如:

my-app/1.2.3/main.js
my-app/1.2.4/main.js

以此类推

这给您带来两个好处:


  • 您可以永久缓存,信心十足地。相同的URL将始终提供相同的文件。

  • 在进行灾难部署时,您可以快速回滚。

要部署到S3,有一些特定的插件。
但是,我更喜欢与官方 grunt-shell 一起使用a href = https://aws.amazon.com/cli/?nc2=h_ls rel = noreferrer> Amazon AWS CLI

For deploying to S3, there are specific plugins for that. I, however, prefer to simply use grunt-shell in tandem with the official Amazon AWS CLI

配置看起来像这样:

shell: {
  cp: {
    command: "aws s3 cp --recursive dist/ s3://my-bucket/my-app/"
  }
}

您可以使用grunt从某个位置读取版本变量,并将所有文件自动放在 dist / {version} / 文件夹中,同时替换任何html中正确的版本路径的路径。

You can use grunt to read a version variable from somewhere and automatically put all files inside the dist/{version}/ folder, while replacing any paths in your html to the correct version path.

这篇关于Grunt模块将所有静态资产上传到S3 / CloudFront,替换路径并使旧资产失效的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆