jQuery on the fly URL shortener

我正在尋找一個即時的URL縮短器，很像tweetdeck的工作原理。我發現了許多jQuery和一般的JavaScript插件，它們通過縮短服務（比如bit.ly）來運行它，當按下按鈕時。但是，我一直無法找到一個能夠在飛行中完成的人。我的第一個問題是這個已經存在嗎？其次，如果沒有，那麼識別需要在文本框內縮短的URL的最佳方式是什麼？我的想法：jQuery on the fly URL shortener

在尋找HTTP
通過文本運行文本區域的onkeyup如果發現搶整個URL（我怎麼確定最終可能是句號，逗號，空間等..？。）
確認網址是不是已經是一個bit.ly網址
驗證URL（發出請求，並確保HTTP響應不是錯誤，不bit.ly已經做到這一點？）
如果有效，請將url發送到bit.ly的API並獲得回覆
Re將長URL與短URL放在文本區域中。

想法？

來源

2009-11-20 Jason

思考？我喜歡。 – 2009-11-20 16:07:25

不知道你會用什麼，但如果你要讓用戶輸入數據，你可能想擴展第3步，以包含更多的URL縮短服務，而不僅僅是bit.ly。除非你可以將bit.ly地址重定向到tinyurl.com地址（例如）重定向到最終目的地。 – Travis 2009-11-20 16:17:03

而不是確保它不是一個bit.ly URL，您可以縮短長度超過x個字符的URL。例如，今天的tinyurl.com使用27個字符。 – 2009-11-20 19:13:56

下面是一個例子，如何獲得與Bitly API和jQuery縮短的URL：

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); 
     } 
    ); 
}

下面的代碼可以用來獲得短網址：

/* 
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); 
});

來源

2011-08-10 03:49:50

Bitly API已更改。請參閱[我的答案]（http://stackoverflow.com/a/22064069/237739） – 2014-02-27 09:23:38

飛行中的位難以做到可靠和快速。

人們大多數時間都不會輸入http甚至www。

如你所說，結束將很難確定url是否包含空格或更壞，因爲用戶沒有放入空格而進入下一句。

如果人們需要在事後更改網址會發生什麼情況，因爲他們鍵入http://stakoverflow.com/而不是https://stackoverflow.com/？

我認爲最好的解決方案是在你的文本編輯器中插入一個「縮短的url」按鈕，讓人們可以做到這一點。或者，在帖子製作完成後在服務器端進行。

來源

2009-11-20 16:12:24 greggreg

後有一個最大長度，縮短上飛給他們更多的人物，使他們的崗位 – Jason 2009-11-20 19:06:49

爲什麼不做一個jQuery POST到Bit.ly API？ http://blog.themeforest.net/tutorials/creating-an-ajax-web-app-using-the-bitly-api/

來源

2009-11-20 19:02:09 jocull

的問題是，他們只能在自己的崗位角色的X號和動態縮短他們的URL給了他們額外的字符 – Jason 2009-11-20 19:04:37

我在尋找類似的東西的時候發現了你的文章，並最終寫了一個jQuery插件，它提供了（至少部分）你正在尋找的東西。

我jQuery Url Shortener上到位桶

這是一個非常簡單的插件;我不需要縮短用戶的網址，所以我沒有進行任何長度檢查或網址測試，然後再縮短它，但我不反對添加這些類型的功能。

只是想你可能會覺得它有用。

至於識別您的文本框中的URL，我會建議使用RegEx to match the url。

來源

2010-03-19 14:23:52 Jiaaro

嗨Jiaaro - 我使用了這個功能，不得不做一些小改動來支持URL編碼。將第6行更改爲：+「＆longUrl =」+ encodeURIComponent（longUrl） - 感謝有用的插件。 – Kevin 2011-05-05 20:22:12

你也可以生成一個簡短的URL與服務器上的PHP和捲曲，這樣你就不必在網頁中公開你的API密鑰：

<?php 
    //the long url posted by your webpage 
    $url = strip_tags($_POST["url"]); 

    $api_user = "your_bitly_user_name"; 
    $api_key = "your_bitly_api_key"; 

    //send it to the bitly shorten webservice 
    $ch = curl_init ("http://api.bitly.com/v3/shorten?login=$api_user&apiKey=$api_key&longUrl=$url&format=json"); 
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1); 

    //the response is a JSON object, send it to your webpage 
    echo curl_exec($ch);  
?>

然後在你的網頁的代碼應該是這樣的：

//the long url that you want to shorten 
    var longUrl = escape(window.location.href) 

    $.ajax({ 
     url : "php/getShortUrl.php",//this is the php script above 
     dataType : "json", 
     type : "POST", 
     data : { 
      url : longUrl 
     }, 
     success : function(data) { 
      if(data.status_txt === "OK"){ 
       shortUrl = data.data.url; 
      } 
     }, 
     error : function(xhr, error, message) { 
      //no success, fallback to the long url 
      shortUrl = longUrl 
     } 
    });

更多細節

來源

2011-10-15 10:36:28 abudaan

我猜Bitly的API已經略有改變見bitly API。您現在只需要一個訪問令牌來請求一個簡短的URL。

繼best practices，我創建了下面的Javascript的只是片段：

getShortUrl: function(url, callback) 
{ 
    var accessToken = '___YOUR_ACCESS_TOKEN___'; 
    var url = 'https://api-ssl.bitly.com/v3/shorten?access_token=' + accessToken + '&longUrl=' + encodeURIComponent(url); 

    $.getJSON(
     url, 
     {}, 
     function(response) 
     { 
      if(callback) 
       callback(response.data.url); 
     } 
    ); 
},

來源

2014-02-27 09:22:41

jQuery on the fly URL shortener

回答

相關問題