stackoom
  简体   繁体   中英

Some images on a page is not shown through Varnish Cache-304 Not modified

 原文  2017-12-30 14:50:36  6   1    linux/ apache/ caching/ varnish/ http-status-code-304

Question

I am using varnish to speed up a customer's website load time. I have a problem with the images on a page. The Images on a page are not shown on the page. here is the chrome output headers when I hit Ctrl+f5: 

Request URL:https://DOMAINNAME/wp-content/uploads/2017/12/telegram-768x255.png
Request Method:GET
Status Code:200 OK
Remote Address:IPADDRESS:443
Referrer Policy:no-referrer-when-downgrade
Response Headers
view source
Accept-Ranges:bytes
Age:28
Connection:keep-alive
Content-Length:96169
Content-Type:image/png
Date:Sat, 30 Dec 2017 14:38:40 GMT
Last-Modified:Sat, 16 Dec 2017 11:06:23 GMT
Server:Litespeed
Strict-Transport-Security:max-age=31536000
X-Cache:HIT
X-Configured-By:ServerSetup.co
Request Headers
view source
Accept:text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8
Accept-Encoding:gzip, deflate, br
Accept-Language:en-US,en;q=0.9
AlexaToolbar-ALX_NS_PH:AlexaToolbar/alx-4.0.1
Cache-Control:no-cache
Connection:keep-alive
Cookie:_ga=GA1.2.1062445401.1514382767; _gid=GA1.2.498856688.1514639806
Host:HOSTNAME
Pragma:no-cache
Upgrade-Insecure-Requests:1
User-Agent:Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Ubuntu Chromium/63.0.3239.84 Chrome/63.0.3239.84 Safari/537.36

and here's the output when I hit Enter on the address bar: 

Request URL:https://DOMAINNAME/wp-content/uploads/2017/12/telegram-768x255.png
Request Method:GET
Status Code:304 Not Modified
Remote Address:IPADDRESS:443
Referrer Policy:no-referrer-when-downgrade
Response Headers
view source
Age:271
Connection:keep-alive
Content-Type:image/png
Date:Sat, 30 Dec 2017 14:42:43 GMT
Last-Modified:Sat, 16 Dec 2017 11:06:23 GMT
Server:Litespeed
Strict-Transport-Security:max-age=31536000
X-Cache:HIT
X-Configured-By:ServerSetup.co
Request Headers
view source
Accept:text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8
Accept-Encoding:gzip, deflate, br
Accept-Language:en-US,en;q=0.9
AlexaToolbar-ALX_NS_PH:AlexaToolbar/alx-4.0.1
Cache-Control:max-age=0
Connection:keep-alive
Cookie:_ga=GA1.2.1062445401.1514382767; _gid=GA1.2.498856688.1514639806
Host:HOSTNAME
If-Modified-Since:Sat, 16 Dec 2017 11:06:23 GMT
Upgrade-Insecure-Requests:1
User-Agent:Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Ubuntu Chromium/63.0.3239.84 Chrome/63.0.3239.84 Safari/537.36

and here's is the varnishlog for the image url: 

varnishlog -g request -q "ReqUrl ~ 'wp-content/uploads/2017/12/telegram-768x255.png'"

