Frontend Interacting with Multiple Contracts

이 예제는 하나의 프론트엔드에서 여러 컨트랙트와 상호 작용하는 방법을 보여줍니다.

특히 이 예에서는 다음을 수행하는 메서드를 보여줍니다.

1. 여러 컨트랙트에서 데이터 쿼리
2. 여러 컨트랙트 메서드를 동시에 호출

---

여러 컨트랙트에서 데이터 쿼리

여러 컨트랙트를 쿼리하려면 간단히 여러 개의 view 호출을 수행하세요.

frontend/index.js

loading...

See full example on GitHub

---

여러 트랜잭션 전송

wallet 객체를 사용하면 여러 트랜잭션을 동시에 전송할 수 있습니다. 그러나 트랜잭션은 독립적으로 실행됩니다.

한 번에 여러 트랜잭션을 전달하는 것은 사용자가 지갑과 한 번만 상호 작용하기 때문에, UX를 개선하는 좋은 방법입니다.

frontend/index.js

loading...

See full example on GitHub

이 예에서 사용자는 두 개의 독립적인 트랜잭션에 서명합니다.

1. A transaction to call set_greeting in our Hello NEAR example
2. A transaction to call add_message in our GuestBook example

주의

사용자가 트랜잭션 서명을 동시에 수락하더라도 트랜잭션은 독립적으로 유지됩니다. 즉, 하나가 실패하더라도 다른 하나는 롤백 되지 않습니다.

---

일괄 Action

You can aggregate multiple actions directed towards a same contract into a single transaction. 일괄 Action은 순차적으로 실행되며, 하나가 실패 하면 모두 되돌려진다는 추가 이점이 있습니다.

  // Register a user and transfer them FT on a single take
  const REGISTER_DEPOSIT = "1250000000000000000000";

  const ftTx = {
    receiverId: FT_ADDRESS,
    actions: [
      {
        type: 'FunctionCall',
        params: {
          methodName: 'storage_deposit',
          args: { account_id: "<receiver-account>" },
          gas: THIRTY_TGAS, deposit: REGISTER_DEPOSIT
        }
      },
      {
        type: 'FunctionCall',
        params: {
          methodName: 'ft_transfer',
          args: { receiver_id: "<receiver-account>", amount: amount_in_yocto },
          gas: THIRTY_TGAS, deposit: 1 }
      }
    ]
  }

  // Ask the wallet to sign and send the transaction
  await wallet.signAndSendTransactions({ transactions: [ ftTx ] })