当我登录时，如何恢复和验证令牌？

Question

我是个代码初学者。我的问题对你来说当然很容易解决，但对我来说，这确实是一个令人头痛的问题。我正在建立一个社交网络，人们可以注册和记录我们，然后，他们可以发表文章。我与React、和mysql一起工作。登记和日志都可以。以前曾经工作过(后端和前端)，但是现在，当我想添加一个帖子时，有一个问题：

C:\Users\sever\code\REACT\2022-03-JS-Nantes-Dear\backend\node_modules\jsonwebtoken\verify.js:53    
    return done(new JsonWebTokenError('jwt must be provided'));
                ^
JsonWebTokenError: jwt must be provided

PostController.js：

> const Joi = require("joi");
> const dayjs = require("dayjs");
> const jwt = require("jsonwebtoken");
> const models = require("../models");
> 
> class PostController {
> static add = async (req, res) => {
> const { content, categoryId } = req.body;
> const { accessToken } = req.body;
> const user = jwt.verify(accessToken, process.env.JWT_AUTH_SECRET);
> 
> const validationErrors = Joi.object({
> content: Joi.string().max(255).required(),
> categoryId: Joi.number().required(),
>     }).validate({ content, categoryId }).error;
> 
> if (validationErrors) {
> res.status(422).send(validationErrors);
> return;
>     }
> 
> models.post
>       .insert({
> content,
> userId: user.id,
> categoryId: parseInt(categoryId, 10),
> createdAt: dayjs().format("YYYY-MM-DD HH:mm:ss"),
> likers: 0,
> signals: 0,
>       })
>       .then(([result]) => {
> res.status(201).send({
>           ...result,
> id: result.insertId,
>         });
>       })
>       .catch((err) => {
> console.error(err);
> res.status(500).send({
> error: err.message,
>         });
>       });
>   };
> }
> 
> module.exports = PostController;

PostManager.js：

> const AbstractManager = require("./AbstractManager");
> 
> class PostManager extends AbstractManager {
> static table = "post";
> 
> 
> insert(post) {
> return this.connection.query(
>       `insert into ${PostManager.table} (content, userId, categoryId, createdAt, likers, signals) values (?, ?, ?, ?, ?, ?)`,
> [
> post.content,
> post.userId,
> post.categoryId,
> post.createdAt,
> post.likers,
> post.signals,
>       ]
>     );
> 
> }
> 
> module.exports = PostManager;

post.routes.js：

controllers=require(“PostController”)；const {PostController}=require(“./控制器”)；const路由= express.Router()；

routes.get("/post"，PostController.browse)；routes.get("/post/:id"，PostController.read)；routes.put("/post/:id"，PostController.edit)；routes.post("/post/posttext"，PostController.add)；routes.delete("/post/:id"，PostController.delete)；

module.exports =路线；

在进行了大量的研究之后，我知道我的令牌是空的或者是空的，但是我不知道如何在我被记录时恢复它。

import { React, useEffect, useState } from "react";
import { useNavigate } from "react-router-dom";
import "./styles/PostText.css";
import axios from "axios";
import swal from "sweetalert";
import ButtonReturnGreen from "./ButtonReturnGreen";
import ButtonPublierPost from "./ButtonPublierPost";

function PostText() {
  const [content, setContent] = useState("");
  const [categoryId, setCategoryId] = useState("");
  const [categories, setCategories] = useState([]);

  const navigate = useNavigate();

  useEffect(() => {
    axios
      .get(`${import.meta.env.VITE_BACKEND_URL}/category`)
      .then((res) => setCategories(res.data))
      .catch((err) => {
        console.error(err);
      });
  }, []);

  const handleSubmit = (e) => {
    e.preventDefault();
    if (!content || !categoryId) {
      swal({
        title: "Error!",
        text: "Merci de spécifier la categorie et de publier un post",
        icon: "error",
        confirmButtonText: "parfait",
      });
    } else {
      axios
        .post(
          `${import.meta.env.VITE_BACKEND_URL}/post/posttext`,
          { content, categoryId },
          { withCredentials: true }
        )

        .then(() => navigate("/home", { replace: true }))
        .catch((err) => {
          console.warn(err);
        });
    }
  };

  return (
    <div className="div-post-texte">
      <div className="title-post-category">
        <ButtonReturnGreen />
        <h1>À quelle catégorie</h1>
        <h1>appartient ce post?</h1>
      </div>
      <div className="form-post-text">
        <select
          className="option-category-post"
          name="category"
          id="share-select"
          value={categoryId}
          onChange={(e) => setCategoryId(e.target.value)}
        >
          <option value="0">--Choisir une catégorie--</option>
          {categories.map((category) => (
            <option key={category.id} value={category.id}>
              {category.name}
            </option>
          ))}
        </select>
      </div>
      <div className="bloc-texte-post">
        <h1 className="title-post-message"> Écrit ton message ici :</h1>
        <form className="form-post">
          <label className="postform" htmlFor="post">
            <textarea
              className="inputformpost"
              type="content"
              name="content"
              id="content"
              placeholder="Partagez un message, une question, une expérience, un doute... avec la communauté! La sexualité n'est plus un tabou! Ta publication est anonyme."
              value={content}
              onChange={(e) => setContent(e.target.value)}
            />
          </label>
        </form>
      </div>
      <div className="button-publier-post">
        <ButtonPublierPost handleSubmit={handleSubmit} />
      </div>
    </div>
  );
}
export default PostText;

Answer 1

而不是

const user = jwt.verify(accessToken, process.env.JWT_AUTH_SECRET);

试试这个：

const user = await promisify(jwt.verify)(accessToken, process.env.JWT_AUTH_SECRET);