解决Vite迁移自CRA后iOS通用链接apple-app-site-association文件重定向问题

这个问题本质是Vite对无后缀静态文件的处理逻辑和CRA不同，同时生产部署时的服务器配置也可能导致请求被路由到SPA入口（index.html）。以下分开发环境和生产环境给出具体解决方法：

一、开发环境（本地调试） #

Vite的devServer默认会将无后缀的请求视为SPA路由，而非静态文件，因此会重定向到根路径（index.html）。需要在vite.config.js中添加配置，强制识别该文件为静态资源并返回正确内容：

1. 配置MIME类型映射
   在server.mimeTypes中指定目标文件的类型：

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'

export default defineConfig({
  plugins: [react()],
  server: {
    mimeTypes: {
      '/apple-app-site-association': 'application/json'
    }
  }
})

2. 或者使用路由重写规则
   如果MIME配置不生效，可添加rewrite规则强制指向静态文件：

server: {
  rewrite: [
    {
      from: /^\/apple-app-site-association$/,
      to: '/apple-app-site-association'
    }
  ]
}

二、生产环境部署 #

打包后需确保文件被正确输出到dist根目录，同时配置服务器直接返回该文件，而非转发到SPA入口。

1. 确保Vite打包时保留文件 #

在vite.config.js的build配置中，确保无后缀文件不被重命名或遗漏：

build: {
  rollupOptions: {
    output: {
      assetFileNames: (assetInfo) => {
        if (assetInfo.name === 'apple-app-site-association') {
          return 'apple-app-site-association'
        }
        return 'assets/[name].[hash][extname]'
      }
    }
  }
}

打包后检查dist目录，确认apple-app-site-association文件存在于根目录。

2. 服务器配置示例（Nginx） #

在Nginx配置中添加单独的location规则，优先处理该文件请求：

server {
  # 其他基础配置（端口、根目录等）...

  location /apple-app-site-association {
    root /path/to/your/dist;
    default_type application/json;
    try_files $uri =404;
  }

  # SPA路由的默认配置（放在后面）
  location / {
    try_files $uri $uri/ /index.html;
  }
}

3. 服务器配置示例（Apache） #

在.htaccess中添加规则：

RewriteEngine On
# 优先处理apple-app-site-association
RewriteRule ^apple-app-site-association$ - [L]

# SPA路由规则
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^ index.html [L]

三、验证方法 #

配置完成后：

• 开发环境：访问http://localhost:5173/apple-app-site-association，应直接返回文件的JSON内容
• 生产环境：用curl或浏览器访问https://xxx.com/apple-app-site-association，确认返回正确的JSON，且无重定向

内容的提问来源于stack exchange，提问作者OMGImOut