fix: update trusted images policies (#2622)

Author: alexdln

app/components/Readme.vue

@@ -444,6 +444,11 @@ function handleClick(event: MouseEvent) {
   z-index: 1;
 }
 
+/* With defined width, height will be automatically calculated using the aspect ratio */
+.readme :deep(img[width]) {
+  height: auto;
+}
+
 .readme :deep(video) {
   height: revert-layer;
   display: revert-layer;

server/utils/image-proxy.ts

@@ -34,9 +34,9 @@ export const TRUSTED_IMAGE_DOMAINS = [
   'npmx.dev',
 
   // GitHub (already proxied by GitHub's own camo)
+  // We do not include github.com and user-images.githubusercontent.com because they
+  // might return redirects to s3 which will be blocked by the CSP
   'raw.githubusercontent.com',
-  'github.com',
-  'user-images.githubusercontent.com',
   'avatars.githubusercontent.com',
   'repository-images.githubusercontent.com',
   'github.githubassets.com',
@@ -69,6 +69,7 @@ export const TRUSTED_IMAGE_DOMAINS = [
   'deepwiki.com',
   'saucelabs.github.io',
   'opencollective.com',
+  'images.opencollective.com',
   'circleci.com',
   'www.codetriage.com',
   'badges.gitter.im',
@@ -86,9 +87,8 @@ export function isTrustedImageDomain(url: string): boolean {
   if (!parsed?.hostname) return false
 
   const hostname = parsed.hostname.toLowerCase()
-  return TRUSTED_IMAGE_DOMAINS.some(
-    domain => hostname === domain || hostname.endsWith(`.${domain}`),
-  )
+  // We only look at exact matches (not subdomains), since the same array is used as a check in CSP
+  return TRUSTED_IMAGE_DOMAINS.includes(hostname)
 }
 
 /**

test/unit/server/utils/image-proxy.spec.ts

@@ -18,12 +18,6 @@ describe('Image Proxy Utils', () => {
       ).toBe(true)
     })
 
-    it('trusts GitHub user images', () => {
-      expect(isTrustedImageDomain('https://user-images.githubusercontent.com/123/image.png')).toBe(
-        true,
-      )
-    })
-
     it('trusts shields.io badge URLs', () => {
       expect(isTrustedImageDomain('https://img.shields.io/badge/test-passing-green')).toBe(true)
     })
@@ -36,8 +30,8 @@ describe('Image Proxy Utils', () => {
       expect(isTrustedImageDomain('https://npmx.dev/images/logo.png')).toBe(true)
     })
 
-    it('trusts subdomain of trusted domains', () => {
-      expect(isTrustedImageDomain('https://sub.gitlab.com/image.png')).toBe(true)
+    it('does not trust subdomain of trusted domains', () => {
+      expect(isTrustedImageDomain('https://sub.gitlab.com/image.png')).toBe(false)
     })
 
     it('does not trust arbitrary domains', () => {
@@ -265,7 +259,7 @@ describe('Image Proxy Utils', () => {
     })
 
     it('does not proxy GitHub blob URLs', () => {
-      const url = 'https://github.com/owner/repo/blob/main/assets/logo.png'
+      const url = 'https://cloud.githubusercontent.com/assets/123/logo.png'
       expect(toProxiedImageUrl(url, TEST_SECRET)).toBe(url)
     })