Entwerfen Sie Twitter-Widgets mit der neuesten Twitter-API

Twitter nimmt einige Änderungen vor, während es Version 1.1 seiner API einführt. Eine der bedeutendsten Änderungen ist die Einführung der Authentifizierung. Das heißt, die Anwendung muss authentifiziert werden, um Anfragen an die API senden zu können.

Die Authentifizierung erfolgt durch OAuth – ein offenes Protokoll, das eine sichere Autorisierung durch einfache und standardmäßige Methoden ermöglicht und die Benutzergenehmigung ermöglicht Beantragen Sie, in ihrem Namen zu handeln, ohne ihr Passwort preiszugeben.

In diesem Tutorial lernen wir, wie man programmgesteuert mit der Twitter-API interagiert und gleichzeitig ein Twitter-Timeline-WordPress-Widget entwickelt, das eine Liste der neuesten Tweets anzeigt, die von Twitter-Benutzern gepostet wurden.

Hier ist eine Vorschau des Twitter-Timeline-Widgets, das Sie am Ende dieses Tutorials erstellen werden.

Um erfolgreich eine Anfrage an die Twitter-API zu senden, müssen Sie eine erstellen Apps mit OAuth-Autorisierung, da nicht autorisierte Anfragen nicht abgelehnt werden erlauben.

Um eine Twitter-Anwendung zu erstellen, müssen Sie bei Twitter angemeldet sein Verwenden Sie das Entwickler-Dashboard für Ihr Twitter-Konto. Punkte zum Erstellen eines Die Anwendung gibt Ihnen (und Twitter) einfach einen Satz Schlüssel.

Dazu gehören:

• Verbraucherschlüssel
• Verbrauchergeheimnisse
• Zugriffstoken
• Zugriffstoken-Geheimnis

Folgen Sie den Schritten unten, um eine Twitter-Anwendung zu erstellen und einen Schlüssel zu generieren.

• Melden Sie sich mit Ihrem Twitter-Konto bei Ihrem Twitter-Entwicklerkonto an und navigieren Sie zur Anwendungsverwaltungskonsole.

• Klicken Sie auf die Schaltfläche Neue App erstellen, um mit der Erstellung der Twitter-App zu beginnen.
• Füllen Sie das Formular aus und klicken Sie auf die Schaltfläche „Senden“, um den Antrag zu erstellen.
• Klicken Sie auf die App, navigieren Sie zur Registerkarte Berechtigungen und ändern Sie die Zugriffsebene auf Lesen und Schreiben.

  Wenn Sie einen Vorgang ausführen möchten, um diese API korrekt zu verwenden, müssen Sie eine Änderung vornehmen Wenn Sie etwas anderes als das Folgende tun, stellen Sie Ihre Einstellungen auf „Lesen und Schreiben“ ein Standarddatenabruf mithilfe von GET-Anfragen.

  

Um den Verbraucherschlüssel und das Geheimnis der Anwendung zu erhalten, navigieren Sie zur Registerkarte

API-Schlüssel

. API-Schlüssel und API-Geheimnis sind jeweils Benutzerschlüssel und Benutzergeheimnis.

Um das Anwendungszugriffstoken und das Zugriffstokengeheimnis zu erhalten, scrollen Sie immer noch auf der Registerkarte „API-Schlüssel“ nach unten und klicken Sie auf die Schaltfläche „Meinen Zugriffstoken erstellen“, um ein Zugriffstoken zu erstellen.

strong>

Aktualisieren Sie die Seite und Sie sehen Ihr Anwendungszugriffstoken.

uns Halten Sie nun den Verbraucherschlüssel und das Geheimnis sowie das Zugriffstoken und den geheimen Schlüssel bereit. Diese OAuth-Anmeldeinformationen werden von Twitter authentifiziert, wenn Anfragen an die API gestellt werden.

Die Widget-Einstellungen für das Twitter-Timeline-Widget, das wir codieren, enthalten Formularfelder, die diese OAuth-Anmeldeinformationen sammeln und sie zur Wiederverwendung durch das Widget in der Datenbank speichern.

Beginnen wir mit der Codierung des Twitter Timeline-Widget-Plugins.

Twitter-Timeline-Widget-Entwicklung

Der Titel ist Das erste, was in eine Plugin-Datei eingefügt wird, ist der Plugin-Header.

<?php
/*
  Plugin Name: Twitter Tweets Widget
  Plugin URI: http://code.tutsplus.com
  Description: Displays latest tweets from Twitter.
  Author: Agbonghama Collins
  Author URI: http://tech4sky.com
 */

Erstellen Sie eine Klasse, die eine übergeordnete Klasse erweitert.

