//tips
//smart contract
まずはstatuses/home_timelineで試す。
const results = await client.get("statuses/home_timeline");
console.log(JSON.stringify(results, null, 2));
これを行うとターミナルの方でしっかりTwitterの内容が取得できていることがわかった。
ただ、returnされた内容がindex.jsにうまく取り込めていない。
stringifyメソッドは三つの引数を取っているのでメモ。
第二引数の目的は、第一引数で指定したオブジェクトの置き換え。フィルタリングできる。nullが渡された場合にはデフォルトの動作になる。
JSON.stringify({ x: 5, y: 6, z: 7 }, ['x', 'z'])
// '{"x":5,"z":7}'
第三引数では、出力フォーマットにおけるインデントの部分を操作することができ、2とすると2つ分のスペースが出力される。
results.statusesの方でどのような結果になるかを確認。
console.log('results');
console.log(JSON.stringify(results.statuses, null, 2));
こうするとundefinedが返ってくる。
そもそものresults.statusesとはreturnするjsonオブジェクトの中にresultsの中のstatusesをdataとして返すと思っていたがそれが間違っているのかも。
return res.status(200).json({
status: 'Ok',
data: results.statuses
});
一旦参考にしたsearch.jsの方でconsole.log(results.statuses);を確認。
//console.log('results');
//console.log(results.statuses);
でしっかりtweetの中身を取得できていたので、これはstatuses/home_timelineなどによって返ってくる形が変わるためだと認識。search/tweetsのドキュメントと見比べ。home_timelineの方は"statuses”のような大きな括りがないことが確認できた。returnするものをresultsそのものに変更。
https://developer.twitter.com/en/docs/twitter-api/v1/tweets/search/api-reference/get-search-tweets
https://developer.twitter.com/en/docs/twitter-api/v1/tweets/timelines/api-reference/get-statuses-home_timeline
ついに成功。これでボタンを押すことでツイート内容を自動取得することができるようになった。
この後はボタンではなく、セッションがあれば表示を行うようにする。また表示の仕方も綺麗にしていきたい。
if (session) {
handleOnStreamSubmit();
とreturnの前にイベント関数をおけば、ボタンクリックなしで表示ができるか確認。
これで表示はできるが頻繁な更新状態となり、最終的にはエラーで表示されなくなってしまう。
これは一度だけ使うuseeffectで対応できるのではないか検証する。
async function handleOnStreamSubmitb() {
const results = await fetch('/api/twitter/stream', {
//credentials: 'include'
}).then(res => res.json());
//console.log(results);
console.log('hib');
setStatuses(results.data);
}
useEffect(() => {
if (session) {
handleOnStreamSubmitb();
}
},[])
useEffectの第2引数を空([])にすると、初回のみ(クライアントでアプリがマウントされたとき)のみ実行されるので、こちらで実行が成功した。素晴らしい。
参考:
https://zenn.dev/catnose99/articles/2169dae14b58b6
これをカードの中に入れるところまでやりたいところだが、この流れで、他のapiの取得まで考える。
-medium api
https://stackoverflow.com/questions/36097527/how-to-retrieve-medium-stories-for-a-user-from-the-api
https://levelup.gitconnected.com/interacting-with-medium-using-an-api-524c41b2fd74
https://www.youtube.com/watch?v=I2dcpatq54o&ab_channel=SonnySangha
-debank api
https://docs.open.debank.com/en/
https://docs.open.debank.com/en/reference/api-reference/user
-単純なブログページURL情報のカード化