Javascript 如何在url中隐藏电子邮件？

我正在尝试创建此注册页面，其中电子邮件显示在url路径中。我希望电子邮件不会显示在url路径中。现在，我有一个电子邮件检查页面，它检查数据库中是否存在电子邮件。如果它不在数据库中，则会转到注册页面，用户只需输入用户名和密码，并且电子邮件已使用useParams从电子邮件检查页面获取。但是，我不希望电子邮件不显示在url中，是因为

props.history.push（`/register2/${email}`）

我的代码看起来像这样

电子邮件检查api调用函数

const url = "/api/emailcheck";
    try {
      const response = await fetch(url, options);
      const text = await response.text();
      console.log(text);
      if (text === "does not exist") {
        props.history.push(`/register2/${email}`);

用户在其中输入用户名和密码的注册页面

import React, { useState } from "react";
import Button from "@material-ui/core/Button";
import CssBaseline from "@material-ui/core/CssBaseline";
import TextField from "@material-ui/core/TextField";
import Link from "@material-ui/core/Link";
import Grid from "@material-ui/core/Grid";
import Box from "@material-ui/core/Box";
import LockOutlinedIcon from "@material-ui/icons/LockOutlined";
import Typography from "@material-ui/core/Typography";
import { makeStyles } from "@material-ui/core/styles";
import Container from "@material-ui/core/Container";
import { withRouter, useParams } from "react-router-dom";

const useStyles = makeStyles(theme => ({
  paper: {
    marginTop: theme.spacing(8),
    display: "flex",
    flexDirection: "column",
    alignItems: "center"
  },
  form: {
    width: "100%",
    marginTop: theme.spacing(3)
  },
  submit: {
    margin: theme.spacing(3, 0, 2)
  }
}));

function Reg2(props) {
  const classes = useStyles();
  const [username, setUsername] = useState("");
  const [password, setPassword] = useState("");
  const { email } = useParams();

  const performRegister = async event => {
    event.preventDefault();
    var body = {
      username: username,
      password: password,
      email: email
    };
    console.log(body);
    const options = {
      method: "POST",
      headers: {
        "Content-Type": "application/json",
        Accept: "application/json"
      },
      body: JSON.stringify(body)
    };
    const url = "/api/register";
    try {
      const response = await fetch(url, options);
      const text = await response.text();
      if (text === "verifyemail") {
        props.history.push(`/verifyOtp/${email}`);
      } else {
        window.alert("registration failed");
      }
    } catch (error) {
      console.error(error);
    }
  };
  return (
    <Container component="main" maxWidth="xs">
      <CssBaseline />
      <div className={classes.paper}>
        <Typography component="h1" variant="h5">
          Enter Details
        </Typography>
        <form className={classes.form} noValidate onSubmit={performRegister}>
          <Grid container spacing={2}>
            <Grid item xs={12}>
              <TextField
                name="username"
                onChange={e => setUsername(e.target.value)}
              />
            </Grid>
            <Grid item xs={12}>
              <TextField
                required
                fullWidth
                name="password"
                type="password"
                onChange={e => setPassword(e.target.value)}
              />
            </Grid>
          </Grid>
          <Button
            type="submit"
            fullWidth
            variant="contained"
            color="primary"
            className={classes.submit}
          >
            Register
          </Button>
        </form>
      </div>
    </Container>
  );
}
export default withRouter(Reg2);

import React，{useState}来自“React”；
从“@物料界面/核心/按钮”导入按钮；
从“@material ui/core/CssBaseline”导入CssBaseline；
从“@material ui/core/TextField”导入TextField；
从“@material ui/core/Link”导入链接；
从“@material ui/core/Grid”导入网格；
从“@material ui/core/Box”导入框；
从“@material ui/icons/LockOutlined”导入LockOutlinedIcon；
从“@material ui/core/Typography”导入排版；
从“@material ui/core/styles”导入{makeStyles}”；
从“@material ui/core/Container”导入容器；
从“react router dom”导入{withRouter，useParams}；
const useStyles=makeStyles（主题=>({
论文：{
marginTop：主题。间距（8），
显示：“flex”，
flexDirection:“列”，
对齐项目：“中心”
},
表格：{
宽度：“100%”，
marginTop：主题。间距（3）
},
提交：{
边距：主题。间距（3,0,2）
}
}));
功能Reg2（道具）{
const classes=useStyles（）；
const[username，setUsername]=useState（“”）；
const[password，setPassword]=useState（“”）；
const{email}=useParams（）；
const performRegister=异步事件=>{
event.preventDefault（）；
变量体={
用户名：用户名，
密码：密码，
电邮：电邮
};
控制台日志（主体）；
常量选项={
方法：“张贴”，
标题：{
“内容类型”：“应用程序/json”，
接受：“应用程序/json”
},
body:JSON.stringify（body）
};
const url=“/api/register”；
试一试{
const response=等待获取（url、选项）；
const text=等待响应。text（）；
如果（文本==“验证电子邮件”）{
props.history.push（`/verifyOtp/${email}`）；
}否则{
窗口。警报（“注册失败”）；
}
}捕获（错误）{
控制台错误（error）；
}
};
返回(
输入详细信息
setUsername（e.target.value）}
/>
setPassword（e.target.value）}
/>
登记
);
}
使用路由器导出默认值（Reg2）；

app.js

function App() {
  return (
    <>
      <Router>
        <Switch>
          <Route exact path="/" component={Login} />
          <Route path="/register" component={Reg} />
          <Route path="/register2/:email?" component={Reg2} />
          <Route path="/Editor" component={Editor} />
          <Route path="/verifyOtp/:email?" component={VerifyOTP} />
        </Switch>
      </Router>
    </>
  );
}

函数应用程序（）{
返回(
);
}
您考虑过使用加密吗？如何实现@Dreamweaver会将电子邮件隐藏在url中吗？与其将电子邮件放入路由（以及可见的url），不如在后台使用AJAX/fetch进行检查，然后根据结果重定向用户。我该怎么做？如何使用重定向中的道具？这是否回答了您的问题？