如何正确配置Nginx以避免代理请求时CSS和JavaScript资源显示样式不一致的问题？

为了正确配置 Nginx 避免代理请求时 CSS 和 JavaScript 资源显示样式不一致的问题，你需要确保静态资源直接从服务器提供，而不是通过代理。这里是一个基本的步骤：

1. **设置反向代理**：首先，在 Nginx 的 `http` 或 `server` 模块下配置代理。例如，如果你有一个应用运行在 `app.example.com` 上，你可以这样配置：

   location / {
       proxy_pass http://app.example.com;
       # 如果应用需要跨域访问，添加允许头部
       add_header 'Access-Control-Allow-Origin' '*';
       add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
   }

2. **指定静态路径**：然后，创建一个单独的 `location` 来处理静态文件，如 `/css`, `/js`, 等：

   location ~* \.(ico|jpg|jpeg|png|gif|svg|eot|ttf|woff|woff2)$ {
       alias /var/www/static/;
       expires max;
   }
   location ~* \.html$ {
       root /var/www/html;
   }

这里 `alias` 将所有匹配的静态文件路径指向实际存储静态文件的目录。

3. **启用 gzip 压缩**：这有助于减少响应时间并提高性能：

   gzip on;
   gzip_types application/javascript application/x-javascript text/css text/plain text/xml application/xml application/xml+rss text/javascript;

4. **测试和验证**：重启 Nginx 服务后，检查浏览器开发者工具中的网络请求，确保 CSS 和 JavaScript 文件未经过代理而是直接下载。