vite-plugin-sri4 1.8.2 → 1.8.3

package/dist/index.cjs

@@ -9,8 +9,7 @@ const DEFAULT_OPTIONS = {
   algorithm: 'sha384',
   bypassDomains: [],
   crossorigin: 'anonymous',
-  debug: false,
-  inlineScripts: false
+  debug: false
 };
 
 function log(message, options) {
@@ -21,9 +20,6 @@ function log(message, options) {
 
 function computeSri(content, algorithm = 'sha384') {
   try {
-    if (typeof content === 'string') {
-      content = Buffer.from(content, 'utf-8');
-    }
     const hash = node_crypto.createHash(algorithm)
       .update(content)
       .digest('base64');
@@ -53,21 +49,14 @@ async function externalResourceIsCorsEnabled(url, options) {
 function isBypassDomain(url, bypassDomains = []) {
   if (!bypassDomains.length) return false;
   try {
-    let parsedUrl;
-    if (url.startsWith('//')) {
-      parsedUrl = new URL(`http:${url}`);
-    } else if (url.startsWith('http://') || url.startsWith('https://')) {
-      parsedUrl = new URL(url);
-    } else {
-      parsedUrl = new URL(url, 'http://dummy');
-    }
-
+    const parsedUrl = url.startsWith('//')
+      ? new URL(`http:${url}`)
+      : new URL(url, 'http://dummy');
     return bypassDomains.some(
       (domain) => parsedUrl.hostname === domain ||
                  parsedUrl.hostname.endsWith(`.${domain}`)
     );
   } catch (e) {
-    console.error(`${LOG_PREFIX} Failed to parse URL: ${url}`, e);
     return false;
   }
 }
@@ -76,38 +65,27 @@ function hasCrossOriginAttr(tag) {
   return /(?:^|\s)crossorigin(?:=["']?[^"'\s>]*["']?)?(?:\s|>|$)/i.test(tag);
 }
 
-function getAllPossiblePaths(url) {
-  const paths = [
+function getBundleKey(url, base = '') {
+  // 嘗試各種可能的路徑格式
+  const possiblePaths = [
     url,
-    url.startsWith('/') ? url.slice(1) : url,
-    url.startsWith('/static/') ? url.slice(8) : url,
-    !url.startsWith('/static/') ? `static/${url}` : url,
-    !url.startsWith('/static/') ? `/static/${url}` : url,
+    url.replace(/^\//, ''),
     url.replace(/^\/static\//, ''),
-    url.replace(/^static\//, '')
+    url.replace(/^static\//, ''),
+    url.replace(base, ''),
+    url.replace(base, '').replace(/^\//, '')
   ];
 
-  // Handle Vite's hashed filenames (e.g., index-DPifqqS2.js -> index.js)
-  const withoutHash = url.replace(/-[a-zA-Z0-9]{8}\./, '.');
+  // 移除 hash 後的版本
+  const withoutHash = url.replace(/-[a-zA-Z0-9]+\.([^.]+)$/, '.$1');
   if (withoutHash !== url) {
-    paths.push(...getAllPossiblePaths(withoutHash));
-  }
-
-  // Handle variations with and without /static/ prefix for hashed files
-  const hashedMatch = url.match(/^(?:\/static\/)?(.*?)-[a-zA-Z0-9]{8}(\..*?)$/);
-  if (hashedMatch) {
-    const [, base, ext] = hashedMatch;
-    paths.push(
-      `${base}${ext}`,
-      `/static/${base}${ext}`,
-      `static/${base}${ext}`
-    );
+    possiblePaths.push(...getBundleKey(withoutHash, base));
   }
 
-  return [...new Set(paths)];
+  return [...new Set(possiblePaths)];
 }
 
-async function processTag(tag, url, options, sriMap) {
+async function processTag(tag, url, options, bundle, base = '') {
   if (tag.includes('integrity=')) {
     log(`Skip tag with existing integrity attribute: ${tag}`, options);
     return tag;
@@ -148,54 +126,31 @@ async function processTag(tag, url, options, sriMap) {
   }
 
   // Handle local resources
-  const possiblePaths = getAllPossiblePaths(url);
-  let integrity = null;
-
-  log(`Checking possible paths for ${url}:`, options);
-  log(`Possible paths:`, options);
-  possiblePaths.forEach(path => log(`  - ${path}`, options));
+  const possibleKeys = getBundleKey(url, base);
+  let bundleItem = null;
 
-  for (const path of possiblePaths) {
-    log(`- Checking path: ${path}`, options);
-    if (sriMap.has(path)) {
-      integrity = sriMap.get(path);
-      log(`Found integrity for path ${path}: ${integrity}`, options);
+  for (const key of possibleKeys) {
+    if (bundle[key]) {
+      bundleItem = bundle[key];
+      log(`Found bundle item for key: ${key}`, options);
       break;
     }
   }
 
-  if (integrity) {
-    log(`Using precomputed SRI for ${url}: ${integrity}`, options);
-    const hasCrossOrigin = hasCrossOriginAttr(tag);
-    const crossOriginAttr = hasCrossOrigin ? '' : ` crossorigin="${options.crossorigin}"`;
-    const newTag = tag.replace(/>$/, ` integrity="${integrity}"${crossOriginAttr}>`);
-    log(`New tag: ${newTag}`, options);
-    return newTag;
-  }
-
-  log(`No SRI hash found for ${url}`, options);
-  log(`Available paths in sriMap: ${Array.from(sriMap.keys()).join(', ')}`, options);
-  return tag;
-}
-
-async function processInlineScript(tag, options) {
-  if (tag.includes('integrity=')) {
-    log(`Skip inline script with existing integrity attribute: ${tag}`, options);
-    return tag;
-  }
-
-  const content = tag.match(/<script[^>]*>([\s\S]*?)<\/script>/)?.[1]?.trim();
-  if (!content) {
-    log(`Skip empty inline script: ${tag}`, options);
-    return tag;
-  }
-
-  const hash = computeSri(content, options.algorithm);
-  if (hash) {
-    log(`Computing SRI for inline script: ${hash}`, options);
-    const newTag = tag.replace('>', ` integrity="${hash}">`);
-    log(`New inline script tag: ${newTag}`, options);
-    return newTag;
+  if (bundleItem) {
+    const source = bundleItem.type === 'chunk' ? bundleItem.code : bundleItem.source;
+    const integrity = computeSri(source, options.algorithm);
+    if (integrity) {
+      log(`Computing SRI for local resource ${url}: ${integrity}`, options);
+      const hasCrossOrigin = hasCrossOriginAttr(tag);
+      const crossOriginAttr = hasCrossOrigin ? '' : ` crossorigin="${options.crossorigin}"`;
+      const newTag = tag.replace(/>$/, ` integrity="${integrity}"${crossOriginAttr}>`);
+      log(`New tag: ${newTag}`, options);
+      return newTag;
+    }
+  } else {
+    log(`No bundle item found for ${url}`, options);
+    log(`Available bundle keys: ${Object.keys(bundle).join(', ')}`, options);
   }
 
   return tag;
@@ -203,8 +158,8 @@ async function processInlineScript(tag, options) {
 
 function sri(userOptions = {}) {
   const options = { ...DEFAULT_OPTIONS, ...userOptions };
-  const sriMap = new Map();
   let isBuild = false;
+  let base = '';
 
   return {
     name: 'vite-plugin-sri4',
@@ -214,45 +169,12 @@ function sri(userOptions = {}) {
     configResolved(config) {
       options.domain = config.server?.host || '';
       isBuild = config.command === 'build';
+      base = config.base || '';
       log('Plugin configured in ' + (isBuild ? 'build' : 'dev') + ' mode', options);
+      log(`Base URL: ${base}`, options);
     },
 
-    async renderChunk(code, chunk) {
-      if (!isBuild) return null;
-
-      const hash = computeSri(code, options.algorithm);
-      if (hash) {
-        for (const path of getAllPossiblePaths(chunk.fileName)) {
-          sriMap.set(path, hash);
-          log(`Stored SRI for path ${path}: ${hash}`, options);
-        }
-      }
-      return null;
-    },
-
-    async generateBundle(_, bundle) {
-      if (!isBuild) return;
-
-      for (const fileName in bundle) {
-        const chunk = bundle[fileName];
-        if (chunk.type === 'asset' && !sriMap.has(fileName)) {
-          const hash = computeSri(chunk.source, options.algorithm);
-          if (hash) {
-            for (const path of getAllPossiblePaths(fileName)) {
-              sriMap.set(path, hash);
-              log(`Computing SRI for asset ${path}: ${hash}`, options);
-            }
-          }
-        }
-      }
-
-      log('Final sriMap contents:', options);
-      for (const [key, value] of sriMap.entries()) {
-        log(`${key} => ${value}`, options);
-      }
-    },
-
-    async transformIndexHtml(html) {
+    async transformIndexHtml(html, ctx) {
       if (!isBuild || !html) {
         log('Skipping HTML transform in dev mode or empty HTML', options);
         return html;
@@ -260,38 +182,32 @@ function sri(userOptions = {}) {
 
       try {
         log('Starting HTML transformation', options);
-        log(`SRI Map size: ${sriMap.size}`, options);
-
-        // Process script tags
-        const scriptTags = html.match(/<script[^>]+src=["']([^"']+)["'][^>]*>/g) || [];
-        log(`Found ${scriptTags.length} script tags`, options);
-        for (const tag of scriptTags) {
-          const url = tag.match(/src=["']([^"']+)["']/)[1];
+        const bundle = ctx.bundle || {};
+        log(`Bundle size: ${Object.keys(bundle).length}`, options);
+
+        // Process script tags with and without quotes
+        const scriptTagRegex = /<script[^>]+src=(?:["']([^"']+)["']|([^ >]+))[^>]*>/g;
+        let match;
+        while ((match = scriptTagRegex.exec(html)) !== null) {
+          const [tag, quotedUrl, unquotedUrl] = match;
+          const url = quotedUrl || unquotedUrl;
           log(`Processing script: ${url}`, options);
-          const newTag = await processTag(tag, url, options, sriMap);
+          const newTag = await processTag(tag, url, options, bundle, base);
           html = html.replace(tag, newTag);
         }
 
-        // Process inline scripts if enabled
-        if (options.inlineScripts) {
-          const inlineScripts = html.match(/<script[^>]*>([^<]+)<\/script>/g) || [];
-          log(`Found ${inlineScripts.length} inline script tags`, options);
-          for (const tag of inlineScripts) {
-            const newTag = await processInlineScript(tag, options);
+        // Process link tags with and without quotes
+        const linkTagRegex = /<link[^>]+href=(?:["']([^"']+)["']|([^ >]+))[^>]*>/g;
+        while ((match = linkTagRegex.exec(html)) !== null) {
+          const [tag, quotedUrl, unquotedUrl] = match;
+          const url = quotedUrl || unquotedUrl;
+          if (tag.includes('stylesheet') || tag.includes('modulepreload')) {
+            log(`Processing link: ${url}`, options);
+            const newTag = await processTag(tag, url, options, bundle, base);
             html = html.replace(tag, newTag);
           }
         }
 
-        // Process link tags
-        const linkTags = html.match(/<link[^>]+href=["']([^"']+)["'][^>]*>/g) || [];
-        log(`Found ${linkTags.length} link tags`, options);
-        for (const tag of linkTags) {
-          const url = tag.match(/href=["']([^"']+)["']/)[1];
-          log(`Processing link: ${url}`, options);
-          const newTag = await processTag(tag, url, options, sriMap);
-          html = html.replace(tag, newTag);
-        }
-
         return html;
       } catch (error) {
         console.error(`${LOG_PREFIX} Failed to transform HTML: ${error}`);

package/dist/index.js

@@ -7,8 +7,7 @@ const DEFAULT_OPTIONS = {
   algorithm: 'sha384',
   bypassDomains: [],
   crossorigin: 'anonymous',
-  debug: false,
-  inlineScripts: false
+  debug: false
 };
 
 function log(message, options) {
@@ -19,9 +18,6 @@ function log(message, options) {
 
 function computeSri(content, algorithm = 'sha384') {
   try {
-    if (typeof content === 'string') {
-      content = Buffer.from(content, 'utf-8');
-    }
     const hash = createHash(algorithm)
       .update(content)
       .digest('base64');
@@ -51,21 +47,14 @@ async function externalResourceIsCorsEnabled(url, options) {
 function isBypassDomain(url, bypassDomains = []) {
   if (!bypassDomains.length) return false;
   try {
-    let parsedUrl;
-    if (url.startsWith('//')) {
-      parsedUrl = new URL(`http:${url}`);
-    } else if (url.startsWith('http://') || url.startsWith('https://')) {
-      parsedUrl = new URL(url);
-    } else {
-      parsedUrl = new URL(url, 'http://dummy');
-    }
-
+    const parsedUrl = url.startsWith('//')
+      ? new URL(`http:${url}`)
+      : new URL(url, 'http://dummy');
     return bypassDomains.some(
       (domain) => parsedUrl.hostname === domain ||
                  parsedUrl.hostname.endsWith(`.${domain}`)
     );
   } catch (e) {
-    console.error(`${LOG_PREFIX} Failed to parse URL: ${url}`, e);
     return false;
   }
 }
@@ -74,38 +63,27 @@ function hasCrossOriginAttr(tag) {
   return /(?:^|\s)crossorigin(?:=["']?[^"'\s>]*["']?)?(?:\s|>|$)/i.test(tag);
 }
 
-function getAllPossiblePaths(url) {
-  const paths = [
+function getBundleKey(url, base = '') {
+  // 嘗試各種可能的路徑格式
+  const possiblePaths = [
     url,
-    url.startsWith('/') ? url.slice(1) : url,
-    url.startsWith('/static/') ? url.slice(8) : url,
-    !url.startsWith('/static/') ? `static/${url}` : url,
-    !url.startsWith('/static/') ? `/static/${url}` : url,
+    url.replace(/^\//, ''),
     url.replace(/^\/static\//, ''),
-    url.replace(/^static\//, '')
+    url.replace(/^static\//, ''),
+    url.replace(base, ''),
+    url.replace(base, '').replace(/^\//, '')
   ];
 
-  // Handle Vite's hashed filenames (e.g., index-DPifqqS2.js -> index.js)
-  const withoutHash = url.replace(/-[a-zA-Z0-9]{8}\./, '.');
+  // 移除 hash 後的版本
+  const withoutHash = url.replace(/-[a-zA-Z0-9]+\.([^.]+)$/, '.$1');
   if (withoutHash !== url) {
-    paths.push(...getAllPossiblePaths(withoutHash));
-  }
-
-  // Handle variations with and without /static/ prefix for hashed files
-  const hashedMatch = url.match(/^(?:\/static\/)?(.*?)-[a-zA-Z0-9]{8}(\..*?)$/);
-  if (hashedMatch) {
-    const [, base, ext] = hashedMatch;
-    paths.push(
-      `${base}${ext}`,
-      `/static/${base}${ext}`,
-      `static/${base}${ext}`
-    );
+    possiblePaths.push(...getBundleKey(withoutHash, base));
   }
 
-  return [...new Set(paths)];
+  return [...new Set(possiblePaths)];
 }
 
-async function processTag(tag, url, options, sriMap) {
+async function processTag(tag, url, options, bundle, base = '') {
   if (tag.includes('integrity=')) {
     log(`Skip tag with existing integrity attribute: ${tag}`, options);
     return tag;
@@ -146,54 +124,31 @@ async function processTag(tag, url, options, sriMap) {
   }
 
   // Handle local resources
-  const possiblePaths = getAllPossiblePaths(url);
-  let integrity = null;
-
-  log(`Checking possible paths for ${url}:`, options);
-  log(`Possible paths:`, options);
-  possiblePaths.forEach(path => log(`  - ${path}`, options));
+  const possibleKeys = getBundleKey(url, base);
+  let bundleItem = null;
 
-  for (const path of possiblePaths) {
-    log(`- Checking path: ${path}`, options);
-    if (sriMap.has(path)) {
-      integrity = sriMap.get(path);
-      log(`Found integrity for path ${path}: ${integrity}`, options);
+  for (const key of possibleKeys) {
+    if (bundle[key]) {
+      bundleItem = bundle[key];
+      log(`Found bundle item for key: ${key}`, options);
       break;
     }
   }
 
-  if (integrity) {
-    log(`Using precomputed SRI for ${url}: ${integrity}`, options);
-    const hasCrossOrigin = hasCrossOriginAttr(tag);
-    const crossOriginAttr = hasCrossOrigin ? '' : ` crossorigin="${options.crossorigin}"`;
-    const newTag = tag.replace(/>$/, ` integrity="${integrity}"${crossOriginAttr}>`);
-    log(`New tag: ${newTag}`, options);
-    return newTag;
-  }
-
-  log(`No SRI hash found for ${url}`, options);
-  log(`Available paths in sriMap: ${Array.from(sriMap.keys()).join(', ')}`, options);
-  return tag;
-}
-
-async function processInlineScript(tag, options) {
-  if (tag.includes('integrity=')) {
-    log(`Skip inline script with existing integrity attribute: ${tag}`, options);
-    return tag;
-  }
-
-  const content = tag.match(/<script[^>]*>([\s\S]*?)<\/script>/)?.[1]?.trim();
-  if (!content) {
-    log(`Skip empty inline script: ${tag}`, options);
-    return tag;
-  }
-
-  const hash = computeSri(content, options.algorithm);
-  if (hash) {
-    log(`Computing SRI for inline script: ${hash}`, options);
-    const newTag = tag.replace('>', ` integrity="${hash}">`);
-    log(`New inline script tag: ${newTag}`, options);
-    return newTag;
+  if (bundleItem) {
+    const source = bundleItem.type === 'chunk' ? bundleItem.code : bundleItem.source;
+    const integrity = computeSri(source, options.algorithm);
+    if (integrity) {
+      log(`Computing SRI for local resource ${url}: ${integrity}`, options);
+      const hasCrossOrigin = hasCrossOriginAttr(tag);
+      const crossOriginAttr = hasCrossOrigin ? '' : ` crossorigin="${options.crossorigin}"`;
+      const newTag = tag.replace(/>$/, ` integrity="${integrity}"${crossOriginAttr}>`);
+      log(`New tag: ${newTag}`, options);
+      return newTag;
+    }
+  } else {
+    log(`No bundle item found for ${url}`, options);
+    log(`Available bundle keys: ${Object.keys(bundle).join(', ')}`, options);
   }
 
   return tag;
@@ -201,8 +156,8 @@ async function processInlineScript(tag, options) {
 
 function sri(userOptions = {}) {
   const options = { ...DEFAULT_OPTIONS, ...userOptions };
-  const sriMap = new Map();
   let isBuild = false;
+  let base = '';
 
   return {
     name: 'vite-plugin-sri4',
@@ -212,45 +167,12 @@ function sri(userOptions = {}) {
     configResolved(config) {
       options.domain = config.server?.host || '';
       isBuild = config.command === 'build';
+      base = config.base || '';
       log('Plugin configured in ' + (isBuild ? 'build' : 'dev') + ' mode', options);
+      log(`Base URL: ${base}`, options);
     },
 
-    async renderChunk(code, chunk) {
-      if (!isBuild) return null;
-
-      const hash = computeSri(code, options.algorithm);
-      if (hash) {
-        for (const path of getAllPossiblePaths(chunk.fileName)) {
-          sriMap.set(path, hash);
-          log(`Stored SRI for path ${path}: ${hash}`, options);
-        }
-      }
-      return null;
-    },
-
-    async generateBundle(_, bundle) {
-      if (!isBuild) return;
-
-      for (const fileName in bundle) {
-        const chunk = bundle[fileName];
-        if (chunk.type === 'asset' && !sriMap.has(fileName)) {
-          const hash = computeSri(chunk.source, options.algorithm);
-          if (hash) {
-            for (const path of getAllPossiblePaths(fileName)) {
-              sriMap.set(path, hash);
-              log(`Computing SRI for asset ${path}: ${hash}`, options);
-            }
-          }
-        }
-      }
-
-      log('Final sriMap contents:', options);
-      for (const [key, value] of sriMap.entries()) {
-        log(`${key} => ${value}`, options);
-      }
-    },
-
-    async transformIndexHtml(html) {
+    async transformIndexHtml(html, ctx) {
       if (!isBuild || !html) {
         log('Skipping HTML transform in dev mode or empty HTML', options);
         return html;
@@ -258,38 +180,32 @@ function sri(userOptions = {}) {
 
       try {
         log('Starting HTML transformation', options);
-        log(`SRI Map size: ${sriMap.size}`, options);
-
-        // Process script tags
-        const scriptTags = html.match(/<script[^>]+src=["']([^"']+)["'][^>]*>/g) || [];
-        log(`Found ${scriptTags.length} script tags`, options);
-        for (const tag of scriptTags) {
-          const url = tag.match(/src=["']([^"']+)["']/)[1];
+        const bundle = ctx.bundle || {};
+        log(`Bundle size: ${Object.keys(bundle).length}`, options);
+
+        // Process script tags with and without quotes
+        const scriptTagRegex = /<script[^>]+src=(?:["']([^"']+)["']|([^ >]+))[^>]*>/g;
+        let match;
+        while ((match = scriptTagRegex.exec(html)) !== null) {
+          const [tag, quotedUrl, unquotedUrl] = match;
+          const url = quotedUrl || unquotedUrl;
           log(`Processing script: ${url}`, options);
-          const newTag = await processTag(tag, url, options, sriMap);
+          const newTag = await processTag(tag, url, options, bundle, base);
           html = html.replace(tag, newTag);
         }
 
-        // Process inline scripts if enabled
-        if (options.inlineScripts) {
-          const inlineScripts = html.match(/<script[^>]*>([^<]+)<\/script>/g) || [];
-          log(`Found ${inlineScripts.length} inline script tags`, options);
-          for (const tag of inlineScripts) {
-            const newTag = await processInlineScript(tag, options);
+        // Process link tags with and without quotes
+        const linkTagRegex = /<link[^>]+href=(?:["']([^"']+)["']|([^ >]+))[^>]*>/g;
+        while ((match = linkTagRegex.exec(html)) !== null) {
+          const [tag, quotedUrl, unquotedUrl] = match;
+          const url = quotedUrl || unquotedUrl;
+          if (tag.includes('stylesheet') || tag.includes('modulepreload')) {
+            log(`Processing link: ${url}`, options);
+            const newTag = await processTag(tag, url, options, bundle, base);
             html = html.replace(tag, newTag);
           }
         }
 
-        // Process link tags
-        const linkTags = html.match(/<link[^>]+href=["']([^"']+)["'][^>]*>/g) || [];
-        log(`Found ${linkTags.length} link tags`, options);
-        for (const tag of linkTags) {
-          const url = tag.match(/href=["']([^"']+)["']/)[1];
-          log(`Processing link: ${url}`, options);
-          const newTag = await processTag(tag, url, options, sriMap);
-          html = html.replace(tag, newTag);
-        }
-
         return html;
       } catch (error) {
         console.error(`${LOG_PREFIX} Failed to transform HTML: ${error}`);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vite-plugin-sri4",
-  "version": "1.8.2",
+  "version": "1.8.3",
   "description": "A Vite plugin to generate Subresource Integrity (SRI) hashes for output files.",
   "type": "module",
   "main": "./dist/index.cjs",