我正在登录和注册,由于不知道如何发送数据或令牌,我在登录时遇到了很多问题,我稍后会询问。 直到我实施了react之前,注册中的所有内容都运行良好,而在没有问题的情况下没有进行注册和登录,则反应不佳
我尝试了一切,我从表单中获取响应,但没有从表单中获取数据,响应还可以,但是req.body为空,没有给我bck应该添加到db的json对象
这是我的主要app.js文件,用于放置模型和路线
] add Showoff#master
这是我的注册函数,我在app.js中调用了它的路由
const app = express()
app.use(cors())
//headers
app.use((req, res, next) => {
res.header("Access-Control-Allow-Origin", "*");
res.header(
"Access-Control-Allow-Headers",
"Origin, X-Requested-With, Content-Type, Accept, Authorization"
);
if (req.method === "OPTIONS") {
res.header("Access-Control-Allow-Methods", "PUT, POST, PATCH, DELETE, GET");
return res.status(200).json({});
}
next();
});
//body parser for form data
app.use(bodyParser.json())
app.use(bodyParser.json({ type: 'application/*+json' }))
app.use(bodyParser.urlencoded({ extended: true }))
app.use(cookieParser())
// secure apps by setting various HTTP headers
app.use(helmet())
// enable CORS - Cross Origin Resource Sharing
app.options('*', cors());
//fetching index from react
app.use(express.static(path.join(__dirname, '../client/build')));
app.get('*', (req, res) => {
res.send(express.static(path.join(__dirname, '../client/build/index.html'))) ;
});
app.use('/api/signup', userRoute.signup )
app.listen(CONFIG.port, (err) => {
if (err) {
console.log(err)
}
console.info('Server started on port %s.', CONFIG.port)
})
module.exports = app
app.use((err, req, res, next) => {
if (err.name === 'UnauthorizedError') {
res.status(401).json({"error" : err.name + ": " + err.message})
}
})
包含我的数据库的server.js文件
exports.signup=function(req , res){
if(req.method == "POST"){
var fname = req.body.first_name;
var lname= req.body.last_name;
var username = req.body.username;
var pass= req.body.password;
var email=req.body.email;
var dec_pass =atob(toString(pass));
var encrypted_pass = cryptr.encrypt(dec_pass);
var sql = "INSERT INTO `user`(`user_id`,`first_name`,`last_name`,`user_name` , `email`,`password`) VALUES ('','" + fname + "','" + lname + "','" + username + "','" +email+ "','" +encrypted_pass+ "')";
var query = db.query(sql, function(err, result){
message = "Succesfully! Your account has been created.";
console.log(req)
res.render('/Login');
res.end(JSON.stringify(result));
});
}
}
我对注册表单的前端做出反应,在这里应将代码放在componentDidMount o上的提交位置?我真的很困惑,但是就这样,我看到的响应很好,但是当我放置方法:“ POST”时,它开始使我处于待处理状态,并且花了很多时间才能结束
const sequelize = new Sequelize ("users" , "root" , "" ,{
host:'localhost',
dialect:'mysql',
operatorAliases:false,
pool:{
max:5,
min:0,
acquire:30000,
idle:10000
}
})
console.log('alright')
console.log(CONFIG)
console.log(login)
db.sequelize=sequelize
db.Sequelize=Sequelize
export default db
带帖子:
import React, { Component } from "react";
import { request } from "https";
class Signup extends Component {
constructor(props) {
super(props);
this.state = {
first_name:'',
last_name:'',
username:'',
email:'',
password :''
}
}
componentDidMount(){
}
handleChange = e => {
if (e.target.name === "first_name") {
this.setState({ first_name: e.target.value });
}
if (e.target.name === "last_name") {
this.setState({ last_name: e.target.value });
}
if (e.target.name === "username") {
this.setState({ username: e.target.value });
}
if (e.target.name === "email") {
this.setState({ email: e.target.value });
} if (e.target.name === "password") {
this.setState({ password: e.target.value });
}
};
handleSubmit = e => {
e.preventDefault();
fetch('/api/signup', {
headers : {
'Content-Type': 'application/json',
'Accept': 'application/json'
},
data: JSON.stringify({
fname :this.state.first_name,
lname:this.state.last_name,
username:this.state.username,
email:this.state.email,
pass:this.state.password
})
}).then(response => {
console.log(response , request.body);
return JSON.stringify(response)
})
}
render() {
return (
<div style={{ backgroundColor: "#0f7986" }}>
<div>
<div className="container">
<div className="text-white align-items-center text-center justify-content-center">
<div>
{" "}
{/* <img src={logo} width="13%" /> */}
</div>
<h4 style={{ marginTop: "1%" }}>Bellevue Medical Center</h4>
</div>
</div>
<div
className="card"
style={{
borderWidth: "10px",
borderColor: "#0f7986",
borderStyle: "outset",
width: "50%",
margin: "0% 25%",
borderRadius: "15px"
}}
>
<div className="card-body">
<h5
className="card-title text-center"
style={{ color: "#0f7986" }}
>
Registration
</h5>
<form method = "POST" action = "http://localhost/api/signup"
style={{
marginLeft: "15px",
marginRight: "15px",
marginTop: "10px"
}}
>
<div className="form-group input-group">
<div className="input-group-prepend">
<span className="input-group-text">
{" "}
<i className="fa fa-user" />{" "}
</span>
</div>
<input
name="first_name"
className="form-control"
value={this.state.first_name}
placeholder=" FirstName"
type="text"
onChange={this.handleChange}
/>
</div>
<div className="form-group input-group">
<div className="input-group-prepend">
<span className="input-group-text">
{" "}
<i className="fa fa-user-edit" />{" "}
</span>
</div>
<input
name="last_name"
className="form-control"
value={this.state.last_name}
placeholder=" LastName"
type="text"
onChange={this.handleChange}
/>
</div>
<div className="form-group input-group">
<div className="input-group-prepend">
<span className="input-group-text">
{" "}
<i className="fa fa-envelope" />{" "}
</span>
</div>
<input name="username"
className="form-control"
value={this.state.username}
placeholder="UserName"
type="text"
onChange={this.handleChange}
/>
</div>
<div className="form-group input-group">
<div className="input-group-prepend">
<span className="input-group-text">
{" "}
<i className="fa fa-user" />{" "}
</span>
</div>
<input
name="email"
className="form-control"
value={this.state.email}
placeholder="Email address"
type="email"
onChange={this.handleChange}
/>
</div>
<div className="form-group input-group">
<div className="input-group-prepend">
<span className="input-group-text">
{" "}
<i className="fa fa-lock" />{" "}
</span>
</div>
<input
name="password"
className="form-control"
value={this.state.password}
placeholder="Password"
type="text"
onChange={this.handleChange}
/>
</div>
<button
type="submit"
className="btn "
style={{
backgroundColor: "#0f7986",
color: "white",
float: "right"
}}
// disabled={!(this.state.first_name && this.state.email && this.state.password)}
onClick={this.handleSubmit}
>
Submit
</button>
</form>
</div>
</div>
</div>
</div>
);
}
}
export default Signup;
没有方法:POST
Referrer Policy: no-referrer-when-downgrade
Provisional headers are shown
Accept: application/json
Content-Type: application/json
Origin: http://localhost:3001
Referer: http://localhost:3001/api/signup
我想知道解决方案是什么,终点是什么,请进行任何更正