*   << Request  >> 870337886 
-   Begin          req 870337885 rxreq
-   Timestamp      Start: 1514645156.766974 0.000000 0.000000
-   Timestamp      Req: 1514645156.766974 0.000000 0.000000
-   ReqStart       192.168.1.106 42860
-   ReqMethod      GET
-   ReqURL         /wp-content/uploads/2017/12/telegram-768x255.png
-   ReqProtocol    HTTP/1.0
-   ReqHeader      X-Real-IP: 192.168.1.104
-   ReqHeader      X-Forwarded-For: 46.225.112.57
-   ReqHeader      X-Forwarded-Proto: https
-   ReqHeader      X-Nginx: on
-   ReqHeader      Host: HOSTNAME
-   ReqHeader      Connection: close
-   ReqHeader      Pragma: no-cache
-   ReqHeader      Cache-Control: no-cache
-   ReqHeader      User-Agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Ubuntu Chromium/63.0.3239.84 Chrome/63.0.3239.84 Safari/537.36
-   ReqHeader      Accept: image/webp,image/apng,image/*,*/*;q=0.8
-   ReqHeader      Referer: https://DOMAINNAME/contactus/
-   ReqHeader      Accept-Encoding: gzip, deflate, br
-   ReqHeader      Accept-Language: en-US,en;q=0.9
-   ReqHeader      Cookie: _ga=GA1.2.1062445401.1514382767; _gid=GA1.2.498856688.1514639806; _gat=1
-   ReqUnset       X-Forwarded-For: 46.225.112.57
-   ReqHeader      X-Forwarded-For: 46.225.112.57, 192.168.1.106
-   VCL_call       RECV
-   ReqUnset       Cookie: _ga=GA1.2.1062445401.1514382767; _gid=GA1.2.498856688.1514639806; _gat=1
-   ReqHeader      Cookie: 
-   ReqUnset       Cookie: 
-   ReqHeader      Cookie: 
-   ReqUnset       Cookie: 
-   ReqHeader      Cookie: 
-   ReqUnset       Cookie: 
-   ReqHeader      Cookie: 
-   ReqUnset       Cookie: 
-   ReqUnset       Accept-Encoding: gzip, deflate, br
-   ReqHeader      Accept-Encoding: gzip
-   ReqUnset       X-Forwarded-For: 46.225.112.57, 192.168.1.106
-   ReqHeader      X-Forwarded-For: 46.225.112.57, 192.168.1.106
-   ReqUnset       Accept-Language: en-US,en;q=0.9
-   ReqUnset       User-Agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Ubuntu Chromium/63.0.3239.84 Chrome/63.0.3239.84 Safari/537.36
-   ReqHeader      cookie: 
-   ReqUnset       cookie: 
-   ReqHeader      cookie: 
-   VCL_return     hash
-   VCL_call       HASH
-   VCL_return     lookup
-   Hit            870337573
-   VCL_call       HIT
-   VCL_return     deliver
-   RespProtocol   HTTP/1.1
-   RespStatus     200
-   RespReason     OK
-   RespHeader     Date: Sat, 30 Dec 2017 14:37:35 GMT
-   RespHeader     Server: Apache/2.2.15 (CentOS)
-   RespHeader     Last-Modified: Sat, 16 Dec 2017 11:06:23 GMT
-   RespHeader     Content-Length: 96169
-   RespHeader     Content-Type: image/png
-   RespHeader     X-Varnish: 870337886 870337573
-   RespHeader     Age: 464
-   RespHeader     Via: 1.1 varnish-v4
-   VCL_call       DELIVER
-   RespHeader     X-Cache: HIT
-   RespUnset      X-Varnish: 870337886 870337573
-   RespUnset      Via: 1.1 varnish-v4
-   RespHeader     X-Configured-By: ServerSetup.co
-   RespUnset      Server: Apache/2.2.15 (CentOS)
-   RespHeader     Server: Apache
-   VCL_return     deliver
-   Timestamp      Process: 1514645156.767049 0.000075 0.000075
-   Debug          "RES_MODE 2"
-   RespHeader     Connection: close
-   RespHeader     Accept-Ranges: bytes
-   Timestamp      Resp: 1514645156.767130 0.000156 0.000081
-   Debug          "XXX REF 2"
-   ReqAcct        631 0 631 267 96169 96436
-   End

The problem is that the image is not shown on the page, but it is shown in preview section of the chrome developer panel. Moreover if I open the image in a new tab in browser it is shown properly. Varnish version is 4.0.4. and the web server is Apache 2.2.

Edit: When I load the page through varnish I get the following errors on the console tab (chrome): 

(index):1820 Uncaught ReferenceError: tinymce is not defined
    at HTMLDocument.<anonymous> ((index):1820)
    at HTMLDocument.dispatch (jquery.js:3)
    at HTMLDocument.r.handle (jquery.js:3)
    at Object.trigger (jquery.js:3)
    at Object.a.event.trigger (jquery-migrate.min.js:2)
    at HTMLDocument.<anonymous> (jquery.js:3)
    at Function.each (jquery.js:2)
    at a.fn.init.each (jquery.js:2)
    at a.fn.init.trigger (jquery.js:3)
    at HTMLDocument.<anonymous> ((index):1316)

But when I load the page directly from backend server, there is no errors and the images are shown properly!!

Edit: varnish log for 304 Not Modified 

