Как мне устранить эту ошибку 422 во время POST? - PullRequest
0 голосов
/ 29 мая 2020

Я пытаюсь следовать коду на Udemy, за исключением того, что делаю свою версию проекта. После использования bcrypt и jwt я не могу публиковать сообщения в своем приложении. Я могу войти в систему нормально, но при попытке опубликовать что-то выдает ошибку 422.

Вот что меня застревает.

  const twottSubmitHandler = async (event) => {
    event.preventDefault();

    try {
      const formData = new FormData();
      formData.append("title", formState.inputs.title.value);
      formData.append("description", formState.inputs.description.value);
      formData.append("creator", auth.userId);
      await sendRequest("http://localhost:3001/api/twotts", "POST", formData, {
        Authorization: "Bearer " + auth.token,
      });
      history.push("/");
    } catch (err) {}
  };

Это то, что вызывает ошибку в контроллере twotts,

  const errors = validationResult(req);
  if (!errors.isEmpty()) {
    return next(new HttpError("Invalid input passed", 422));
  }
  const { title, description, creator } = req.body;
  const createdTwott = new Twott({
    title,
    description,
    creator,
  });

Есть ли способ сделать так, чтобы она добавлялась с использованием JSON .stringify вместо используя FormData? Используя

    try {
      await sendRequest(
        "http://localhost:3001/api/twotts",
        "POST",
        JSON.stringify({
          title: formState.inputs.title.value,
          description: formState.inputs.description.value,
          creator: auth.userId,
        }),
        { Authorization: "Bearer " + auth.token },
        { "Content-Type": "application/json" }
      );
      history.push("/");
    } catch (err) {}

, я все равно получаю неверные данные. Если я помещу аргумент авторизации в другое место, у меня возникнут проблемы с аутентификацией.

ссылка на репо: https://github.com/preintercede/Twotter (с коммитами) на случай, если есть часть, которую я пропустил.

1 Ответ

1 голос
/ 29 мая 2020

Вы создаете FormData и отправляете его (неявно) с Content-Type: multipart/form-data. express-validator не проверяет такие данные из коробки (аргумент: https://github.com/express-validator/express-validator/issues/276)

Одним из решений было бы использовать https://github.com/expressjs/multer, но я рекомендую просто отправить JSON данные с правильным Content-Type, как вы уже делаете для других запросов:

─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
 modified: src/twotts/pages/NewTwott.js
 ─────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────────
 @ src/twotts/pages/NewTwott.js:39 @ const NewTwott = () => {
      event.preventDefault();

      try {
 -      const formData = new FormData();
 -      formData.append("title", formState.inputs.title.value);
 -      formData.append("description", formState.inputs.description.value);
 -      formData.append("creator", auth.userId);
 -      await sendRequest("http://localhost:3001/api/twotts", "POST", formData, {
 +      await sendRequest("http://localhost:3001/api/twotts", "POST", JSON.stringify({
 +        title: formState.inputs.title.value,
 +        description: formState.inputs.description.value,
 +        creator: auth.userId
 +      }), {
          Authorization: "Bearer " + auth.token,
 +        "Content-Type": "application/json",
        });
        history.push("/");
      } catch (err) {}

Я рекомендую обернуть это во вспомогательную функцию. Это также может установить токен-носитель в заголовки запроса, если они есть.

...