vue3项目:
需要安装http-proxy-middleware配置代理 pnpm add http-proxy-middleware 解决跨域问题
根目录下新建vercel.json
{
"rewrites": [
{
"source": "/api/(.*)",
"destination": "/api/proxy"
}
]
}
根目录下新建api文件夹,再在api文件夹里新建proxy.js文件
import { createProxyMiddleware } from 'http-proxy-middleware'
export default function (req, res) {
let target = ''
配置代理,和vite.config.ts中的proxy差不多
// 代理1
if (req.url.includes('/api/api-two')) {
target = 真实请求地址1
}
// 代理2
else if (req.url.includes('/api/')) {
target = 真实请求地址2
}
console.log('target😊===》', target)
createProxyMiddleware({
target,
changeOrigin: true,
pathRewrite: {
'^/api/api-two/': '/',
'^/api/': '/',
},
})(req, res)
}
koa2项目
根目录下新建vercel.json
{
"builds": [
{
"src": "./index.js",
"use": "@vercel/node"
}
],
"routes": [
{
"src": "/(.*)",
"dest": "/",
"headers": {
"Access-Control-Allow-Credentials": "true",
"Access-Control-Allow-Origin": "*",
"Access-Control-Allow-Methods": "GET,OPTIONS,PATCH,DELETE,POST,PUT",
"Access-Control-Allow-Headers": "X-CSRF-Token, X-Requested-With, Accept, Accept-Version, Content-Length, Content-MD5, Content-Type, Date, X-Api-Version"
}
}
]
}
根目录下新建index.js
index.js的内容就是koa2项目bin/www的内容
...
//port端口号改一下,不要用默认的
server.listen(port);
...
vercel配置
如果数据库用的是mongodb atlas 把network access 里面的IP Access 改一下,我暂时改为允许所有IP访问. 否则vercel连不上数据库.