下記の手順でCandid UIを表示できます。
# Candid UI canisterのidを取得 dfx canister id __Candid_UI # 例: r7inp-6aaaa-aaaaa-aaabq-cai # Candid UI canister idをURLに埋め込んでブラウザアクセス # http://127.0.0.1:8000/?canisterId=<CANDID-UI-CANISTER-IDENTIFIER> # 例: http://127.0.0.1:8000/?canisterId=r7inp-6aaaa-aaaaa-aaabq-cai # さらにCandid UIからcallしたいcanister idをURLに埋め込んでおけばすぐに使える dfx canister id my_candid # rrkah-fqaaa-aaaaa-aaaaq-cai http://127.0.0.1:8000/?canisterId=r7inp-6aaaa-aaaaa-aaabq-cai&id=rrkah-fqaaa-aaaaa-aaaaq-cai
はじめに
こんにちは@bioerrorlogです。
Candid UIを使うと、手軽にcanisterの関数をcallすることができます。
dfx canister callコマンドを使ってももちろんcanisterを叩くことが出来ますが、手軽にGUIでぽちっとcallできるのは嬉しい機能です。
自分はCandid UIの使い方をよく忘れてググり直しているので、今回はそのCandid UIの使い方を備忘録として書いておきます。
Candid UIを利用する
使い方
まず、Candid UI canisterのidを取得します。
# Candid UI canisterのidを取得 dfx canister id __Candid_UI # 例: r7inp-6aaaa-aaaaa-aaabq-cai
取得したidを下記のようにURLに埋め込むと、ブラウザからcanister選択画面にアクセスできます。
# Candid UI canister idをURLに埋め込んでブラウザアクセス http://127.0.0.1:8000/?canisterId=<CANDID-UI-CANISTER-IDENTIFIER> # 例: http://127.0.0.1:8000/?canisterId=r7inp-6aaaa-aaaaa-aaabq-cai
この画面でcall対象のcanister idを入力すれば、canister関数のcall画面に遷移します。
あるいは、はじめからcall対象のcanister idをURLに埋め込んでおけば、すぐcanister関数のcall画面を使うことができます。
# callしたいcanister idを取得 dfx canister id my_candid # rrkah-fqaaa-aaaaa-aaaaq-cai # canister idをURLに埋め込む http://127.0.0.1:8000/?canisterId=<CANDID-UI-CANISTER-IDENTIFIER>&id=<call対象のcanister id> # 例 http://127.0.0.1:8000/?canisterId=r7inp-6aaaa-aaaaa-aaabq-cai&id=rrkah-fqaaa-aaaaa-aaaaq-cai
ちなみに、ローカル開発の場合はcanister idが大抵同じ値です。
- Candid UI:
r7inp-6aaaa-aaaaa-aaabq-cai - バックエンドCanister:
rrkah-fqaaa-aaaaa-aaaaq-cai
なので、下記のURLをブックマークしておけばCandid UIをすぐに利用できるのでオススメです。
http://127.0.0.1:8000/?canisterId=r7inp-6aaaa-aaaaa-aaabq-cai&id=rrkah-fqaaa-aaaaa-aaaaq-cai
余談１: Asset canisterのcandid
ちなみにみなさん、フロント側のcanister(asset canister)のcandidを眺めたことはありますか？
実はこのasset canister、デフォルトで面白いcandidインターフェースが実装されています。
Asset canisterのcandidをCandid UIで確認するには、本記事で書いた通りの手順に従えばOKです。
# Candid UI canisterのidを取得 dfx canister id __Candid_UI # r7inp-6aaaa-aaaaa-aaabq-cai # Asset canisterのidを取得 dfx canister id my_canister_assets # r7inp-6aaaa-aaaaa-aaabq-cai # 下記URLにアクセス http://127.0.0.1:8000/?canisterId=r7inp-6aaaa-aaaaa-aaabq-cai&id=ryjl3-tyaaa-aaaaa-aaaba-cai
Asset canisterのcandidについて深堀するとこの記事のスコープを超えてしまうので割愛しますが、気が向いたら別記事にでもまとめようと思います。
余談２: そのうちもっと分かりやすくなる
お、これは地味に便利になる.
— BioErrorLog (@bioerrorlog) March 16, 2022
dfx deploy時にCandid UIとフロントのURLが表示されるように
feat: dfx deploy shows frontend and candid urls #2078https://t.co/YYxOzwHuuk
↑のツイートの通り、近い将来的dfx deploy時に該当のCandid UI URLが表示されるようになります。
今後は少し便利になりますね。
おわりに
今回は、ローカル開発でCandid UIを利用する方法をまとめました。
Internet Computerでは、Candidという独自規格でcanisterのインターフェースを定義します。 Candid UIは、それに慣れ親しむための有効なツールだと思います。
ぜひ使い慣れていきたいところです。
[関連記事]
参考
GitHub - dfinity/candid: Candid Library for the Internet Computer