*   << Request  >> 885566068 
-   Begin          req 885566067 rxreq
-   Timestamp      Start: 1515309410.697993 0.000000 0.000000
-   Timestamp      Req: 1515309410.697993 0.000000 0.000000
-   ReqStart       192.168.1.106 33782
-   ReqMethod      GET
-   ReqURL         /wp-content/uploads/2017/12/Untitled-1.png
-   ReqProtocol    HTTP/1.0
-   ReqHeader      X-Real-IP: 192.168.1.104
-   ReqHeader      X-Forwarded-For: 46.225.112.57
-   ReqHeader      X-Forwarded-Proto: https
-   ReqHeader      X-Nginx: on
-   ReqHeader      Host: bigtheme.ir
-   ReqHeader      Connection: close
-   ReqHeader      Cache-Control: max-age=0
-   ReqHeader      User-Agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Ubuntu Chromium/63.0.3239.84 Chrome/63.0.3239.84 Safari/537.36
-   ReqHeader      Upgrade-Insecure-Requests: 1
-   ReqHeader      Accept: text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8
-   ReqHeader      Accept-Encoding: gzip, deflate, br
-   ReqHeader      Accept-Language: en-US,en;q=0.9
-   ReqHeader      Cookie: _ga=GA1.2.1062445401.1514382767; _gid=GA1.2.1237154839.1515307013
-   ReqHeader      If-None-Match: "9a2989-38271-560731bc13e20"
-   ReqHeader      If-Modified-Since: Sat, 16 Dec 2017 11:06:26 GMT
-   ReqUnset       X-Forwarded-For: 46.225.112.57
-   ReqHeader      X-Forwarded-For: 46.225.112.57, 192.168.1.106
-   VCL_call       RECV
-   ReqUnset       Cookie: _ga=GA1.2.1062445401.1514382767; _gid=GA1.2.1237154839.1515307013
-   ReqHeader      Cookie: 
-   ReqUnset       Cookie: 
-   ReqHeader      Cookie: 
-   ReqUnset       Cookie: 
-   ReqHeader      Cookie: 
-   ReqUnset       Cookie: 
-   ReqHeader      Cookie: 
-   ReqUnset       Cookie: 
-   ReqUnset       Accept-Encoding: gzip, deflate, br
-   ReqUnset       X-Forwarded-For: 46.225.112.57, 192.168.1.106
-   ReqHeader      X-Forwarded-For: 46.225.112.57, 192.168.1.106
-   ReqUnset       Accept-Language: en-US,en;q=0.9
-   ReqUnset       User-Agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Ubuntu Chromium/63.0.3239.84 Chrome/63.0.3239.84 Safari/537.36
-   ReqHeader      cookie: 
-   ReqUnset       cookie: 
-   ReqHeader      cookie: 
-   VCL_return     hash
-   VCL_call       HASH
-   VCL_return     lookup
-   Hit            885027311
-   VCL_call       HIT
-   VCL_return     deliver
-   RespProtocol   HTTP/1.1
-   RespStatus     200
-   RespReason     OK
-   RespHeader     Date: Sun, 07 Jan 2018 07:15:40 GMT
-   RespHeader     Server: Apache/2.2.15 (CentOS)
-   RespHeader     Last-Modified: Sat, 16 Dec 2017 11:06:26 GMT
-   RespHeader     Content-Length: 230001
-   RespHeader     Content-Type: image/png
-   RespHeader     X-Varnish: 885566068 885027311
-   RespHeader     Age: 33
-   RespHeader     Via: 1.1 varnish-v4
-   VCL_call       DELIVER
-   RespHeader     X-Cache: HIT
-   RespUnset      X-Varnish: 885566068 885027311
-   RespUnset      Via: 1.1 varnish-v4
-   RespHeader     X-Configured-By: ServerSetup.co
-   RespUnset      Server: Apache/2.2.15 (CentOS)
-   RespHeader     Server: Litespeed
-   VCL_return     deliver
-   Timestamp      Process: 1515309410.698046 0.000053 0.000053
-   RespProtocol   HTTP/1.1
-   RespStatus     304
-   RespReason     Not Modified
-   RespReason     Not Modified
-   RespUnset      Content-Length: 230001
-   Debug          "RES_MODE 0"
-   RespHeader     Connection: close
-   Timestamp      Resp: 1515309410.698061 0.000068 0.000015
-   Debug          "XXX REF 2"
-   ReqAcct        731 0 731 231 0 231
-   End

1 answers

solution1
 0  2018-01-02 14:35:16

As your console tab shows, the problem is with a HTML document or Javascript (jquery), not with the image itself. Moreover, why isn't your varnishlog showing the second request? What server is returning the "304 Not Modified"? There's something in between Chrome and Varnish. A Chrome plugin?

暂无
暂无

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

Related Question Amcharts images “304 Not Modified” error Starting Varnish Cache: [FAILED] … how to debug varnish? Varnish no cache for my web site varnish 4 cache age always zero how remove PHPSESSIONID from varnish cache How to install varnish cache on AWS elastic beanstalk? Linux Varnish Cache Server - Guru Meditation 503 How are images shown in the terminal varnish cache http 301 302 header location redirects plone.app.caching and settings Varnish to purge the cache
Related Tags
 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM