JavaScript 可以检测用户的浏览器是否支持 gzip？答案

【问题标题】：Can JavaScript detect if the user's browser supports gzip?JavaScript 可以检测用户的浏览器是否支持 gzip？
【发布时间】：2011-11-01 11:10:30
【问题描述】：

我可以使用 JavaScript 来检测用户的浏览器是否支持 gzip 压缩的内容（客户端，而不是 node.js 或类似的）？

我正在尝试支持以下极端情况：
有很多可能的文件可以加载到特定的 Web 应用程序上，最好在应用程序运行时按需加载它们，而不是一开始就加载它们。我想用遥远的缓存到期日期从 S3 中提供这些文件。从S3 does not support gzipping files to clients that support it 开始，我想托管每个文件的两个版本——一个是普通版本，一个是gzip 压缩的content-type 设置为application/gzip。浏览器当然需要知道要请求哪些文件。如果 JavaScript 能够检测浏览器是否支持 gzip 压缩的内容，那么浏览器将能够请求正确的文件。

这可能吗？

【问题讨论】：

为什么使用 S3 进行文件传输。您应该使用 CLoudFront.. 确实如此。

标签： javascript amazon-s3 gzip

【解决方案1】：

Javascript 不能，但您可以使用 Javascript 来检测浏览器是否支持 gzip 压缩的内容。

我在上面发表了评论，并且想重申一下，无论如何您都应该使用 CloudFront，它会处理 gzip 内容。如果您使用的是 S3，那么您不想使用 CloudFront 的理由为零，但是，为了回答您的问题......

这篇博文完美地说明了如何检测浏览器是否支持 Gzip。

http://blog.kenweiner.com/2009/08/serving-gzipped-javascript-files-from.html

这里是一个简短的总结：

1) 创建一个小型 gzip 文件 gzipcheck.js.jgz，并使其在 CloudFront 中可用。该文件应包含一行代码：
gzipEnabled = true;
2) 使用以下代码尝试加载和运行此文件。您可能希望在任何其他 Javascript 代码之前将其放在 HTML HEAD 部分中。
<script type="text/javascript" src="gzipcheck.js.jgz">
</script>
如果文件加载，它会设置一个标志 gzipEnabled，指示浏览器是否支持 gzip。

【讨论】：

+1 这是一个好技巧，但 CloudFront 不压缩内容。仅当源提供压缩内容时，它才会提供压缩内容。
这是 CloudFront 关于使用 gzip 内容的说明 - 它们不会自动提供 gzip 内容，如果您使用 S3，则需要在客户端生成 gzip 版本的 URL。 docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/…

【解决方案2】：

Cloudfront 不会自动压缩内容。直到亚马逊决定在 S3 和 Cloudfront 中进行自动 gzip 压缩之前，必须使用以下解决方法。

除普通版本外，创建文件的 gzip 压缩版本并上传到 S3。如果文件名为 style.css，则压缩后的版本应命名为 style.css.gz。
向文件中添加一个标头，其中 key=Content-Encoding & value=gzip 到文件中。这是必要的，以便浏览器了解内容是使用 gzip 编码的。可以使用 S3 api 或流行的 S3 文件管理器工具（如 Cloudberry、Bucket Explorer 等）添加标头
还要为文件添加正确的 Content-Type 标头。例如 style.css 应该是 Content-Type: text/css。
在网页中正常包含文件
使用上面提到的javascript来检测浏览器是否支持gzip编码。如果找到 true 替换文件名，例如 style.css 为 style.css.gz

【讨论】：