Сервер, возвращающий несколько значений кодирования содержимого, ломает файл SVG в Chrome

При настройке приложения Rails, которое загружает ресурсы в Amazon S3 с помощью asset-sync, затем использует оба CloudFront и CloudFlare как CDN поверх Amazon, я, кажется, получаю ошибку в Chrome и Safari при доступе к файлу .svg:

Эта страница содержит следующие ошибки:

ошибка в строке 1 в столбце 1: Ошибка кодирования. Ниже приведено отображение страницы до первой ошибки.

При проверке заголовков это выглядит так:

HTTP/1.1 200 OK
Date: Wed, 01 Apr 2015 11:12:44 GMT
Content-Type: image/svg+xml
Transfer-Encoding: chunked
Connection: keep-alive
Expires: Thu, 31 Mar 2016 17:12:44 GMT
Content-Encoding: 
Cache-Control: public, max-age=31557600
Last-Modified: Tue, 31 Mar 2015 10:06:39 GMT
ETag: W/"324051aadc1c103e0c5f293d30be07c4"
X-Cache: Miss from cloudfront
Via: 1.1 xxxxxxxxxxxxxxxxxx.cloudfront.net (CloudFront)
X-Amz-Cf-Id: emRD3y9BnVdqlIenZ5CnS5KISqcW3UcRhH8JQFfPnIuidZBtyyGSoA==
CF-Cache-Status: HIT
Vary: Accept-Encoding
Server: cloudflare-nginx
CF-RAY: 1d03dc53ac8816c4-ARN
Content-Encoding: gzip

Поскольку Content-Encoding указывается дважды, я думаю, что Chrome не может правильно интерпретировать файл.

Ответ похож на мусор:

��TM��8��Wp���iQ��)v
��(0�K/�kklc;�5I��/(;ٴ3(�:H���#E
޼?�{8�i��!�J�����&_����f[uُ���0���7������m��Z�5��E��u������
ta*n������\���|�t:�)�qj|����c�R��}7<�F�,�|�P�Gc�����5��\o�ո��?�b�`����G3����t�.j��6���x�o4��VI���l������ꍿ�K�6s�-&SZSé���7�]X��=��i��s��l�G<�i|t����։�����/A���ԛ\��ƺ�|g�&��Yum�M�K�/����i|:\���������x�a����q�����8x�xx~��+�ʹ�۩��q��������F善`E�~�{�����}��ߖ�����
����sY�my0KY/���J�B��O�J;-
3�@�"�0[����B�$EH��A????��2$�\9|���Jj(�rb��`�v�� �)�q�!g%%�a�0x�*\���v��=^^q�7�8�M����=�k�/��_-0�2�$�"BKRkH0H%i� ��$���#�!q�R(Hc�J"�(@�p�����PP�Q�_a3�(YAA��`��5v `��c�;0�`��N!�"��(.=����0��7,O4D�|I>#���I���D�Q%2�(�"F/fb$�U"L��0�`�Oo�|
?8����o��/`�j

В Firefox файл загружается, и исходный код выглядит нормально:

<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="24px" height="48px" viewBox="0 0 24 48" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
    <!-- Generator: Sketch 3.2.2 (9983) - http://www.bohemiancoding.com/sketch -->
    <title>Artboard</title>
    <desc>Created with Sketch.</desc>
    <defs></defs>
    <g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
        <g id="Artboard" sketch:type="MSArtboardGroup" fill="#FFFFFF">
            <g id="svg-sprite-communication-copy" sketch:type="MSLayerGroup" transform="translate(2.000000, 3.000000)">
                <g id="ic_email_24px" transform="translate(0.000000, 25.000000)" sketch:type="MSShapeGroup">
                    <path d="M18,0 L2,0 C0.9,0 0.01,0.9 0.01,2 L0,14 C0,15.1 0.9,16 2,16 L18,16 C19.1,16 20,15.1 20,14 L20,2 C20,0.9 19.1,0 18,0 L18,0 L18,0 Z M18,4 L10,9 L2,4 L2,2 L10,7 L18,2 L18,4 L18,4 Z" id="Shape"></path>
                </g>
                <g id="ic_call_24px" transform="translate(1.000000, 0.000000)" sketch:type="MSShapeGroup">
                    <path d="M3.62,7.79 C5.06,10.62 7.38,12.93 10.21,14.38 L12.41,12.18 C12.68,11.91 13.08,11.82 13.43,11.94 C14.55,12.31 15.76,12.51 17,12.51 C17.55,12.51 18,12.96 18,13.51 L18,17 C18,17.55 17.55,18 17,18 C7.61,18 0,10.39 0,1 C0,0.45 0.45,0 1,0 L4.5,0 C5.05,0 5.5,0.45 5.5,1 C5.5,2.25 5.7,3.45 6.07,4.57 C6.18,4.92 6.1,5.31 5.82,5.59 L3.62,7.79 L3.62,7.79 Z" id="Shape"></path>
                </g>
            </g>
        </g>
    </g>
</svg>

Запрос файла напрямую из Amazon выводит только этот пустой заголовок кодирования содержимого, и файл загружается нормально:

Content-Encoding: 

То же самое происходит при запросе у CloudFront. Кажется, CloudFlare сжимает файл svg и добавляет content-encoding в соответствии с их документами:

https://support.cloudflare.com/hc/en-us/articles/200168086-Does-CloudFlare-gzip-resources-

Как я могу правильно использовать ресурсы SVG в своих приложениях Rails?


person Cristian    schedule 01.04.2015    source источник
comment
Нет ответа, но посмотрите этот пост cdnplanet.com/blog/gzip-nginx -cloudfront   -  person Anatoly    schedule 05.04.2015
comment
Спасибо, я посмотрел на него, однако я не использую nginx для обслуживания ресурсов. Они хранятся на Amazon и обслуживаются через CloudFront, а затем через CloudFlare. Я думаю, что виноват CloudFlare, поскольку до этого момента все выглядело нормально. Я отправлю им заявку в службу поддержки, если не найду другого решения.   -  person Cristian    schedule 05.04.2015
comment
Хотя я вижу, что CloudFlare использует nginx в качестве сервера: Server: cloudflare-nginx возможно, статья действительно раскрывает истинную проблему ...   -  person Cristian    schedule 05.04.2015
comment
Кэшированный ответ может быть серверами, немного отличающимися по CloudFront от S3 или CloudFlare, эта цепочка S3 - CloudFront - CloudFlare достаточно длинная, и происходит что-то неожиданное. Я бы подумал о сокращении пути   -  person Anatoly    schedule 05.04.2015


Ответы (1)


Это исправлено после обновления гема fog-aws до последней версии:

-    fog-aws (0.1.1)
+    fog-aws (0.1.2)
person Cristian    schedule 14.04.2015