Vue 配置多个代理服务器，解决跨域

请求https://picsum.photos/v2/list?page=2&limit=100发生跨域，进行以下配置：

1、src/utils/request.ts

import axios from 'axios'
​
const instance = axios.create({
  // 无需再配置 baseURL，因为已经配置了代理
  // baseURL: 'http://xxx.xxx.xxx:3000',
  timeout: 2000
})

2、src/api/index.ts

import { request } from '@/utils/request'
​
export function getTest(params) {
  return request({
    // 配置路径前缀 /api
    url: '/api/get',
    method: 'get',
    params
  })
}
​
export function getPicsum() {
  return request({
    // 配置路径前缀 /picsum
    url: '/picsum/v2/list',
    method: 'get',
    params: {
      page: 2,
      limit: 100
    }
  })
}

3、vite.config.ts

import { defineConfig } from 'vite'
​
export default defineConfig({
  server: {
    port: 3000,
    open: true,
    proxy: {
      // 配置不同的路径前缀对应不同的服务器
      '/api': {
        target: 'http://localhost:8080',
        changeOrigin: true,
        rewrite: (path) => path.replace(/^/api/, '')
      },
      // 配置不同的路径前缀对应不同的服务器
      '/picsum': {
        target: 'https://picsum.photos/',
        changeOrigin: true,
        rewrite: (path) => path.replace(/^/picsum/, '')
      }
    }
  }
})