5

I'd like to confirm a user tweeted after clicking a Twitter Web Intent. How can I accomplish this?

Example:

<a href="https://twitter.com/intent/tweet?text=Simple+Web+Intent">Tweet</a>

Assuming an anonymous* user clicks this link and tweets, how can I confirm this?

Ideally I'd love to get a link to the tweet.


* anonymous as in not authenticated on my site and without knowing their Twitter username

Ryan
  • 14,682
  • 32
  • 106
  • 179
  • @niraj-shah, can you get a jsfiddle working of your solution at https://www.webniraj.com/2012/09/11/twitter-api-tweet-button-callbacks/ ? I cannot get it to return. Does it no longer work? – Ryan Apr 28 '14 at 15:02
  • 1
    Looks like it no longer works, but I have a solution for you! – Niraj Shah Apr 28 '14 at 15:18

3 Answers3

7

Update

This solution no longer works after Twitter updated the behaviour of the widgets. You can only track if the tweet button was clicked now, and not if the tweet was actually posted.


You can track tweets using the 'twttr.events.bind' event listener form the Twitter API. A working example of tracking tweets can be found here: http://jsfiddle.net/EZ4wu/3/

HTML:

<a href="https://twitter.com/intent/tweet?url=https://www.webniraj.com/2012/09/11/twitter-api-tweet-button-callbacks/&text=Twitter+API:+Tweet+Button+Callbacks"><i class="icon-twitter-sign icon-white"></i> Tweet</a>

JavaScript:

function reward_user( event ) {
    if ( event ) {
        alert( 'Tweeted' );
        console.log( event );
    }
}

window.twttr = (function (d,s,id) {
    var t, js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return; js=d.createElement(s); js.id=id;
    js.src="//platform.twitter.com/widgets.js"; fjs.parentNode.insertBefore(js, fjs);
    return window.twttr || (t = { _e: [], ready: function(f){ t._e.push(f) } });
    }(document, "script", "twitter-wjs"));

twttr.ready(function (twttr) {
    twttr.events.bind('tweet', reward_user);
});

My previous solution is now outdated and no longer appears to work.

Niraj Shah
  • 15,087
  • 3
  • 41
  • 60
  • Amazing response time. Thanks so much. That did work. Is there any to return identifiable information about the user or the tweet that was sent? As in, is it possible to link to the tweet on the original page? Or `console.log(tweet_url)`? – Ryan Apr 28 '14 at 15:26
  • 2
    Twitter doesn't give the tweet id or user information back, but you kind of see what was tweeted using `console.log( event.target.href );` – Niraj Shah Apr 28 '14 at 15:34
  • Right, unless the user changes the default intent text. – Ryan Apr 28 '14 at 16:10
  • You won't be able to see what the user enters in the tweet, but `event.target.href` will remain the same as that's picked up from your HTML code. – Niraj Shah Apr 29 '14 at 09:56
  • How does this work exactly? Whenever I put in the script it complains about about twttr not being defined. I'm pretty sure I'm just not understanding something simple. – Bren Jun 05 '15 at 19:54
  • If you are using jQuery, put the code inside ```$(document).ready()``` to fix the issue. Or you have to wait for the javascript to load before attempting to bind. – Niraj Shah Jun 05 '15 at 23:00
  • 2
    Unfortunately, after an update to the twitter widgets on 11/20/2015 this solution will not work either. https://twittercommunity.com/t/forthcoming-change-to-web-intent-events/54718 – Brandon Short Dec 02 '15 at 14:29
  • As of 2018, this works partially - fires immediately after user clicks the link to tweet. You don't get a confirmation. – Maciej Krawczyk Feb 15 '18 at 09:01
0

Try this:

                        twttr.events.bind('loaded', function(event) {

                            window.location = "http://theredirect_link.com"

                        });
0

@Niroj's answer no longer works. They updated the api, so the event listener fires immediately after user clicks the button - you have no way of checking if he actually tweeted.

If you create the window yourself (without using Twitter widgets), you can at least detect if the window was closed (either user closed it or tweeted).

Don't link the widgets api!

HTML:

<a id="twitter-intent" href="https://twitter.com/intent/tweet?url=https://www.webniraj.com/2012/09/11/twitter-api-tweet-button-callbacks/&text=Twitter+API:+Tweet+Button+Callbacks"><i class="icon-twitter-sign icon-white"></i> Tweet</a>

JS:

document.getElementById('twitter-intent').addEventListener('click', function(e) {

    e.preventDefault();
    e.stopPropagation(); //this should do in case you don't want to unlink twitter widgets api

    var width  = 575,
        height = 400,
        left   = (screen.width  - width)  / 2,
        top    = (screen.height - height) / 2,
        url    = this.href,
        opts   = 'status=1' +
                 ',width='  + width  +
                 ',height=' + height +
                 ',top='    + top    +
                 ',left='   + left;

    var win = window.open(url, 'twitter_share', opts);

    var timer = setInterval(checkWin, 500);

    function checkWin() {

        if (win.closed) {
            //just assume the user tweeted (he could just close the window without tweeting)
            alert("Thank you for tweeting!");   
            clearInterval(timer);

        }

    }

});
Maciej Krawczyk
  • 14,825
  • 5
  • 55
  • 67