Создание коротких ссылок с помощью jQuery и сервиса 1cl.in

Укорачивание URL стало необходимым при работе с микроблогами и другими социальными сервисами. Самих сервисов коротких URL тоже стало много и некоторые из них имеют доступный API для использования в приложениях. Один из таких сервисов 1cl.in предоставляет традиционный API для получения короткого URL:

1
# curl http://1cl.in/api.php?longurl=https://www.masterit.ru/

Такой способ применим в собственном приложении, например в PHP можно написать:

1
2
3
<?php
$short_url = file_get_contents('http://1cl.in/api.php?longurl=https://www.masterit.ru/');
?>

В переменной $short_url окажется короткий вариант, который можно использовать для замены оригинала в тексте.
Однако, сервис можно использовать и в client-side приложениях с использованием JQuery или другого JS фреймоворка.

Недавно на 9lessons.info был опубликован пример скрипта для работы с сервисом bit.ly. Но сервис bit.ly требует регистрации и получения API KEY. Поэтому я решил переделать код на использование 1cl.in.

Ниже привожу код примера:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<script type="text/javascript"
src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {

  //short_url function
  function short_url(url) {
     $.ajax({
        url:"http://1cl.in/api.php",
        data:{longurl:url,format:"json"},
        dataType:"jsonp",
        success:function(a) {
           var short_url = a.url;
           $("#result").html('<a href="'+short_url+'" target="_blank">'+short_url+'</a>');
        }
    });
}


  $("#short").click(function() {
     var url=$("#url").val();
     var urlRegex = /(\b(https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/ig;
     var urltest=urlRegex.test(url);
     if(urltest) {
           short_url(url);
     } else {
           alert("Bad URL");
     }
  });
});
</script>

<input type="text" name="url" id="url"/>
<input type="submit" id="short" value="Submit"/>
<div id="result"></div>

Посмотреть пример: 1cli-example.

Об авторе AlexeyBalin

AlexeyBalin
Разрабатываю и поддерживаю большое количество сайтов, работающих на выделенных серверах и виртуальных хостинг-аккаунтах.


Запись опубликована в рубрике Программирование с метками , . Добавьте в закладки постоянную ссылку.


Поделиться с друзьями




2 комментария: Создание коротких ссылок с помощью jQuery и сервиса 1cl.in

    Добавить комментарий