Contrib.social

How to fix relative URLs in a picture tag

Open on Drupal.org →
Created on 3 May 2024, 15 days ago
Updated 5 May 2024, 13 days ago

I just started using the CDN module on a website where I'm using the Responsive Image module. The output on Nodes and Views is as follows:

<picture>
                  <source srcset="/sites/xxx/files/styles/news_article_full/public/2024-04/439258515_829439895877639_5274276536154811976_n%20%281%29.jpg?h=56c650d7&amp;itok=4w6J2hkO 1x, /sites/xxx/files/styles/news_article_full_desktop_2x/public/2024-04/439258515_829439895877639_5274276536154811976_n%20%281%29.jpg?h=56c650d7&amp;itok=2ixAB-23 2x" media="all and (min-width: 1200px)" type="image/jpeg" width="837" height="462">
              <source srcset="/sites/xxx/files/styles/news_article_full/public/2024-04/439258515_829439895877639_5274276536154811976_n%20%281%29.jpg?h=56c650d7&amp;itok=4w6J2hkO 1x, /sites/xxx/files/styles/news_article_full_desktop_2x/public/2024-04/439258515_829439895877639_5274276536154811976_n%20%281%29.jpg?h=56c650d7&amp;itok=2ixAB-23 2x" media="all and (max-width: 1199px)" type="image/jpeg" width="837" height="462">
              <source srcset="/sites/xxx/files/styles/news_article_full/public/2024-04/439258515_829439895877639_5274276536154811976_n%20%281%29.jpg?h=56c650d7&amp;itok=4w6J2hkO 1x, /sites/xxx/files/styles/news_article_full_desktop_2x/public/2024-04/439258515_829439895877639_5274276536154811976_n%20%281%29.jpg?h=56c650d7&amp;itok=2ixAB-23 2x" media="all and (max-width: 991px)" type="image/jpeg" width="837" height="462">
              <source srcset="/sites/xxx/files/styles/news_article_full_mobile_1x/public/2024-04/439258515_829439895877639_5274276536154811976_n%20%281%29.jpg?h=56c650d7&amp;itok=9Dfia8ap 1x, /sites/xxx/files/styles/news_article_full_mobile_2x/public/2024-04/439258515_829439895877639_5274276536154811976_n%20%281%29.jpg?h=56c650d7&amp;itok=rUa4h9-F 2x" media="all and (max-width: 767px)" type="image/jpeg" width="428" height="236">
                  <img loading="eager" src="https://sitexxx.b-cdn.net/sites/xxx/files/styles/news_article_full_mobile_1x/public/2024-04/439258515_829439895877639_5274276536154811976_n%20%281%29.jpg?h=56c650d7&amp;itok=9Dfia8ap" width="428" height="236" alt="xxx" class="img-responsive">
  </picture>

As you can see, only the fallback img tag has an absolute URL and is served from the CDN. The other URLs are just served locally. I see no settings in the CDN or the Responsive Image module to change this. Do I need to manually rewrite URLs in templates and Views? Or is there an easier way to fix this? I hoped the CDN module would just take care of the rewriting.

💬 Support request
Status

Active

Version

4.1

Component

Code

Created by

🇳🇱Netherlands Dries Arnolds 🇳🇱 Amsterdam

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

contrib.social Blog FAQ Discussions
Production build 0.67.2 2024