我实现了一个使用express的express服务器。静态服务于从静态docusaurus站点创建的构建文件夹，以便应用基本身份验证来访问站点。这在本地工作得很好，但我在部署到Vercel时遇到了麻烦。
目前我的配置允许部署版本在vercel上呈现基本的身份验证登录页面，但在成功登录后，我被定向到一个页面，状态:"Cannot GET/">
我相信这可能是我的vercel的问题。
我的代码如下:index.mjs
import express from 'express';
import dotenv from 'dotenv';
dotenv.config();
const app = express();
app.use(express.json());
const authorize = ((req, res, next) => {
const auth = {login: process.env.USERNAME, password: process.env.PASSWORD}
const b64auth = (req.headers.authorization || '').split(' ')[1] || ''
const [login, password] = Buffer.from(b64auth, 'base64').toString().split(':')
if (login && password && login === auth.login && password === auth.password) {
return next()
}
res.set('WWW-Authenticate', 'Basic realm="401"')
res.status(401).send('Authentication required.')
});
app.use('/', authorize);
app.use('/', express.static('build'));
app.listen(3000);
console.log(`🚀 Server ready at http://localhost:3000`);
vercel.json
{
"version": 2,
"builds": [{
"src": "./index.mjs",
"use": "@vercel/node"
}],
"routes": [{"handle": "filesystem"},
{
"src": "/.*",
"dest": "/"
}
]
}
包。启动脚本
"start": "node --experimental-modules index.mjs",
我的vercel模板设置为other，启动脚本设置为npm start。
任何想法都将非常感激!
我有类似的问题:提供一些静态内容和使用/api路由。在本地开发中一切正常，但抛出了&;Cannot GET/&;在vercel。
我的解决方案。
- 分别构建无服务器和静态内容。
- /api调用和静态内容的路由调整
My finalvercel.json:
{
"version": 2,
"builds": [
{
"src": "server.js",
"use": "@vercel/node"
},
{
"src": "public/**",
"use": "@vercel/static"
}
],
"routes":[
{
"src": "/api/(.*)",
"dest": "server.js"
},
{
"src": "/",
"dest": "public/index.html"
},
{
"src": "/(.+)",
"dest": "public/$1"
}
]
}
- 所有静态内容在/public下(html,css,img,js等)
- server.js是主要的应用:express和route定义。和你的差不多。
- vercel build log显示:
Generated build outputs:
12:28:55.974 - Static files: 12
12:28:55.974 - Serverless Functions: 1
12:28:55.975 - Edge Functions: 0
...
12:28:58.142 Done with "server.js"
也许从这一点上你可以找到解决你的问题的办法。
好的，我一直在寻找解决这个问题的办法，结果我们必须在express:
明确地提供index.html:app.get('/', (req: Request, res: Response) => {
res.sendFile('index.html', {root: path.join(__dirname, 'public')});
});
，因为您可能在公共文件夹中有index.html。这就解决了我的问题。
对于那些尽管遵循了上面的答案但仍然无法看到docusaurus加载的人，请确保将docs/build文件夹添加到Git存储库中，以便将其部署到Vercel。可以通过在.gitignore文件中添加以下行来实现:
!docs/build/
这将忽略除docs/build文件夹外的所有文档和文件夹。
在我的例子中，我需要使用相同的基础URL来加载页面请求和每个页面中包含的资源。
请求:
GET: mywebsite.com/customer/favorites
- GET: mywebsite.com/assets/images/logo.svg
- GET: mywebsite.com/assets/css/bootstrap.min.css
- GET: mywebsite.com/modules/shared/web-components/item-list.js
文件结构:
public
- assets
- images
- css
- modules
- admin
- customer
- shared
server.js
package.json
所以，我写了一个vercel.json文件，它接受所有没有文件扩展名的请求url，并将它们传递给server.js文件，而具有文件扩展名的请求url(如.css, .js, .img)被视为对公共目录
{
"name": "express-static-website",
"version": 2,
"public": true,
"builds": [
{
"src": "server.js",
"use": "@vercel/node"
},
{
"src": "public/**",
"use": "@vercel/static"
}
],
"routes": [
{
"src": "/((?!.*\.\w+$).*)",
"dest": "/server.js"
},
{
"src": "/(.+\.[a-z]+)$",
"dest": "/public/$1"
}
]
}