Question

我有一个角度应用程序，我通过gulp文件在本地提供浏览器同步。

var argv          = require('yargs').argv;
var browserSync   = require('browser-sync').create();
var gulp          = require('gulp');
var gzip          = require('gulp-gzip');
var compression   = require("compression");

//use compression to set response gzip headers
gulp.task('serve', function () {
    browserSync.init({
        server: {
            baseDir: paths.public,
            middleware: compression()
        },
        port: port
    });
});

//gzip js and add to public
gulp.task('js', function () {
    return (source('app.js'))
    .pipe(gzip({append: false})) 
    .pipe(gulp.dest(paths.public))
});

的index.html

<script src="app.js"></script>

请求标头：Accept-Encoding:gzip, deflate, sdch, br

回复标题：Content-Encoding:gzip

gzipped app.js将返回浏览器

�ܽk{�F�0�y�+ �^  �Z��dvwH�\ŗD;��23{(ƃIH$@�e����SU}A7.����yޣɘ@�/��U�U����x�E�4Ϭ�Y���Z��N�V�:;{�0��%=}
+��w�$[Er�J���mY�>8�},�:8�"Y���
�ҽS�S���4�u�gɭ��(�±�Y�/�q���<�W��:���#��v��i��Zc/��ķ_�y��ՋO?����囏??��x���|��_'_y�,{����}���(�͜�'>1  ���f>e<
�Q_�Z:� �%���XU2aw[���   ��A�C�1w����'�7K��r�Ϗ���)�
�����zC���q,1Ѷ������X����NN��$\���y�,�E��J��~�&�QM�+�++���$~���|k��ӬC�gI ���>}�|�?}�^��^+V�l�D�V:���%�Ӏ�Hh5(��֑����$���rL�
X�$X&V`!�

基本上看起来我成功地压缩文件并提供服务看起来浏览器接收到gzip压缩文件，并且标题知道它应该解压缩，但它会在浏览器中以这个奇怪的编码文本着陆。

当我在本地查看服务器上的代码时，它只是二进制文件。

知道我需要做什么才能让浏览器进入ungzip并加载我的脚本？

Answer 1

您已使用gzip获取内容并对其进行压缩。然后你已经使用了gzip内容并使用gzip编码提供了它。这基本上在同一内容上应用gzip两次，而浏览器只能理解HTTP传输中使用的那个。

我建议您从代码中删除此行：

.pipe(gzip({append: false}))

您似乎希望预先压缩内容以进行存储，以便为gzip传输压缩服务做好准备。虽然看起来可能，但我不确定如何在Node中执行此操作。 This answer可能有所帮助，但是：

connect-gzip-static模块似乎是这样做的。我还没有测试过它。

它不支持动态解压缩客户端不支持压缩的资产，这意味着您需要在服务器上保留资产的未压缩副本，并且您必须确保它们是同步。

gzip编码javascript由本地节点服务器提供，浏览器同步

1 个答案: