Qwik静态应用部署Vercel后server$函数报错：操作不安全

• Qwik的静态适配器会生成纯静态HTML/CSS/JS资源，无后端运行环境。server$函数本质是需在服务器端执行的逻辑，开发环境依赖Qwik Dev Server提供后端支撑所以能正常运行，但部署到Vercel静态环境后，无后端执行上下文，浏览器会尝试在客户端执行本应在后端运行的代码，从而触发The operation is insecure错误。
• 改用globalAction$后仍失效，是因为globalAction$同样需要服务器端环境处理请求路由与逻辑执行，静态适配器无法提供该环境，导致开发和生产环境都无法正常触发action。

1. 替换为Vercel专用适配器
   卸载静态适配器，安装Qwik的Vercel边缘/Serverless适配器：

   npm uninstall @builder.io/qwik-city/adapters/static
   npm install @builder.io/qwik-city/adapters/vercel-edge
   

   然后修改vite.config.ts中的适配器配置，替换为Vercel适配器：

   import { vercelEdgeAdapter } from '@builder.io/qwik-city/adapters/vercel-edge/vite';
   import { extendConfig } from '@builder.io/qwik-city/vite';
   import baseConfig from './vite.config';
   
   export default extendConfig(baseConfig, () => {
     return {
       build: {
         ssr: true,
         outDir: '.vercel/output/functions/_qwik-city.func',
         rollupOptions: {
           output: {
             manualChunks: undefined,
           },
         },
       },
       plugins: [vercelEdgeAdapter()],
     };
   });
   

2. 调整Vercel部署配置
   在Vercel项目中，确保部署配置使用npm run build命令，Vercel会自动识别适配器生成的Serverless/Edge函数并配置运行环境。

3. 验证server$函数逻辑

   • 确保addCustomer中的MongoDB连接使用Vercel环境变量配置，避免硬编码敏感信息。
   • 确认server$内的代码无浏览器API依赖，所有逻辑均为纯后端可执行代码。

4. 修复globalAction$调用（若继续使用）
   若坚持使用globalAction$，需确保：

   • 适配器已更换为Vercel专用适配器，提供后端路由支持。
   • 在组件中通过useAction$绑定action，而非直接调用：

     const addCustomerAction = useAction$(useAddCustomer);
     

     然后在按钮点击事件中调用addCustomerAction()。

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