如何在网页上显示Twitter上的＃标签数量

Question

我试图找出在网页上显示特定主题标签的最佳方式。我认为这将是一项相当容易的任务，但我遇到了一些困惑。目标最终是在页面加载时显示计数。它不必是动态的，只需在页面加载时运行请求。

我有一个Twitter开发帐户，但我没有看到如何在文档中的任何地方获取哈希计数。

https://developer.twitter.com/en/docs

我也发现了这个：https://github.com/cstephen/hashtag-count正在做我想要的，但通过npm。我不知道如何将该对象从gulpfile转换为vanilla javascript以在html中显示它。此外，拥有它意味着我需要在服务器上设置一个跑步者。

到目前为止，我有这个：

gulp路径：

var hc = new HashtagCount({
  'consumer_key': '...',
  'consumer_secret': '...',
  'access_token': '...',
  'access_token_secret': '...'
});

// Array of hashtags to tally. Do not include # prefix.
var hashtags = ['superbowl', 'pizza', 'beer'];

// Hashtag tallies for each time interval will be added to the results object.
var interval = '30 seconds';

// Delete data older than this.
var history = '5 minutes';

// Called at the end of each time interval.
var intervalCb = function (err, results) {
  if (err) {
    console.error(err);
  } else {
    console.log(results);
  }
};

// Open a connection to Twitter's Streaming API and start capturing tweets!
hc.start({
  hashtags: hashtags,       // required
  interval: interval,       // required
  history: history,         // optional
  intervalCb: intervalCb,   // optional
});

如果我走这条路，

答：如何将此对象转换为javascript，以在html中显示整数？

B：我如何在服务器上设置它以逐步运行gulp任务？

我错过了一个更简单的解决方案吗？

更新

我的npm示例版本正常运行。我只需要从Gulp获取数据到html。

到目前为止我的HTML

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Hashtag Counter</title>
    <link rel="stylesheet" href="">
</head>
<body>
    <h1>Total Hashtag Count</h1>
    <p id="hashCount">Replace this string with the hashtag count</p>
</body>
</html>

Answer 1

如果你进一步阅读github页面，你会发现Result object

结果对象

无论结果对象是出现在intervalCb还是finishedCb回调中，结果对象都具有相同的结构。它采用以下形式，其中时间戳是UTC时间中的ISO字符串，表示每个间隔的开始：

{
  '2017-01-16T00:00:10.606Z': { 'superbowl': 6, 'pizza': 1, 'beer': 8 },
  '2017-01-16T00:01:10.610Z': { 'superbowl': 7, 'pizza': 1, 'beer': 4 },
  '2017-01-16T00:02:10.612Z': { 'superbowl': 3, 'pizza': 1, 'beer': 0 }
}

知道我们可以在结果部分中使用它

// Called at the end of each time interval.
var intervalCb = function (err, results) {
  if (err) {

    console.error(err);

  } else {

    console.log( results );

    showHashTagsCount( twitterResults );
  }
};

有了所有信息，这是一个示例函数：

const twitterResults = {
  '2017-01-16T00:00:10.606Z': { 'superbowl': 6, 'pizza': 1, 'beer': 8 },
  '2017-01-16T00:01:10.610Z': { 'superbowl': 7, 'pizza': 1, 'beer': 4 },
  '2017-01-16T00:02:10.612Z': { 'superbowl': 3, 'pizza': 1, 'beer': 0 }
};

function showHashTagsCount ( results )
{
  let totalTagsCount = 
    // Get the tags name and count from results
    Object.values( results ).map( hashTags => {
      
      // Get the tags count from hashTags and reduce to get the total
      return Object.values( hashTags ).reduce( ( acc, tagCount ) => acc + tagCount, 0 );
    
    // Reduce to get the total tags count
    }).reduce( ( acc, tagsCount ) => acc + tagsCount, 0 );
  
  // Show hash tags count
  document.getElementById( 'hashCount' ).textContent = totalTagsCount;
}

// Usage example
showHashTagsCount( twitterResults );

<h1>Total Hashtag Count</h1>
<p id="hashCount">Replace this string with the hashtag count</p>

如何在网页上显示Twitter上的＃标签数量

问题描述投票：0回答：1

1个回答

最新问题

如何在网页上显示Twitter上的＃标签数量

问题描述 投票：0回答：1

1个回答

最新问题

问题描述投票：0回答：1