흐름에 구축 | FCL 배우기 - 8. ID로 거래 조회하는 방법

개요



이 짧은 가이드에서는 다음 방법을 배웁니다.
  • 트랜잭션 ID로 트랜잭션 데이터 쿼리
  • 수집된 데이터 처리 및 분석

  • 짧지만 본론으로 바로! 😀

    왜요?



    거래가 체인에 제출된 후 해당하는 id 를 얻게 되며, 누구나 해당 특정 거래의 거래 데이터를 쿼리하는 데 사용할 수 있습니다. 예를 들어, 일부 토큰을 다른 계정으로 전송하는 경우 귀하 측에서 작업을 완료했다는 증거로 트랜잭션 ID를 제공할 수도 있으며 이제 수신자는 해당 트랜잭션을 사용하여 상태 업데이트를 확인할 수 있습니다.

    어떻게?



    FCL은 트랜잭션 상태 업데이트(폴링을 통해)를 구독할 수 있는 기능[tx](https://docs.onflow.org/fcl/reference/api/#tx)을 제공하지만 트랜잭션 상태가 sealed인 경우 후속적으로 최종 결과도 반환합니다. tx 함수는 객체를 반환하고 필드 중 하나는 .onceSealed() 메서드입니다. 이 메서드를 호출하면 지정된 ID를 가진 트랜잭션의 상태가 5 - 봉인된 경우 확인되는 Promise를 반환합니다.

    다시 봉인? 🤔



    블록과 마찬가지로 트랜잭션도 다릅니다statuses.
  • 1 - 보류 중 - finalization에 대한 트랜잭션 대기
  • 2 - 완료됨 - 트랜잭션 대기 중execution
  • 3- 실행됨 - 트랜잭션 대기sealing
  • 4 - 봉인됨 - 트랜잭션은 sealed이며 완전하고 되돌릴 수 없는 것으로 볼 수 있음
  • 5 - 만료됨 - 트랜잭션이 만료됨

  • You’ve read that right, transaction can expire! When transaction is created, it’s “anchored” to the latest available block and need to be sealed within 600 blocks range (or around 10 minutes of human perceived time 👨‍🏫)



    이제 실전에서 해봅시다! 💪

    1단계 - 설치



    종속 항목으로 "@onflow/fcl": "1.0.0" 추가

    2단계 - 설정



    지난 번과 마찬가지로 필요한 메서드를 가져오고 FCL을 설정합니다.

    // Import methods from FCL
    import { tx, config } from "@onflow/fcl";
    
    // Specify the API endpoint - this time we will use Mainnet
    const api = "https://rest-mainnet.onflow.org";
    
    // Configure FCL to use mainnet as the access node
    config().put("accessNode.api", api);
    


    드디어



    항상 그렇듯이 자동 실행을 위해 코드를 IIFE 블록으로 래핑합니다.

    // We will use IIFE to execute our code right away
    (async () => {
      console.clear();
    
        // This is just a random transaction id we've got from Flowscan live feed
        const id = "2297668a3f35d6c6b4a18bb9c5ea8d3e60ce7e4a4e0fe31ad5a9c623d002b9d7";
    
      const txResult = await tx(id).onceSealed();
      console.log({ txResult });
    }
    


    실행 후 콘솔에 다음과 같은 출력이 있어야 합니다.

    txResult: {
        blockId: "f21eb65a65cd8f2f26a340265c24497ee2ca130862e4c7e9d6f1e6d6680a2fe6",
        status: 4,
        statusString: "SEALED",
        statusCode: 0,
        errorMessage: "",
        events: Array(7),
    }
    


    각 이벤트는 객체 형식입니다.

    {
        type: "A.2d4c3caffbeab845.FLOAT.FLOATMinted",
        transactionId: "2297668a3f35d6c6b4a18bb9c5ea8d3e60ce7e4a4e0fe31ad5a9c623d002b9d7",
        transactionIndex: 4,
        eventIndex: 0,
        data: Object,
    }
    


    다른 이벤트의 이벤트 유형 이름을 살펴보면 다음과 같은 패턴을 명확하게 볼 수 있습니다.
  • A - 계정
  • 을 나타냅니다.
  • 2d4c3caffbeab845 - 계약 개최 이벤트 선언이 전개되는 주소입니다
  • FLOAT - 계약서 이름
  • FLOATMinted - 이벤트 이름

  • 링크를 생성하고 이를 탐색할 수 있습니다contract on Flow View Source. Line 53FLOATMinted 이벤트의 정의를 갖습니다.

    문서 사이트의 FCL "빠른 참조"에는 트랜잭션 및 이벤트에 대한 자세한 정보가 있습니다.
  • 거래 결과 - https://docs.onflow.org/fcl/reference/api/#returns-after-decoding-7
  • 이벤트 데이터 - https://docs.onflow.org/fcl/reference/api/#event-object

  • 거래를 탐색하는 다른 방법



    계정과 유사한 방식으로 지난 시간에 다루었듯이 FlowScan 및 Flow View Source에서 트랜잭션 데이터를 탐색할 수 있습니다.

  • Flow View Source - https://flow-view-source.com/mainnet/tx/2297668a3f35d6c6b4a18bb9c5ea8d3e60ce7e4a4e0fe31ad5a9c623d002b9d7 - FCL의 OG - James Hunter - https://github.com/orodio의 커뮤니티 프로젝트입니다.

  • FlowScan -https://flowscan.org/transaction/2297668a3f35d6c6b4a18bb9c5ea8d3e60ce7e4a4e0fe31ad5a9c623d002b9d7 - 계정 정보와 달리 Flowscan의 트랜잭션은 Flow View Source와 동일한 데이터를 가짐

  • 다음 시간까지 👋

    자원



  • 전체 소스 코드 - https://codesandbox.io/s/dev-to-fcl-08-fetch-transaction-by-id-44kccc?file=/src/index.js

  • 문서 - tx 함수 - https://docs.onflow.org/fcl/reference/api/#tx

  • 문서 - transaction status 응답 - https://docs.onflow.org/fcl/reference/api/#returns-after-decoding-7

  • 문서 - event 데이터 - https://docs.onflow.org/fcl/reference/api/#event-object

  • 유용할 수 있는 기타 리소스:

  • Flow Docs 사이트 - https://docs.onflow.org/ - Flow 블록체인 및 상호 작용 방법에 대한 자세한 정보

  • Flow Portal - https://flow.com/ - Flow 진입점

  • FCL JS - https://github.com/onflow/fcl-js - 소스 코드 및 FCL JS 라이브러리에 기여하는 기능

  • 케이던스 - https://docs.onflow.org/cadence/ - 케이던스 소개

  • Codesandbox - https://codesandbox.io - 빠른 프로토타이핑을 지원하는 놀라운 브라우저 내 IDE
  • 좋은 웹페이지 즐겨찾기