Twitter API - 过滤掉@、# 和其他链接

Question

我正在使用 Twitter API 为我的应用获取前 5 条推文。我需要以不同的方式突出显示或链接部分推文。例如，# 将是橙色，@ 将是红色且可点击，等等...

从他们的 API 中，他们提供 user_timeline 端点：

https://dev.twitter.com/rest/reference/get/statuses/user_timeline

但是tweets 对象的文本返回时嵌入了那些特殊字符。我看不到从对象中提取那些@, # and href 的选项：

推文对象：

{ 
   ...
   text: "This is some text @tagName that I'd like to #parse here https://t.co/m9Addr4IlS",
   ...   
}

虽然我可以编写自己的字符串解析器来查找这些内容，但 Twitter API 是否提供了一些东西来处理这些内容？

---

编辑：<tweets> 是一个 Angular 指令，ng-repeats 覆盖我来自 ModulesService 的推文。 replace 似乎没有附加 DOM 标签

            scope.getTweets = function() {
                ModulesService.getTweets().success(function(res) {
                    if (res && Array.isArray(res)) {
                        scope.tweets = parseTweets(res);
                    }
                });
            };

            scope.getTweets();

            var parseTweets = function (tweets) {

                tweets.forEach(function (tweet) {

                    tweet.text.replace(/(@[^ ]+)/g, '<a class="user">$1</a>').
                        replace(/(#[^ ]+)/g, '<span class="hash">$1</span>').
                        replace(/(https?:\/\/[^ ]+)/g, '<a href="$1">$1</a>');

                    console.log('tweet!', tweet.text); //does not contain altered HTML
                });

                return tweets;
            };

HTML：

<div ng-repeat="tweet in tweets" class="post-body clearfix">
    {{tweet.text}}
</div>

Answer 1

试试：

var text = "This is some text @tagName that I'd like to #parse here https://t.co/m9Addr4IlS";
var div = document.getElementsByTagName('div')[0];
div.innerHTML = text.replace(/(@[^ ]+)/g, '<a class="user">$1</a>').
                     replace(/(#[^ ]+)/g, '<span class="hash">$1</span>').
                     replace(/(https?:\/\/[^ ]+)/g, '<a href="$1">$1</a>');

.hash { color: orange; }
.user { color: red; }

<div></div>

Answer 2

推荐解决方案

图书馆twitter-text 为您完成这项工作。

根据他们的例子：

自动链接

var twitter = require('twitter-text')
twitter.autoLink(twitter.htmlEscape('#hello < @world >'))

提取实体

var usernames = twttr.txt.extractMentions("Mentioning @twitter and @jack")
// usernames == ["twitter", "jack"]

使用该解决方案将使您免于重新发明轮子，并为您提供稳定的工作代码:)

另类

在您从user_timeline API 端点接收的推文对象中，entities 属性存储推文中包含的urls、hashtags 和mentions 的列表。这些包含文本内容以及每个实体的位置（开始/结束字符索引）。

主题标签实体示例：

"entities": {
  "hashtags": [
    "text": "pleaseRT"
    "indices": [
      6,
      13
    ]
  ]

cf Entities documentation 了解更多信息。

Answer 3

遍历返回的推文并根据某些条件修改推文文本：

returnValues.forEach(function (tweet) {
    if (tweet.text.search(/#|@/ig) > -1) {
        var words = obj.text.split(' ');

        var parsedTweetText = words.map(function (word) {
            if (word.indexOf('#') === 0)
                return '<span class="hashtag">' + word + '</span>';
            else if (word.indexOf('@') === 0)
                return '<span class="at-user">' + word + '</span>';
            else
                return word;
        }).join(' ');

        tweet.text = parsedTweetText;
    }
});