Blockchain code Metaverse VR

Crypto×VR×SmartContract(489)

スポンサーリンク

//tips

//smart contract

昨日教えてもらったReact Twitter Embed Componentでの表示を確認していく。

まずはnpm install --save react-twitter-embedを導入。

下記を変更していく方法で考える。

{statuses && (
<ul>
{ statuses.map(({ key, text, user }) => {
return (
<li key={key}>
<p>{ text }</p>
<p>By { user.name } ({ user.screen_name })</p>
</li>
);
})}
</ul>
)}

下記で埋め込みを考えたが、うまく表示されない。

{statuses && (
<ul>
{ statuses.map(({ key, id,text }) => {
return (
<li key={key}>
<TwitterTweetEmbed
tweetId={id}
/>
</li>
);

ネットワークエラーのよう。

Request URL: https://cdn.syndication.twimg.com/tweet?features=tfw_experiments_cookie_expiration%3A1209600%3Btfw_horizon_tweet_embed_9555%3Ahte%3Btfw_space_card%3Aoff&id=1497782647359082500&lang=en

Request Method: GET

Status Code: 404

Remote Address:

Referrer Policy: strict-origin-when-cross-origin

自分のTwitter idにしたら表示ができた。直接数字を打ち込むと表示は引っ張れるよう。

<TwitterTweetEmbed
tweetId={'1497597299161448449'}
/>

Idという変数を使うといけないようなので、すでにテキストに変換されているid_strを用いたら無事に成功。リスト表示にしなくてもTwitterの形で表示されるのでul,liは削除した。

{statuses && (
<>
{ statuses.map(({ key, id_str,text }) => {
return (

<TwitterTweetEmbed
tweetId={id_str}
/>

);
})}
</>
)}

debankのapiについても確認。

https://docs.open.debank.com/en/reference/api-reference/user

こちらを参照して、curlでの取得のコマンドがあったのでコンバーターでnode.jsのfetch使用に変換。

https://curlconverter.com/#node-fetch

var fetch = require('node-fetch');

fetch('https://openapi.debank.com/v1/user/simple_protocol_list?id=0x5853ed4f26a3fcea565b3fbc698bb19cdf6deb85&chain_id=eth', {
headers: {
'accept': 'application/json'
}
});

こちらで組み込んで取得を行なっていく。まずはボタンでイベントを発生させ、コンソールログで確認。idのみdebankに表示されている自身のものに入れ替えている。

async function handleOnDebankSubmit(e) {
e.preventDefault();

const results = await fetch('https://openapi.debank.com/v1/user/simple_protocol_list?id=0xa242fcb2acbb118ea1b6829efe8b7e2087b43986&chain_id=eth', {
headers: {
'accept': 'application/json'
}
});

var results = await res.json();
console.log(results);

//setStatuses(results.data);
}

このようにしたらethチェーン上のtokenのバランスは取得することができた。

全部のtokenバランスを表示させるようにしたいので、Get user token listを試してみる。

こちらで取得できたのはwallet内にあるtokenのみで先に取得したチェーン上にあるものは取得できていない。また、別チェーンのものを同じく取得できていない。

最後にtotal_balanceで提供されているapiを実行。

Tokenのbalanceが取る変換で表されてしまうが、無事に意図した形で取得することができた。

つまり、user idを変数にしてtotal_balanceのid部分に組み込める形にしといてあげればよさそう。後は取得したものをmapでぐりぐり回してreturnさせれば良い。

だいぶapi接続についてわかってきたかも。

人気の記事

1

コロナによる需要変化 コロナパンデミックの影響で、人々は外に出られなくなり、自宅で過ごす時間が増えました。 この自粛ムードの中、下記のようなビジネスの需要変化が引き起こされています。 【利用者減少】 ...

2

米国レストランの決済時に毎日お世話になっていた「Square」のビジネスモデルについて本日はふれていきたいと思います。 「Square」とは、ネットにつながったモバイル端末と専用のカードリーダーを用意 ...

3

無料でネットショップを開けるアプリとして多くの人に驚きを与えたBASE株式会社が、2019年10月25日東証マザーズに上場しました。2020年2月時点で90万店を超えるショップを抱えるまでに成長してい ...

4

2011年にサービスを開始してから圧倒的な成長率を誇るインテリア通販サイト 【FLYMEe/フライミー】を皆さんご存じでしょうか。 「自分のイメージするインテリア、本当に欲しいインテリアがどこにあるの ...

5

ナイキのSNKRSが、なぜこれほどまでに人気なのか?調べてみました。 きっかけは米国での友達との会話。彼は自分のシューズをみせて、「これ20万円もしたんだぜ。」と語ってくれました。 あまり靴に興味がな ...

-Blockchain, code, Metaverse, VR
-, ,

Copyright© BUSINESS HACKER , 2022 All Rights Reserved Powered by AFFINGER5.