vue 在服务器端直接修改请求的接口地址

为了实现“vue 在服务器端直接修改请求的接口地址”，我们需要将客户端（浏览器端）和服务器端的配置进行调整。具体的步骤如下：

1. 在客户端（浏览器端）进行配置

首先，在 vue.config.js（如果没有则需要创建） 中配置 devServer 选项：

module.exports = {
  devServer: {
    proxy: {
      // 将URL中的 "/api" 替换为空字符串
      '/api': {
        target: 'http://localhost:3000',
        pathRewrite: { '^/api': '' }
      }
    }
  }
}

以上代码表示，我们将所有以 /api 开头的 URL 替换为 http://localhost:3000/。如果在服务器端有对应的接口处理，那么浏览器发送的请求就会被转发到服务器端进行处理。这里需要注意的是，如果服务器端的端口号不是 3000，则需要将 target 中的端口号替换为实际的端口号。

2. 在服务器端进行配置

接下来，在服务器端需要增加一个代理 API，用于接收客户端发来的请求并代理到实际的接口处理函数中进行处理。根据不同的后端框架或语言，具体的实现方式可能会有所不同。以下是两个不同后端框架或语言的示例：

示例 1：Node.js + Express

const express = require('express')
const app = express()

app.use('/api', (req, res) => {
  const url = 'http://localhost:4000' + req.originalUrl.replace('/api', '')
  req.pipe(request(url)).pipe(res)
})

app.listen(3000, () => {
  console.log('Server is running at http://localhost:3000')
})

以上代码中，我们定义了一个 /api 的路由，所有以 /api 开头的请求都将被转发到 http://localhost:4000 服务器上进行处理。这里使用了 request 模块来进行代理，所以在使用之前需要先安装 request 模块。

示例 2：Java + Spring Boot

import org.springframework.boot.web.client.RestTemplateBuilder;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.client.RestTemplate;
import org.springframework.web.servlet.config.annotation.InterceptorRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;

@Configuration
public class AppConfig implements WebMvcConfigurer {

  @Bean
  public RestTemplate restTemplate() {
    return new RestTemplateBuilder().rootUri("http://localhost:4000").build();
  }

  @Override
  public void addInterceptors(InterceptorRegistry registry) {
    registry.addInterceptor((req, res, handler) -> {
      req.getRequestDispatcher(req.getRequestURI().replace("/api", "")).forward(req, res);
      return false;
    });
  }
}

以上代码中，我们定义了一个拦截器，所有以 /api 开头的请求都将被转发到 http://localhost:4000 服务器上进行处理。这里使用了 RestTemplate 来进行代理，所以需要首先将 RestTemplate 实例化，并设置 rootUri 为实际的服务器地址。然后在拦截器中进行转发。

结束语

以上就是“vue 在服务器端直接修改请求的接口地址”的完整攻略，其中涉及到的技术点有：vue-cli、webpack-dev-server、代理 API、路由匹配和拦截器等。实际应用中，具体的实现方式可能会因场景而异，但是原理都是相同的。