【发布时间】：2021-11-30 10:27:05
【问题描述】：
link to repo
link to bug report
我一直在关注Lama Dev's Social Networking Tutorial 但是在 docker 容器中运行它，他在教程中没有这样做。其中一个容器是 Traefik，它充当 80 和 443 的网关，还有一个充当管理面板的网关，但我还没有为 API 打开 8800，因为我知道 React 仍然应该在 docker 的默认网络中看到它，我不确定 405 是来自 API 还是仍然在 React 中，我在 405 上读到的内容说它通常在客户端中，并且记录错误的行在 React 中，但它在失败的调用中，所以可能 405 消息是 Axios 响应，表示不允许连接。我不确定还可以尝试更改什么？
它似乎在本地开发中运行良好，但在生产中却不行，它通常在https:geoLARP.com，如果它关闭了几分钟，我可能正在尝试在服务器上重建，它很快就会恢复。
我还想知道是否需要删除 CORS，他在 repo 中有它们，但从未在视频中提及它们..
我认为从 dev 到 prod 的唯一环境变量是 LOCAL_HOST，我将其更改为 geolarp.com，我也应该包括HTTP:// 吗？
export DEV_MAIL=janeDOE@mail.com
export LOCAL_HOST=localhost
export MongoDB_PASSWORD=butterzCUPz
export MongoDB_USERNAME=janeDOE
export WORDPRESS_DB_HOST=db
export WORDPRESS_DB_NAME=exampledb
export WORDPRESS_DB_PASSWORD=examplepass
export WORDPRESS_DB_USER=exampleuser
docker-compose up -d --build
docker-compose down -v --remove-orphans
我开始尝试通过 PostMan，但目前，我还没有将 API 向公众开放，我希望 React 只需将代理更改为 API 容器即可在 docker 默认网络上看到它。所以我在.env 文件中将localhost:8800 更改为mernlama:8800
Regist.jsx
import axios from "axios";
import { useRef } from "react";
import { useHistory } from "react-router";
import "./register.css";
export default function Register() {
const username = useRef();
const email = useRef();
const password = useRef();
const passwordAgain = useRef();
const history = useHistory();
const handleClick = async (e) => {
e.preventDefault();
// console.log(email.current.value);
if (passwordAgain.current.value !== password.current.value) {
passwordAgain.current.setCustomValidity('PassWords do not Match');
} else {
const user = {
username: username.current.value,
email: email.current.value,
password: password.current.value,
};
try {
await axios.post("/auth/register", user);
history.push("/login");
} catch (err) {
console.log(err);
}
}
};
return (
<div className="login">
<div className="loginWrapper">
<div className="loginLeft">
<h3 className="loginLogo">geoLARP</h3>
<span className="loginDesc">
GeoLocated
</span>
<span className="loginDesc">
Live Action Role Playing
</span>
</div>
<div className="loginRight">
<form className="loginBox" onSubmit={handleClick} >
<input
placeholder="Username"
required
className="loginInput"
ref={username}
/>
<input
placeholder="please use a disposable Email"
type='email'
required
className="loginInput"
ref={email}
/>
<input
placeholder="Password"
type='password'
required
minLength="6"
className="loginInput"
ref={password}
/>
<input
placeholder="Password Again"
type='password'
required
className="loginInput"
ref={passwordAgain}
/>
<button className="loginButton" type='submit' >Sign Up</button>
<button className="loginRegisterButton">
Log into Account
</button>
</form>
</div>
</div>
</div>
);
}
expressAPI/routes/auth.js
const router = require('express').Router();
const User = require('../models/User');
const bcrypt = require('bcrypt');
// REGISTER
router.post('/register', async (req, res) => {
try {
// generate a salty password
const salt = await bcrypt.genSalt(10);
const hashedPassword = await bcrypt.hash(req.body.password, salt);
// create a new user
const newUser = new User({
username: req.body.username,
email: req.body.email,
password: hashedPassword,
});
// save the user and respond
const user = await newUser.save();
console.log(user);
res.status(200)
// .json({ message: 'Registered User with API AUTH Route', user: user._id });
.json(user);
} catch (err) {
res.status(500).json(err);
}
}); // GET /api/auth
// LOGIN
router.post('/login', async (req, res) => {
try {
// find the user
const user = await User.findOne({ email: req.body.email });
// check if the user exists
!user && res.status(404).json('User not found');
// check if the password is correct
const validPassword = await bcrypt.compare(req.body.password, user.password);
!validPassword && res.status(400).json('Invalid Password');
// respond with the user
res.status(200).json(user);
} catch (err) {
res.status(500).json(err);
}
}); // GET /api/auth/login
module.exports = router;
// export default router;
【问题讨论】：
标签： node.js reactjs docker express