Using Only Javascript To Shrink URLs Using The Bit.ly API

Question

I'm playing a bit with Javascript these days... I was shrinking some URLs using bit.ly to tweet them, then I started to think on a automated process that could use their API to shrink the URLs I wanted, then I looked up on their documentation, and I saw that they only support PHP(with some Javascript), but there is anyway that I could make this using only Javascript?

Answer 1

Here is an example how to get a shortened URL with Bitly API and jQuery, no server side code required.

function get_short_url(long_url, login, api_key, func)
{
    $.getJSON(
        "http://api.bitly.com/v3/shorten?callback=?", 
        { 
            "format": "json",
            "apiKey": api_key,
            "login": login,
            "longUrl": long_url
        },
        function(response)
        {
            func(response.data.url);
        }
    );
}

The following code could be used to get a short URL:

/*
Sign up for Bitly account at
 https://bitly.com/a/sign_up

and upon completion visit
https://bitly.com/a/your_api_key/ 
to get "login" and "api_key" values
*/
var login = "LOGIN_HERE";
var api_key = "API_KEY_HERE";
var long_url = "http://www.kozlenko.info";

get_short_url(long_url, login, api_key, function(short_url) {
    console.log(short_url);
});

Answer 2

From the developer best practises page on bitly:

To ensure the security of your API key and/or OAuth access token, we strongly suggest that you make requests to the bitly API server-side whenever possible.

Any requests to the bitly API made via client-side Javascript present the risk of your OAuth token or API key being compromised, but there are steps you can take to partially mitigate this risk. Most importantly, never include your api_key or access_token inline in the page. Keep any references to your api_key or access_token in code that is contained in external javascript files which are included in the page. For additional security, don't have the key or token itself contained anywhere in your javascript code, but rather make an ajax call to load it, and keep it in a variable stored in a privately scoped method. For an example of this implementation, please see our sample html and included javascript files.

Answer 3

Depending on where the JavaScript is executing, you could always use the bit.ly REST API:

http://code.google.com/p/bitly-api/wiki/ApiDocumentation

via XmlHttpRequest, for example:

http://api.bit.ly/v3/shorten?login=bitlyapidemo&apiKey=R_0da49e0a9118ff35f52f629d2d71bf07&longUrl=http%3A%2F%2Fbetaworks.com%2F&format=json