Nuxt-image v0.7.1部署GAE SSR生产环境时IPX无法加载图片

采用默认IPX provider的SSR项目部署到Google App Engine生产环境后，图片无法通过nuxt-image加载，无法确定是配置错误、打包/部署问题还是Nuxt/nuxt-image/IPX的Bug。

环境对比情况 #

开发环境（正常） #

• ✅ <nuxt-img>标签被替换为带_ipx/路径和修饰符的<img>标签
• ✅ IPX服务器/中间件正常工作，可解析以/_ipx开头的路径
• ✅ 类似/_ipx/f_webp,q_80,s_1024x683/images/photos/my-photo.jpg的IPX图片路径可正常加载

生产环境（异常） #

• ✅ <nuxt-img>标签同样被替换为带_ipx/路径和修饰符的<img>标签
• ✅ IPX服务器/中间件正常运行，尝试解析以/_ipx开头的路径
• ❌ IPX图片路径无法被找到，报错：

Error: Not Found
The requested URL /_ipx/f_webp,q_80,s_1024x683/imagesphotos/photo1.jpg was not found on this server.

已确认信息 #

原始图片已从静态文件夹部署，可通过路径/images/photos/my-photo.jpg正常访问。

项目配置 #

package.json #

"dependencies": {
    "@nuxt/image": "^0.7.1",
    ...
  }

nuxt.config.js #

module.exports = {
  ssr: true,
  ...
  
  modules: [
    '@nuxt/image',
    ...
  ],

  image: {
    presets: {
      avatar: {
        modifiers: {
          width: 300,
          height: 300,
          format: 'webp',
          quality: 80,
        }
      },
      webp: {
        modifiers: {
          format: 'webp',
          quality: 80,
        }
      }
    }
  },
  ...
}

页面使用方式 #

<nuxt-img preset="webp" src="/images/photos/succes-vente-de-site.jpg" 
    width="1980" height="1320" sizes="sm:100vw md:100vw lg:100vw" loading="lazy" 
    class="rounded-2xl w-auto max-h-80" />

项目为SSR模式，通过Github Actions部署到Google App Engine。

排查及解决建议 #

1. 修复路径拼接问题
   从报错可见，请求路径中/images/photos/被错误合并为imagesphotos/，说明IPX处理路径时丢失了斜杠。可尝试在nuxt.config.js中显式配置IPX的基础路径：

image: {
  ipx: {
    baseURL: '/'
  },
  // 保留原presets配置
}

2. 配置Google App Engine路由规则
   GAE可能未将/_ipx开头的请求转发给Nuxt的IPX中间件，需在app.yaml中添加路由规则：

handlers:
- url: /_ipx/.*
  script: auto
- url: /.*
  script: auto

3. 检查部署脚本的静态资源处理
   确认Github Actions部署脚本中，静态文件夹（如static/images/photos/）被完整部署，没有出现路径合并或遗漏的情况。

4. 版本兼容性排查
   @nuxt/image v0.7.1依赖的IPX版本可能存在路径处理bug，可尝试升级@nuxt/image到最新稳定版（需提前测试兼容性），或降级至已知稳定版本。

内容的提问来源于stack exchange，提问作者Guillaume Prévost