AJAX and the URL short(ening)

by Kofi Sarfo 16. June 2009 23:42

A popular choice for shorterning URLs on Twitter is Bit.ly. It's just so nice and tidy with great analytics. For example, not long after shortening http://cnn.com/ we discovered that there have already been 2,659 clicks to that URL via Bit.ly.

I am using the C# API from @kersney by the way and found out that Bit.ly does do the sensible thing and return the same shortened URL each time you supply an unadulterated URL. What I've not yet done is built chains of shortened URLs that lead to each... seemingly endless possibilities! What the C# API code is missing is &history=1 querystring parameter to have the shortened URL added to the list displayed in Bit.ly History.

Some Default.aspx code to give this a go:


<body>
<form id="form1" runat="server">
<div style="width: 100%;">
Original URL:
<asp:TextBox ID="TextBox1" runat="server" Width="100%"></asp:TextBox>
<div style="text-align: right; width: 100%">
<asp:Button ID="Button1" runat="server" Text="Shorten" onclick="Button1_Click" />
</div>
</div>
<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
</form>
</body>

And some codebehind:

protected void Button1_Click(object sender, EventArgs e) { TextBox2.Text = API.Bit("bitlyapidemo", "R_0da49e0a9118ff35f52f629d2d71bf07", TextBox1.Text, "Shorten"); }

Now we pretend that bit.ly takes ages to return a shortened URL so we use javascript instead.


<script src="http://bit.ly/javascript-api.js
?version=latest
&login=bitlyapidemo
&apiKey=R_0da49e0a9118ff35f52f629d2d71bf07"

type="text/javascript">
</script>

<script type="text/javascript">

BitlyClient.addPageLoadEvent(function()
{
BitlyCB.shortenResponse = function(data)
{
var s = '';

var first_result;
// Results are keyed by longUrl, so we need to grab the first one.
for (var r in data.results) {
first_result = data.results[r]; break;
}
for (var key in first_result) {
s += key + ":" + first_result[key].toString() + "\n";
}

document.getElementById("bitlyUrl").value = first_result['shortUrl'];
}
});

function getBitlyUrl()
{
BitlyClient.shorten(document.getElementById("rawUrl").value, 'BitlyCB.shortenResponse');
}
</script>

No prizes for guessing the elements in the document.


<body>
<form id="formeula1" runat="server">
<div style="width: 100%;">
<br />Original URL:
<br /><input type="text" id="rawUrl" size="100" value="http://wimiro.com" />
<input value="Shorten" type="button" onclick="getBitlyUrl()"/>
<br />
<br />Bit.ly URL:
<br /><input type="text" id="bitlyUrl" size="20" />
</div>
</form>
</body>

So, there are no postbacks anymore but does this make it AJAX? Honestly, I have no idea. I see mention of callback_method_name in the bit.ly javascript api so my guess is that, yes, this is asynchronous. But shall we bother to test this or do we try and involve jQuery?

Comments

11/22/2009 2:51:56 PM #

I always wanted to write in my site something like that but I guess you'r faster Smile

payday loans United States |

12/17/2009 1:12:40 AM #

I guess there's always an easier way ...

VA Payday Loans United States |

Comments are closed

Kofi Sarfo modified theme by Mads Kristensen



Content by WIMIRO Technology is licensed under a Creative Commons Attribution-Share Alike 2.0 UK: England & Wales License.

Creative Commons License

Powered by BlogEngine.NET 1.5.0.7

About Me

Director, Wimiro Technology
London, United Kingdom

Writes in third person and first person plural; currently commutes to Moorgate.

Kiva Loans

  • Issa Sarr

    Issa Sarr

    Personal Purchases

    Requested loan: $200

    Amount raised: $75

    Dakar, Senegal

    social needs

    Loan Now »

  • Edwin

    Edwin

    Movie Tapes & DVDs

    Requested loan: $800

    Amount raised: $125

    La Paz, Bolivia

    Buy a DVD burner tower

    Loan Now »

  • Soo

    Soo

    Laundry

    Requested loan: $5375

    Amount raised: $2175

    Queens, New York, United States

    To purchase a new dry cleaning machine

    Loan Now »

 To see more entrepreneurs »

Kiva Loans