0

I guess this is a very silly question, and caching will not work in this way, but let me explain what I am doing -

I have a PHP script resizeImage.php which runs on an nginx server and resizes a remote image and outputs the resized image directly on the browser, without explicitly saving it on server side. The reason we are not saving the images is we assume the write operation will take a lot of time and affect user experience (rendering ad image on user's device).

When I browse the file resizeImage.php, following is the format of the URL - http://domain/fam/resizeImage.php?srcImg=http%3A%2F%2Fcdn.someexchange.com%2Faccount%2F21554%2F320%2F0.jpg&width=50&height=50

Parameter srcImg is the URL of the remote image to be resized.

Following is what is displayed in the Elements tab of chrome browser (Developer tools) - 

<html>
   <head>
      <meta name="viewport" content="width=device-width; height=device-height;">
      <link rel="stylesheet" href="resource://gre/res/ImageDocument.css">
      <link rel="stylesheet" href="resource://gre/res/TopLevelImageDocument.css">
      <link rel="stylesheet" href="chrome://global/skin/media/TopLevelImageDocument.css">
      <title>resizeImage.php (JPEG Image, 50&nbsp;×&nbsp;50 pixels)</title>
   </head>
   <body><img src="http://54.204.70.10/fam/resizeImage.php?srcImg=http%3A%2F%2Fcdn.someexchange.com%2Faccount%2F21554%2F320%2F0.jpg&amp;width=50&amp;height=50" alt="http://54.204.70.10/fam/resizeImage.php?srcImg=http%3A%2F%2Fcdn.someexchange.com%2Faccount%2F21554%2F320%2F0.jpg&amp;width=50&amp;height=50"></body>
</html>

The response, as seen in the Network console of chrome browser is like this - 

ÿØÿàJFIFÿþ>CREATOR: gd-jpeg v1.0 (using IJG JPEG v62), default quality
ÿÛC     

 $.' ",#(7),01444'9=82<.342ÿÛC          

2!!22222222222222222222222222222222222222222222222222ÿÀ22"ÿÄ    
ÿĵ}!1AQa"q2¡#B±ÁRÑð$3br    
%&'()*456789:CDEFGHIJSTUVWXYZcdefghijstuvwxyz¢£¤¥¦§¨©ª²³´µ¶·¸¹ºÂÃÄÅÆÇÈÉÊÒÓÔÕÖ×ØÙÚáâãäåæçèéêñòóôõö÷øùúÿÄ 
ÿĵw!1AQaq"2B¡±Á    #3RðbrÑ
$4á%ñ&'()*56789:CDEFGHIJSTUVWXYZcdefghijstuvwxyz¢£¤¥¦§¨©ª²³´µ¶·¸¹ºÂÃÄÅÆÇÈÉÊÒÓÔÕÖ×ØÙÚâãäåæçèéêòóôõö÷øùúÿÚ?õïøº×Á:Ö/m.®mÖUŸRË»8'qgñïx¶ÃƾMcNhái3ÀVSß={ÑãmxÁZ¾tÌ"ôÐ|Éÿ^Gû6kÈ×49.ãSïò?òJïümñ[Gð6³m¥^Ùß]\ÜB&Qj¨på$UuÞм_/u+kØ&¨àªrÉù³À8àué^aª§ü&´Ôv¿~ÞÎéÁ`]ÌÕãX?ôµï7úM¹-åÕ´*Äp»¢dû´é2~Ò:
ê^Tz-ûÙÁ¸Þ¡±êÿ¯^¥§øÏWÓì5
,I{e{÷fpãæÏLç¸Á¯8×þx_þ)âÒ`=ZKErÓ3\á¸=8®sön×e3kËDo!R~éÈWüò}EP_4éRÇðëö¿cåX\¹íåȾjô`£ð¯¥«çÚGEj:.»Á6µU;ÿBoÊö~³Xñ|Or¹}¥A?ß˱@¿øõdxQIý§~ÛrÁ úØ;·E$\¦s^¡ðFþËøiorËu ä¹9ëì_Ñ3ø×|OÒnµßZ®bª×W2Â+6o!03Ú>ªÔõ}+JºÔn$д®ÄöQùËöq¶_êסwcb:ò!ú®ZîÃâ¥n»´ñöèBi#sL·B£¶N}ðÀ-àO¼weT¼a-ÑC*ß<ú@õQ@õUô{Õ¶Ýçwì8mÛN1ïù>Mâgu;=+V¶Öe¶Õú'Há« ÜqúUé%[+ÎÑ¡öKûÓÿß&¼<V{O
ZT]9;uKC¢g8ó]ú>¢Ùißêm HÔgô¯Õ<5®ÉûI&®=ûi¢ö7bÝX 'v1Aë¿hÔ¿½?ýòhûF¥ýéÿï\ÿë-/ùõ?»þ   Tó#£¢¹Ï´j_Þþù5wLíîNd)°ãpÀÎEmϩ׫Júµ¡3Ã8ÅÊè×¢+Þ9¢(¥¢(¢(¢ÿÙ

Questions

  • Is caching even possible when the image resource is directly output to the browser? I have tried setting the necessary headers (I am not sure whether I have set all). Following is screenshot of the headers as seen in chrome's network console-

enter image description here

  • If yes, what headers am I missing?
Sandeepan Nath
  • 9,966
  • 17
  • 86
  • 144
  • 1
    Caching in the browser is not related to the way you generate a content, being it from a file or a script or whatever. What does not work exactly ? Are you sure the browser queries the same exact url when you test the cache ? – Pixou May 11 '15 at 10:41
  • I am expecting a status 304 "Not modified" status in the response, but I am receiving 200 Ok always. Yes, I am browsing the same url - http://domain/fam/resizeImage.php?srcImg=http%3A%2F%2Fcdn.someexchange.com%2Faccount%2F21554%2F320%2F0.jpg&width=50&height=50 – Sandeepan Nath May 11 '15 at 11:10
  • The 304 is a response code, so should be handled by the server (nginx). You should not confuse 200 OK (from cache) with 304. see http://stackoverflow.com/questions/1665082/http-status-code-200-cache-vs-status-code-304 . If you want 304, probably you need to check nginx – Pixou May 11 '15 at 12:18
  • Could you please elaborate on this? Also, is 200 Ok response possible in case of caching (when cached resource is loaded?). In that case, how do I distinguish a 200 OK (from cache) response from a normal 200 Ok one? – Sandeepan Nath May 11 '15 at 13:31

0 Answers0