Как мы можем перейти на страницу ошибок, если сервер отправит сообщение 404 на странице с крючками реакции

#reactjs #react-hooks

Вопрос:

Как мы можем нажать /errorPage , если сервер отправит сообщение 404 на странице «Реагирующие крючки». Я проверяю, действителен ли токен на стороне сервера, и в состоянии else отправляю 404 сообщение, в этом случае я хотел бы отобразить страницу ошибок. Это хороший подход, пожалуйста, посоветуйте !

/* Эта услуга используется для подачи заявки */ server.js

 app.post('/service/nominateperson', async (req, res) => {
  try {
    const nomineeName = req.body.nomineename;
    const nomineeEmail = req.body.email;
    const description = req.body.description;
    const nominatedBy = req.body.nominatedby;
    var data = {nomineename:nomineeName, email:nomineeEmail, description:description, nominatedby:nominatedBy};
    console.log("Server side display nominations :"   data);
    const checkTokenData = await LinkTokenModel.findAll({ attributes: ['token','expiredAt']});
    const expiryDate = checkTokenData[0].expiredAt;
    const formattedExpiryDate = moment(expiryDate).format('YYYY-MM-DD hh:mm');
    const tokenData = checkTokenData[0].token;
    var now = moment();
    var currentDate = moment(now).format('YYYY-MM-DD hh:mm');
    if(currentDate < formattedExpiryDate ){
      const nominationData = await NominationModel.create(data);
      res.status(200).json({message: "Nomination send successfully !"});
    } else {
      res.status(404).json({ fail:true});
    }
  } catch (e) {
    res.status(500).json({ fail: e.message });
  }
});
 

nominate.js

 import { useHistory } from 'react-router-dom';
 const history = useHistory();

    const onSubmit = () => {
        const fetchData = async () => {
            try {
                const res = await Axios.post('http://localhost:8000/service/nominateperson', formRegister);
                if (res.data) {
                    console.log("Link token created:"   res.data);
                    const successMessage = res.data.message;
                    setHelperText(successMessage);
                } else {
                    history.push('/errorPage');
                }
            } catch (e) {
                console.log(e);
            }
        }
        fetchData();
    }
 

Ответ №1:

Внутри catch(e) части кода используйте что-то вроде history.push('404') перенаправления браузера.

Если для маршрута есть страница, она будет показана

Комментарии:

1. Ценю вашу помощь, это работает. Могу я спросить, можем ли мы привести это в другое состояние на стороне клиента ? возможно ли это ?

2. @soccerway Конечно, я в первую очередь имел в виду клиентскую сторону. Что, похоже, относится к nominate.js вашему случаю