Image URL & Response Headers

  • Resolved Paul Johnstone

    (@folio1)


    1 year, 1 month ago

    Would like to confirm image URL & response header for FrontDoor & Azure Storage setup with W3 Total Cache plugin. What should we expect to see?

    The following 3 images displays different image URL & one has a different response header.

    Please feel free to review the link provide for further review.

    

----------------------------------------------------------------------------------------------------------------


    Default domain is displaying within the image URL

    <img alt="Home" data-src="https://as04wp.azurewebsites.net/wp-content/uploads/2021/12/KH_013_Paul_J_280217-TU-CROP.png" class=" lazyloaded" src="https://as04wp.azurewebsites.net/wp-content/uploads/2021/12/KH_013_Paul_J_280217-TU-CROP.png">

    Response Headers

    Accept-Ranges: bytes
    Cache-Control: max-age=315360000
    Content-Length: 1394640
    Content-Type: image/png
    Date: Mon, 29 Jan 2024 01:14:32 GMT
    Etag: "65a7414e-1547d0"
    Expires: Thu, 31 Dec 2037 23:55:55 GMT
    Last-Modified: Wed, 17 Jan 2024 02:54:06 GMT
    Permissions-Policy: geolocation=(),midi=(),sync-xhr=(),microphone=(),camera=(),magnetometer=(),gyroscope=(),fullscreen=(self)
    Referrer-Policy: strict-origin
    Server: nginx
    X-Content-Type-Options: nosniff
    X-Frame-Options: SAMEORIGIN
    X-Xss-Protection: 1; mode=block


    FrontDoor, Azure Storage Container or Azure default domain are not displayed within the image URL

<img decoding="async" width="240" height="190" alt="" data-src="/wp-content/uploads/2024/01/wood-logo-1.png" class="wp-image-2416 ls-is-cached lazyloaded" src="/wp-content/uploads/2024/01/wood-logo-1.png">


    Response Headers

    Accept-Ranges: bytes
    Cache-Control: max-age=315360000
    Content-Length: 2430
    Content-Type: image/png
    Date: Mon, 29 Jan 2024 00:15:06 GMT
    Etag: "65a864f8-97e"
    Expires: Thu, 31 Dec 2037 23:55:55 GMT
    Last-Modified: Wed, 17 Jan 2024 23:38:32 GMT
    Permissions-Policy: geolocation=(),midi=(),sync-xhr=(),microphone=(),camera=(),magnetometer=(),gyroscope=(),fullscreen=(self)
    Referrer-Policy: strict-origin
    Server: nginx
    X-Content-Type-Options: nosniff
    X-Frame-Options: SAMEORIGIN
    X-Xss-Protection: 1; mode=block

FrontDoor URL & Azure Storage displayed within the image URL<img decoding="async" width="240" height="191" alt="" data-src="https://as04wp-63545367a3-f5fpesb0ayepc5ga.z01.azurefd.net/wpblob92f776408c/wp-content/uploads/2024/01/engie-logo-bw.jpg" class="wp-image-2408 lazyloaded" src="https://as04wp-63545367a3-f5fpesb0ayepc5ga.z01.azurefd.net/wpblob92f776408c/wp-content/uploads/2024/01/engie-logo-bw.jpg">

    Response Headers

    Cache-Control: public, max-age=259200
    Content-Length: 3980
    Content-Md5: C4cHxA1JQCmxnx9jabQ2yg==
    Content-Type: image/jpeg
    Date: Mon, 29 Jan 2024 00:15:05 GMT
    Etag: 0x8DC171F0BE44C90
    Last-Modified: Wed, 17 Jan 2024 05:42:09 GMT
    X-Azure-Ref: 0Cu62ZQAAAAAm5gIjc8QRS4YiwvvskUWeTUVMMDFFREdFMDkxNQBmYTY4YmYzOS00Yzc2LTRmY2QtYTNlYi1kMmY5OWYyYWEyNWQ=
    X-Cache: TCP_HIT
    X-Ms-Blob-Type: BlockBlob
    X-Ms-Lease-Status: unlocked
    X-Ms-Request-Id: 1f1ca10b-a01e-000c-11bb-51edbc000000
    X-Ms-Version: 2009-09-19

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Contributor Marko Vasiljevic

    (@vmarko)

    Hello @folio1

    Thank you for reaching out and I am happy to help!
    It appears that all 3 images are coming from 3 different URL’s

    And after I checked yoru website, there is a third source and that is the CDN you’ve set up with the W3TC. This indicates that some images may be handled in a different way (server configuration) or you are using some other plugin or a method to serve images from different sources.
    Are you using any other optimization plugin and does your hosting provider offer any server-side caching or optimization for Images?

    Thanks!

    Thread Starter Paul Johnstone

    (@folio1)

    Hi Marko,

    Thanks for your reply…

    I have set up a test page for further review on the setup.
    Note that images had been uploaded to WP media library, file URL:

    Note: Media files are spontaneously pushed to Blob container by W3 Total Cache plugin when uploaded, without any manual intervention. Images can be accessed using hyperlinks that point to Blob Storage

    CDN FrontDoor endpoint / Container / folder / file

    https://as04wp-63545367a3-f5fpesb0ayepc5ga.z01.azurefd.net/wpblob92f776408c/wp-content/uploads/2024/01/image-value-prop-1-Copy.jpg

    Test page
    https://pauljohnstone.com.au/test-page/

    Set-up
    Note, this is a demo test set-up of W3 total Cache with Azure App Services with Front Door – CDN with Azure Storage.

    • Azure App Services
    • Front Door – CDN with Azure Storage
    • W3 Total Cache setup – CDN Type – Microsoft Azure Storage.
    • No other optimization plugin
    • No server-side caching
    • No FD CDN caching

    Do you have documentation on what the response header should be for further review?

    Great to have your input here…

    Plugin Contributor Marko Vasiljevic

    (@vmarko)

    Hello @folio1

    Thank you for your feedback.

    The response headers can vary depending on how the file is processed.
    For example, if the file is served from the origin, all the response headers will reflect the rules set by the origin configuration, this includes the cache-control, compression, type, security headers etc.

    If the image is uploaded to the CDN, and the configuration of the CDN that is serving those images does not respect the origin headers and also has its own configuration in place to manage those images, like X-Azure-Ref: or X-Ms-Blob-Type: the headers will naturally be different.
    This is also the case for any cache control headers set by the W3TC. If the CDN does not respect the origin headers, those headers will reflect the configuration of the CDN provider.

    I hope this clarifies this.

    Thanks!

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Image URL & Response Headers’ is closed to new replies.