The purpose of this tutorial is to a) demonstrate how to get a list of articles from the trending list on the blockchain, and b) fetch the contents of the selected post to display its title and body and c) fetch comments of the post and display them with author, body, created time and number of votes.
We will also explain the most commonly used fields from the response object as well as parse body of each comment.
Intro
Each post might have comments/replies that is interesting and contributes to the topic and discussion. Hive offers out of box API for pulling replies for particular post with get_content_replies. We will fetch replies and list them in simple user interface.
As mentioned in our previous tutorials we can fetch various lists of posts with different filters. Here, we are reusing some parts of that tutorial to list the top 5 trending posts. And we parse content of selected post to display few fields in a meaningful way.
2. Post comments
On selection of a particular post from the list, openPost function is fired as it is explained in Get Post Details tutorial. This function will call the get_content function to fetch content of the post. Right after root post is displayed properly, we use get_content_replies function to fetch comments made on that post, function requires author and permlink of the root post to fetch its comments.
We iterate each comment and format them properly in comments array. As mentioned in Get Post Details tutorial, we use remarkable library to parse the body of each comment into a readable format. Author, comment body, created time and number of votes on that comment is displayed with simple user interface.
The “go back” function simply hides and shows the post list.
3. Query result
The result is returned from the post content as a JSON object with the following properties:
[{"abs_rshares":0,"active":"2020-04-29T06:08:18","active_votes":[],"allow_curation_rewards":true,"allow_replies":true,"allow_votes":true,"author":"hiveio","author_reputation":"34879294456530","author_rewards":0,"beneficiaries":[],"body":"\n\n## Huobi has listed Hive! ...","body_length":0,"cashout_time":"1969-12-31T23:59:59","category":"hiveblockchain","children":26,"children_abs_rshares":0,"created":"2020-04-24T00:41:06","curator_payout_value":"0.000 HBD","depth":0,"id":85763874,"json_metadata":{"app":"peakd/2020.04.4","format":"markdown","description":"Hive is now listed on Huobi Global! This post contains all official links and AMA transcripts.","tags":["hiveblockchain","exchangenews","hiveama"],"users":["nateaguila","roelandp"],"links":["/trending/huobihive2020","/@nateaguila","https://twitter.com/HuobiGlobal/status/1253210569194090497","https://huobiglobal.zendesk.com/hc/en-us/articles/900000684263","https://huobiglobal.zendesk.com/hc/en-us/articles/900000687166--EXCLUSIVE-Deposit-HIVE-on-Huobi-Global-to-Share-100-000-HIVE-","https://twitter.com/HuobiGlobal/status/1252566140431130624","/@roelandp","/trending/notfinancialadvice","https://developers.hive.io/","https://hiveprojects.io/"],"image":["https://files.peakd.com/file/peakd-hive/hiveio/XsnzlWHl-social_hive_flare.jpg","https://files.peakd.com/file/peakd-hive/hiveio/9tEYm2I9-image.png","https://files.peakd.com/file/peakd-hive/hiveio/AXkoBSE3-image.png","https://files.peakd.com/file/peakd-hive/hiveio/djdRACpx-image.png"]},"last_payout":"2020-05-01T00:41:06","last_update":"2020-04-24T00:41:06","max_accepted_payout":"0.000 HBD","max_cashout_time":"1969-12-31T23:59:59","net_rshares":0,"net_votes":182,"parent_author":"","parent_permlink":"hiveblockchain","pending_payout_value":"0.000 HBD","percent_hbd":10000,"permlink":"huobi-global-official-hive-listing-announcement-giveaways-ama-chat-transcripts","promoted":"0.000 HBD","reblogged_by":[],"replies":[],"reward_weight":10000,"root_author":"hiveio","root_permlink":"huobi-global-official-hive-listing-announcement-giveaways-ama-chat-transcripts","root_title":"Huobi Global Official Hive Listing Announcement, Giveaways, and AMA Chat Transcripts","title":"Huobi Global Official Hive Listing Announcement, Giveaways, and AMA Chat Transcripts","total_payout_value":"0.000 HBD","total_pending_payout_value":"0.000 HBD","total_vote_weight":0,"url":"/hiveblockchain/@hiveio/huobi-global-official-hive-listing-announcement-giveaways-ama-chat-transcripts","vote_rshares":0}]
From this result, you have access to comments made on selected post.
JS: Get Post Comments
By the end of this tutorial you would know how to get comments made by others on any post.
Full, runnable src of Get Post Comments can be downloaded as part of: tutorials/javascript (or download just this tutorial: devportal-master-tutorials-javascript-07_get_post_comments.zip).
The purpose of this tutorial is to a) demonstrate how to get a list of articles from the trending list on the blockchain, and b) fetch the contents of the selected post to display its title and body and c) fetch comments of the post and display them with author, body, created time and number of votes.
We will also explain the most commonly used fields from the response object as well as parse body of each comment.
Intro
Each post might have comments/replies that is interesting and contributes to the topic and discussion. Hive offers out of box API for pulling replies for particular post with
get_content_replies. We will fetch replies and list them in simple user interface.Also see:
Steps
1. Fetching post
As mentioned in our previous tutorials we can fetch various lists of posts with different filters. Here, we are reusing some parts of that tutorial to list the top 5 trending posts. And we parse content of selected post to display few fields in a meaningful way.
2. Post comments
On selection of a particular post from the list,
openPostfunction is fired as it is explained in Get Post Details tutorial. This function will call theget_contentfunction to fetch content of the post. Right after root post is displayed properly, we useget_content_repliesfunction to fetch comments made on that post, function requires author and permlink of the root post to fetch its comments.We iterate each comment and format them properly in
commentsarray. As mentioned in Get Post Details tutorial, we useremarkablelibrary to parse the body of each comment into a readable format. Author, comment body, created time and number of votes on that comment is displayed with simple user interface.The “go back” function simply hides and shows the post list.
3. Query result
The result is returned from the post content as a
JSONobject with the following properties:From this result, you have access to comments made on selected post.
Try it
Click the play button below:
To Run the tutorial
git clone https://gitlab.syncad.com/hive/devportal.gitcd devportal/tutorials/javascript/07_get_post_commentsnpm inpm run dev-serverornpm run start