class Twitter_Tweets_Widget extends WP_Widget {
// ...

WP_Widget

Vergeben Sie dem Widget mit der

Magic-Methode einen Namen und eine Beschreibung.

function __construct() {
    parent::__construct(
        'twitter-tweets-widget',
        __( 'Twitter Tweets Widget', 'twitter_tweets_widget' ),
        array(
            'description' => __( 'Displays latest tweets from Twitter.', 'twitter_tweets_widget' )
        )
    );
}

__construct()Die

-Methode unten erstellt das Widget-Einstellungsformular, das die OAuth-Anmeldeinformationen zur späteren Wiederverwendung durch das Widget in der Datenbank speichert.

public function form( $instance ) {

    if ( empty( $instance ) ) {
        $twitter_username = '';
        $update_count = '';
        $oauth_access_token = '';
        $oauth_access_token_secret = '';
        $consumer_key = '';
        $consumer_secret = '';
        $title = '';
    } else {
        $twitter_username = $instance['twitter_username'];
        $update_count = isset( $instance['update_count'] ) ? $instance['update_count'] : 5;
        $oauth_access_token = $instance['oauth_access_token'];
        $oauth_access_token_secret = $instance['oauth_access_token_secret'];
        $consumer_key = $instance['consumer_key'];
        $consumer_secret = $instance['consumer_secret'];

        if ( isset( $instance['title'] ) ) {
            $title = $instance['title'];
        } else {
            $title = __( 'Twitter feed', 'twitter_tweets_widget' );
        }
    }
    
    ?>
    <p>
        <label for="<?php echo $this->get_field_id( 'title' ); ?>">
            <?php echo __( 'Title', 'twitter_tweets_widget' ) . ':'; ?>
        </label>
        <input class="widefat" id="<?php echo $this->get_field_id( 'title' ); ?>" name="<?php echo $this->get_field_name( 'title' ); ?>" type="text" value="<?php echo esc_attr( $title ); ?>" />
    </p>
    <p>
        <label for="<?php echo $this->get_field_id( 'twitter_username' ); ?>">
            <?php echo __( 'Twitter Username (without @)', 'twitter_tweets_widget' ) . ':'; ?>
        </label>
        <input class="widefat" id="<?php echo $this->get_field_id( 'twitter_username' ); ?>" name="<?php echo $this->get_field_name( 'twitter_username' ); ?>" type="text" value="<?php echo esc_attr( $twitter_username ); ?>" />
    </p>
    <p>
        <label for="<?php echo $this->get_field_id( 'update_count' ); ?>">
            <?php echo __( 'Number of Tweets to Display', 'twitter_tweets_widget' ) . ':'; ?>
        </label>
        <input class="widefat" id="<?php echo $this->get_field_id( 'update_count' ); ?>" name="<?php echo $this->get_field_name( 'update_count' ); ?>" type="number" value="<?php echo esc_attr( $update_count ); ?>" />
    </p>
    <p>
        <label for="<?php echo $this->get_field_id( 'oauth_access_token' ); ?>">
            <?php echo __( 'OAuth Access Token', 'twitter_tweets_widget' ) . ':'; ?>
        </label>
        <input class="widefat" id="<?php echo $this->get_field_id( 'oauth_access_token' ); ?>" name="<?php echo $this->get_field_name( 'oauth_access_token' ); ?>" type="text" value="<?php echo esc_attr( $oauth_access_token ); ?>" />
    </p>
    <p>
        <label for="<?php echo $this->get_field_id( 'oauth_access_token_secret' ); ?>">
            <?php echo __( 'OAuth Access Token Secret', 'twitter_tweets_widget' ) . ':'; ?>
        </label>
        <input class="widefat" id="<?php echo $this->get_field_id( 'oauth_access_token_secret' ); ?>" name="<?php echo $this->get_field_name( 'oauth_access_token_secret' ); ?>" type="text" value="<?php echo esc_attr( $oauth_access_token_secret ); ?>" />
    </p>
    <p>
        <label for="<?php echo $this->get_field_id( 'consumer_key' ); ?>">
            <?php echo __( 'Consumer Key', 'twitter_tweets_widget' ) . ':'; ?>
        </label>
        <input class="widefat" id="<?php echo $this->get_field_id( 'consumer_key' ); ?>" name="<?php echo $this->get_field_name( 'consumer_key' ); ?>" type="text" value="<?php echo esc_attr( $consumer_key ); ?>" />
    </p>
    <p>
        <label for="<?php echo $this->get_field_id( 'consumer_secret' ); ?>">
            <?php echo __( 'Consumer Secret', 'twitter_tweets_widget' ) . ':'; ?>
        </label>
        <input class="widefat" id="<?php echo $this->get_field_id( 'consumer_secret' ); ?>" name="<?php echo $this->get_field_name( 'consumer_secret' ); ?>" type="text" value="<?php echo esc_attr( $consumer_secret ); ?>" />
    </p>
    <?php
    
}

form() Unten sehen Sie einen Screenshot der Widget-Einstellungen, die mit der oben genannten

-Methode erstellt wurden.

form()

Wenn Werte in die Felder des Einstellungsformulars eingegeben werden, müssen diese in der Datenbank gespeichert werden.

Die Methode bereinigt Widget-Formularwerte, indem sie schädliche Daten entfernt und die bereinigten Daten dann in der Datenbank speichert.

public function update( $new_instance, $old_instance ) {
    $instance = array();
    
    $instance['title']                      = ( ! empty( $new_instance['title'] ) )                     ? strip_tags( $new_instance['title'] ) : '';
    $instance['title']                      = ( ! empty( $new_instance['title'] ) )                     ? strip_tags( $new_instance['title'] ) : '';
    $instance['twitter_username']           = ( ! empty( $new_instance['twitter_username'] ) )          ? strip_tags( $new_instance['twitter_username'] ) : '';
    $instance['update_count']               = ( ! empty( $new_instance['update_count'] ) )              ? strip_tags( $new_instance['update_count'] ) : '';
    $instance['oauth_access_token']         = ( ! empty( $new_instance['oauth_access_token'] ) )        ? strip_tags( $new_instance['oauth_access_token'] ) : '';
    $instance['oauth_access_token_secret']  = ( ! empty( $new_instance['oauth_access_token_secret'] ) ) ? strip_tags( $new_instance['oauth_access_token_secret'] ) : '';
    $instance['consumer_key']               = ( ! empty( $new_instance['consumer_key'] ) )              ? strip_tags( $new_instance['consumer_key'] ) : '';
    $instance['consumer_secret']            = ( ! empty( $new_instance['consumer_secret'] ) )           ? strip_tags( $new_instance['consumer_secret'] ) : '';

    return $instance;
}

update()Ich habe einen sehr nützlichen einfachen PHP-Wrapper für die Twitter-API gefunden, der es einfach macht, Anfragen zu senden und Antworten von der API zu empfangen, die unser Widget verwenden wird.

Laden Sie den PHP-Wrapper im Zip-Archiv aus dem GitHub-Repository herunter, extrahieren Sie die

-Datei mit der Wrapper-Klasse und fügen Sie sie ein.

下面的 twitter_timeline() 方法接受以下参数作为其参数，这在向 Twitter API 发出请求时会派上用场。

1. $username: Twitter 用户名

2. $limit: 小部件要显示的推文数量

3. $oauth_access_token: Twitter 应用程序 OAuth 访问令牌。

4. $oauth_access_token_secret: 应用程序 OAuth 访问令牌 秘密。

5. $consumer_key: Twitter 应用程序消费者密钥。

6. $consumer_secret: 应用程序消费者秘密。

public function twitter_timeline( $username, $limit, $oauth_access_token, $oauth_access_token_secret, $consumer_key, $consumer_secret ) {
    require_once 'TwitterAPIExchange.php';

    /** Set access tokens here - see: https://dev.twitter.com/apps/ */
    $settings = array(
        'oauth_access_token'        => $oauth_access_token,
        'oauth_access_token_secret' => $oauth_access_token_secret,
        'consumer_key'              => $consumer_key,
        'consumer_secret'           => $consumer_secret
    );

    $url = 'https://api.twitter.com/1.1/statuses/user_timeline.json';
    $getfield = '?screen_name=' . $username . '&count=' . $limit;
    $request_method = 'GET';
    
    $twitter_instance = new TwitterAPIExchange( $settings );
    
    $query = $twitter_instance
        ->setGetfield( $getfield )
        ->buildOauth( $url, $request_method )
        ->performRequest();
    
    $timeline = json_decode($query);

    return $timeline;
}

该方法使用 PHP Wrapper for Twitter API 向 Twitter API 发送请求，保存并返回响应（用户时间线的 JSON 数据）。

创建或制作推文的时间由 API 以英文文本日期时间保存。例如。 星期四 6 月 26 日 08:47:24 +0000 2014

为了使推文时间更加用户友好，我创建了方法 tweet_time()，它通过以下方式显示时间。

• 如果时间少于三秒，则返回现在。
• 不到一分钟，返回x秒前。
• 不到两分钟，返回大约 1 分钟前。
• 不到一小时，n 分钟前返回，依此类推。

这是 tweet_time() 方法的代码。

public function tweet_time( $time ) {
    // Get current timestamp.
    $now = strtotime( 'now' );

    // Get timestamp when tweet created.
    $created = strtotime( $time );

    // Get difference.
    $difference = $now - $created;

    // Calculate different time values.
    $minute = 60;
    $hour = $minute * 60;
    $day = $hour * 24;
    $week = $day * 7;

    if ( is_numeric( $difference ) && $difference > 0 ) {

        // If less than 3 seconds.
        if ( $difference < 3 ) {
            return __( 'right now', 'twitter_tweets_widget' );
        }

        // If less than minute.
        if ( $difference < $minute ) {
            return floor( $difference ) . ' ' . __( 'seconds ago', 'twitter_tweets_widget' );;
        }

        // If less than 2 minutes.
        if ( $difference < $minute * 2 ) {
            return __( 'about 1 minute ago', 'twitter_tweets_widget' );
        }

        // If less than hour.
        if ( $difference < $hour ) {
            return floor( $difference / $minute ) . ' ' . __( 'minutes ago', 'twitter_tweets_widget' );
        }

        // If less than 2 hours.
        if ( $difference < $hour * 2 ) {
            return __( 'about 1 hour ago', 'twitter_tweets_widget' );
        }

        // If less than day.
        if ( $difference < $day ) {
            return floor( $difference / $hour ) . ' ' . __( 'hours ago', 'twitter_tweets_widget' );
        }

        // If more than day, but less than 2 days.
        if ( $difference > $day && $difference < $day * 2 ) {
            return __( 'yesterday', 'twitter_tweets_widget' );;
        }

        // If less than year.
        if ( $difference < $day * 365 ) {
            return floor( $difference / $day ) . ' ' . __( 'days ago', 'twitter_tweets_widget' );
        }

        // Else return more than a year.
        return __( 'over a year ago', 'twitter_tweets_widget' );
    }
}

接下来是 widget() 方法，用于在 WordPress 前端显示 Twitter 时间线。

public function widget( $args, $instance ) {
    $title                     = apply_filters( 'widget_title', $instance['title'] );
    $username                  = $instance['twitter_username'];
    $limit                     = $instance['update_count'];
    $oauth_access_token        = $instance['oauth_access_token'];
    $oauth_access_token_secret = $instance['oauth_access_token_secret'];
    $consumer_key              = $instance['consumer_key'];
    $consumer_secret           = $instance['consumer_secret'];

    echo $args['before_widget'];

    if ( ! empty( $title ) ) {
        echo $args['before_title'] . $title . $args['after_title'];
    }

    // Get the tweets.
    $timelines = $this->twitter_timeline( $username, $limit, $oauth_access_token, $oauth_access_token_secret, $consumer_key, $consumer_secret );

    if ( $timelines ) {

        // Add links to URL and username mention in tweets.
        $patterns = array( '@(https?://([-\w\.]+)+(:\d+)?(/([\w/_\.]*(\?\S+)?)?)?)@', '/@([A-Za-z0-9_]{1,15})/' );
        $replace = array( '<a href="$1">$1</a>', '<a href="http://twitter.com/$1">@$1</a>' );

        foreach ( $timelines as $timeline ) {
            $result = preg_replace( $patterns, $replace, $timeline->text );

            echo '<div>';
                echo $result . '<br/>';
                echo $this->tweet_time( $timeline->created_at );
            echo '</div>';
            echo '<br/>';
        }

    } else {
        _e( 'Error fetching feeds. Please verify the Twitter settings in the widget.', 'twitter_tweets_widget' );
    }

    echo $args['after_widget'];
}

小部件类 Twitter_Tweets_Widget 最终使用 widgets_init 挂钩注册，因此 WordPress 可以识别它。使用结束语 } 结束您的课程，然后添加以下代码来初始化

function register_twitter_widget() {
    register_widget( 'Twitter_Tweets_Widget' );
}

add_action( 'widgets_init', 'register_twitter_widget' );

最后，我们完成了 Twitter 时间轴小部件的编码。

摘要

在本文中，我们学习了如何在实际项目中使用 Twitter API 来构建我们自己的 Twitter 时间线 WordPress 小部件。尽管本教程应该相对简单，但我们涵盖了 OAuth、密钥等主题，以及其他对于使用 API 的人员来说可能比较陌生的主题。

如果您有任何问题或代码改进建议，请在评论中告诉我。

Das obige ist der detaillierte Inhalt vonEntwerfen Sie Twitter-Widgets mit der neuesten Twitter-API. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!