Блог

Я создаю веб-приложение, используя react и ethers.js это работает с метамаской. Если я позвоню своему контракту.myFunc(xyz, функция(ошибка, результат){ }); пользователь увидит всплывающее окно метамаски. Мой код получит ответ, только если пользователь нажмет «ОТПРАВИТЬ» или «ОТКЛОНИТЬ». Но если пользователь обновит страницу, не нажимая ни «ОТПРАВИТЬ», ни «ОТКЛОНИТЬ», мой код никогда не узнает статус этой транзакции, хотя пользователь все еще может отправить эту транзакцию.

Первая часть моего кода отправляет транзакцию, а вторая часть отправляет информацию в мой api. Моя проблема заключается в том, что часть кода транзакции создает всплывающее окно метамаски для пользователя, чтобы подтвердить и подписать транзакцию. Если пользователь продолжит транзакцию, как ожидалось, мой код будет работать без проблем. Однако, если пользователь обновит страницу или иным образом сбросит состояние моего компонента после создания всплывающего окна metamask и до того, как они подтвердят его, а затем подтвердят его после перезагрузки страницы, я не смогу опубликовать данные в своем api, и мое приложение сломается. Что я могу сделать, чтобы остановить это? Есть ли способ отклонить транзакции при перезагрузке страницы или проверить, есть ли неподписанные транзакции в metamask?

     try {
      const price = await connectedContract.getMintPrice();
      const transaction = await connectedContract.primeMint({
        value: price,
      });
      const receipt = await transaction.wait();
      blockNumber = receipt.blockNumber;
    } catch (err) {
      console.error(err);
      setState({ ...state, button: false });
    }
    axios
      .post("http://localhost:5000/api/mints", {
        _id: _address,
        blockNumber: blockNumber,
      })
      .then(() => {
        setState({
          status: "Loading",
          blockNumber: blockNumber,
          button: false,
        });
      })
      .catch((err) => {
        console.error(err);
        setState({ ...state, button: false });
      });