영상주소: https://www.youtube.com/watch?v=K0luq5uMDmo
소스주소: https://github.com/GoToTheMetaverse/klay-tutorial-v2/tree/main 의 klaytn-07-6폴더입니다.

참고자료

서명방법 코드: https://forum.klaytn.foundation/t/kaikas-sign-list/2395
cdnjs 의 caver-js: https://forum.klaytn.foundation/t/cdnjs-caver-js-cdn/4873

카이카스와 caver-js 를 이용한 검증방법입니다.

유저에게 서명받는 코드 (카이카스 UI 가 뜹니다. 아래쪽에 그림있음)

        const caver = new Caver(window.klaytn);
        console.log("create caver");

        const sig = await caver.klay.sign(1, wallet_addr, "");
        console.log("sig", sig);

        const v = `0x` + sig.substring(2).substring(128, 130);
        const r = `0x` + sig.substring(2).substring(0, 64);
        const s = `0x` + sig.substring(2).substring(64, 128);
        const signature = [v, r, s];
        console.log("signature", signature);

서버에서 signature 받아서 검증하는 코드:

let sign_ret = await caver.validator.validateSignedMessage(
    //
    "",
    signature,
    wallet_addr
  );
  console.log("sign_ret", sign_ret);
  // sign_ret: true or false

카이카스 메시지 서명 UI

서명란에 메시지가 횡한데 글씨 넣을 방법 없는지 찾고 있습니다.

이 기능은 이벤트 모니터 라고도 부르고 이벤트 감시기 라고도 부릅니다.
영어로는 watch 나 monitor 라고 부르더군요.

영상주소: https://www.youtube.com/watch?v=HxGpjz9LCc8
소스코드: https://github.com/GoToTheMetaverse/klay-tutorial-v2/tree/main 의 klaytn-08-event-monitor 폴더입니다.

이벤트 모니터가 있어야 좀더 괜찮은 서비스를 만들수 있습니다.
스마트컨트렉트는 수정이 안되기 때문에 어려운 기능을 구현하다가 버그라도 생기면 리스크가 크기 때문에 적당히 쉬운 기능을 구현하고 이벤트를 이용해서 외부에서 어려운 기능을 구현하는 편이 수정이 용이 합니다.

디스코드봇과 연동했습니다. 디스코트로와서 구경해보세요

가위바위보 게임 페이지: https://klaytngame-1.gunillee.repl.co/
디스코드 초대링크: https://discord.gg/7REtkPHHJX

결과 스샷:

추후 개발 예정:
1. 전적관리
2. 웹페이지에 실시간 내역 추가
3. 차트나 그래프 추가

의견있으시면 디스코드로와서 이야기해주세요