这是我第一次将Web应用程序部署到生产环境中。我使用的是Heroku,并通过Udemy学习了教程。如果需要,我可以提供教程的repo,但我认为这是100%由我负责的。
现在我的所有API调用都是对localhost:8000/api/v1/xxxxxxxx的调用,我在生产环境中看到了这一点-这些调用没有拉入数据。net::ERR_CONNECTION_REFUSED.我注意到这一点,当我与我的丈夫分享产品的URL,他无法查看他的笔记本电脑上的任何后端数据.
在我的笔记本电脑上,Safari、Chrome、Firefox和Brave浏览器都能正常工作--包括在隐身模式下--但在其他机器上就不行了--所以我知道我在这里做错了什么。
我觉得我问这个问题完全是个菜鸟,但是我应该改变API URL吗?我觉得答案是肯定的,但是我在哪里放置我在Heroku中使用的prod URL呢?我的代码中没有Heroku URL。
这是一个MERN应用程序,如果有帮助的话,我使用了一个代理,它在我的package.json文件中作为“proxy”:“地址:”。
请随意查看网站本身-URL是r2bdb.herokuapp.com。您可以使用test.account@ www.example.com登录gmail.com,密码是 password。如果它确实为您加载了,则所有内容都是虚拟数据。
这是来自server.js文件的代码。
import express from 'express';
const app = express();
import dotenv from 'dotenv';
dotenv.config();
import 'express-async-errors';
import morgan from 'morgan';
import cors from 'cors';
import nodemailer from 'nodemailer'
import { dirname } from 'path';
import { fileURLToPath } from 'url';
import path from 'path';
import helmet from 'helmet';
import xss from 'xss-clean';
import mongoSanitize from 'express-mongo-sanitize';
// db and authenticateUser (mongodb + prisma)
import connectDB from './lib/connect.js';
import prisma from './lib/prisma.js';
// routers
import authRouter from './routes/authRoutes.js';
import sandboxRouter from './routes/sandboxRoutes.js';
import volunteerRouter from './routes/volunteerRoutes.js';
import eventRouter from './routes/eventRoutes.js';
import politicalRouter from './routes/politicalSkillsRoutes.js'
import lifeRouter from './routes/lifeSkillRoutes.js'
// middleware
import notFoundMiddleware from './middleware/not-found.js';
import errorHandlerMiddleware from './middleware/error-handler.js';
import authenticateUser from './middleware/auth.js';
if (process.env.NODE_ENV !== 'production') {
app.use(morgan('dev'));
}
const __dirname = dirname(fileURLToPath(import.meta.url));
// only when ready to deploy
app.use(express.static(path.resolve(__dirname, './client/build')));
app.use(express.json());
app.use(
helmet({
contentSecurityPolicy: false,
})
);
app.use(xss());
app.use(mongoSanitize());
app.use(cors());
app.use('/api/v1/auth', authRouter);
app.use('/api/v1/sandbox', sandboxRouter);
app.use('/api/v1/volunteer', volunteerRouter);
app.use('/api/v1/event', eventRouter);
app.use('/api/v1/political', politicalRouter)
app.use('/api/v1/life', lifeRouter)
// only when ready to deploy
app.get('*', (req, res) => {
res.sendFile(path.resolve(__dirname, './client/build', 'index.html'));
});
app.use(notFoundMiddleware);
app.use(errorHandlerMiddleware);
const port = process.env.PORT || 8000;
const start = async () => {
try {
await connectDB(process.env.MONGO_URL);
app.listen(port, () => {
console.log(`Server is listening on port ${port}...`);
});
} catch (error) {
console.log(error);
}
};
start();
正如我前面提到的,我的代码中没有任何一个生产URL。我觉得这就是问题所在,但我不确定如果我是正确的,URL会去哪里。每个API调用都类似于:我的.env文件将PORT列为8000,因此我在任何具有prodURL的地方都没有环境变量。
很抱歉问了一个愚蠢而基本的问题--我从来没有真正做到这一步,把一个站点部署到我自己的生产环境中。如果我需要提供更多的信息,请让我知道--我不确定这里真正需要什么信息,不想超载,所以我只使用了我的server.js文件。
1条答案
按热度按时间xzabzqsa1#
我刚刚发现了我的错误-我遗漏了baseURL。如果其他人遇到这个问题,我通过在我的代码中写入以下内容来修复它:
然后在我的axios调用中使用baseURL + '/api/v1/xxxxxxxx'。