goo.gl URL Shortener Bookmarklet via YQL

Last month we saw a new Google URL shortening service that will be used for Feedburner and the Google Toolbar. It wasn’t long before the URL shortening code in the toolbar was dissected, and subsequent APIs developed. I managed to put together my own by using YQL.

YQL is a truly amazing web API.  With its server-side JavaScript and the ability to quickly scour the web for information, there is very little it cannot do.  I decided it was the perfect platform for putting together a simple API for goo.gl.

Because the Google Toolbar was already written in JavaScript, implementing it in YQL was quite easy with the server-side JavaScript. It wasn’t long, before I put together my own open data table for goo.gl.

I submitted my open table to the git repository for open data tables, and shortly after my goo.gl open data table was included. It’s really pretty simple. The YQL you would use to get the short URL for my blog would be:

SELECT * FROM google.goo.gl WHERE url="http://geeklad.com"

The great thing about YQL is that you can obtain the data as XML or JSON, and specify a JSON callback function. So that means it’s very easy to use in JavaScript and develop cross-domain JavaScript. I put together a simple bookmarklet that uses my public YQL table and provides a goo.gl URL for the current page. To try it out, just drag and drop the link below to your browser’s shortcut bar:

[raw]

goo.gl page

[/raw]

Here’s the JavaScript code from the bookmarklet:
[raw]

var YQL_url='https://query.yahooapis.com/v1/public/yql?format=json&env=store://datatables.org/alltableswithkeys&q=';
var YQL_statement='SELECT * FROM google.goo.gl WHERE url=\''+document.location.href+'\'';
var YQL_script_url=YQL_url+encodeURIComponent(YQL_statement)+'&callback=yql_cb';
function yql_cb(response){
	short_url=response.query.results.result;
	prompt('Here is your short URL (be sure to copy to your clipboard): ', short_url);
}
var yql_script=document.createElement('script');
yql_script.src=YQL_script_url;
document.getElementsByTagName('head')[0].appendChild(yql_script);

[/raw]

Pretty simple. Basically it works by putting together the YQL statement w/ the URL of the current page, builds the proper YQL API URL for it, and finally inserts a JavaScript script with the call to the callback function that displays the URL of the current page in a prompt. You’ll have to manually copy it to your clipboard. Enjoy!