Vue前端请求后端接口出现跨域问题（启用拦截器后）

解释：

跨域问题是浏览器出于安全考虑，限制来自不同源（协议、域名、端口任一不同）的Web页面对当前域的资源的访问。当Vue前端请求后端接口时，如果前端和后端不在同一个域下，浏览器会阻止这次请求。启用拦截器之后，前端的请求被拦截器拦截并添加了额外的请求头，导致请求变成了非简单请求，进而要求后端支持CORS（跨源资源共享）。

解决方法：

1. 后端设置CORS允许特定的前端域名或IP访问接口。

   在后端服务中（如Node.js的Express或Java的Spring框架）设置CORS的相关配置，例如：

   // Node.js Express示例
   app.use(function(req, res, next) {
     res.header("Access-Control-Allow-Origin", "http://your-frontend-domain.com"); // 或者 '*' 表示允许所有域
     res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
     next();
   });

   JavaScript

   Copy

2. 如果使用的是Spring框架，可以添加@CrossOrigin注解到Controller或者具体的方法上。

   // Spring Controller示例
   @CrossOrigin(origins = "http://your-frontend-domain.com")
   @RestController
   public class YourController {
       // ...
   }

   Java

   Copy
3. 如果使用的是其他后端技术，请查阅相关文档了解如何设置CORS。

确保前端请求的URL与后端服务的URL相同，且协议、域名、端口完全一致，否则即使后端设置了CORS，由于协议、域名、端口任一不同也会导致跨域问题。