fix(server): use ufo for query parsing to fix h3 v2 compatibility (#493)

benjamincanac · atinux · web-flow · commit 931722e263cc · 2026-06-02T14:57:37.000+02:00
Co-authored-by: Sébastien Chopin &lt;atinux@gmail.com&gt;
diff --git a/package.json b/package.json
@@ -43,10 +43,10 @@
     "local-pkg": "^1.1.2",
     "mlly": "^1.8.2",
     "ohash": "^2.0.11",
-    "pathe": "^2.0.3",
     "picomatch": "^4.0.4",
     "std-env": "^4.1.0",
-    "tinyglobby": "^0.2.16"
+    "tinyglobby": "^0.2.16",
+    "ufo": "^1.6.4"
   },
   "devDependencies": {
     "@iconify-json/fluent-emoji-high-contrast": "^1.2.5",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/src/runtime/server/api.ts b/src/runtime/server/api.ts
@@ -1,11 +1,11 @@
-import { basename } from 'pathe'
 import { getIcons } from '@iconify/utils'
 import { hash } from 'ohash'
-import { createError, getQuery, type H3Event } from 'h3'
+import { createError, type H3Event } from 'h3'
+import { parseQuery, parsePath } from 'ufo'
 import { consola } from 'consola'
 import type { NuxtIconRuntimeOptions } from '../../schema-types'
 // @ts-expect-error tsconfig.server has the types
-import { useAppConfig, getRequestURL, defineCachedEventHandler } from '#imports'
+import { useAppConfig, defineCachedEventHandler } from '#imports'
 import { collections } from '#nuxt-icon-server-bundle'
 
 const warnOnceSet = /* @__PURE__ */ new Set<string>()
@@ -21,43 +21,37 @@ function getInstallCommand(pkg: string): string {
 }
 
 export default defineCachedEventHandler(async (event: H3Event) => {
-  const url = getRequestURL(event) as URL
-  if (!url)
-    return createError({ status: 400, message: 'Invalid icon request' })
-
   const options = useAppConfig().icon as NuxtIconRuntimeOptions
   const collectionName = event.context.params?.collection?.replace(/\.json$/, '')
   const collection = collectionName
     ? await collections[collectionName]?.()
     : null
 
   const apiEndPoint = options.iconifyApiEndpoint || DEFAULT_ENDPOINT
-  const icons = url.searchParams.get('icons')?.split(',')
+  const icons = String(parseQuery(parsePath(event.path).search).icons || '').split(',')
 
-  if (collection) {
-    if (icons?.length) {
-      const data = getIcons(
-        collection,
-        icons,
-      )
-      consola.debug(`[Icon] serving ${(icons || []).map(i => '`' + collectionName + ':' + i + '`').join(',')} from bundled collection`)
-      return data
-    }
+  if (!collectionName) return createError({ status: 400, message: 'No collection specified' })
+  if (!icons.length) return createError({ status: 400, message: 'No icons specified' })
+  if (!collection && import.meta.dev && !warnOnceSet.has(collectionName) && apiEndPoint === DEFAULT_ENDPOINT) {
+    consola.warn([
+      `[Icon] Collection \`${collectionName}\` is not found locally`,
+      `We suggest to install it via \`${getInstallCommand(`@iconify-json/${collectionName}`)}\` to provide the best end-user experience.`,
+    ].join('\n'))
+    warnOnceSet.add(collectionName)
   }
-  else if (import.meta.dev) {
-    // Warn only once per collection, and only with the default endpoint
-    if (collectionName && !warnOnceSet.has(collectionName) && apiEndPoint === DEFAULT_ENDPOINT) {
-      consola.warn([
-        `[Icon] Collection \`${collectionName}\` is not found locally`,
-        `We suggest to install it via \`${getInstallCommand(`@iconify-json/${collectionName}`)}\` to provide the best end-user experience.`,
-      ].join('\n'))
-      warnOnceSet.add(collectionName)
-    }
+
+  if (collection) {
+    const data = getIcons(
+      collection,
+      icons,
+    )
+    consola.debug(`[Icon] serving ${(icons).map(i => '`' + collectionName + ':' + i + '`').join(',')} from bundled collection`)
+    return data
   }
 
   if (options.fallbackToApi === true || options.fallbackToApi === 'server-only') {
-    const apiUrl = new URL('./' + basename(url.pathname) + url.search, apiEndPoint)
-    consola.debug(`[Icon] fetching ${(icons || []).map(i => '`' + collectionName + ':' + i + '`').join(',')} from iconify api`)
+    const apiUrl = new URL(`./${collectionName}.json?icons=${icons.join(',')}`, apiEndPoint)
+    consola.debug(`[Icon] fetching ${(icons).map(i => '`' + collectionName + ':' + i + '`').join(',')} from iconify api`)
     if (apiUrl.host !== new URL(apiEndPoint).host) {
       return createError({ status: 400, message: 'Invalid icon request' })
     }
@@ -80,8 +74,8 @@ export default defineCachedEventHandler(async (event: H3Event) => {
   name: 'icon',
   getKey(event: H3Event) {
     const collection = event.context.params?.collection?.replace(/\.json$/, '') || 'unknown'
-    const icons = String(getQuery(event).icons || '')
-    return `${collection}_${icons.split(',')[0]}_${icons.length}_${hash(icons)}`
+    const icons = String(parseQuery(parsePath(event.path).search).icons || '').split(',')
+    return `${collection}_${icons[0]}_${icons.length}_${hash(icons.join(','))}`
   },
   swr: true,
   maxAge: 60 * 60 * 24 * 7, // 1 week
