Utilizando el API de TinyUrl

Todos aquellos que frecuentamos Twitter estamos más que acostumbrados a ver direcciones cortas generadas por distintos proveedores. En este post voy a mostrar un pequeño ejemplo de cómo podríamos utilizar uno de estos proveedores, TinyUrl, para conseguir esas direcciones cortas desde nuestra aplicación.

En primer lugar he creado un pequeño formulario Ajax con ASP.NET MVC:

[xhtml]

<%@ Page Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage" %>

<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
    Tiny Url Maker
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">

        <% using (Ajax.BeginForm("MakeTinyUrl", new AjaxOptions { HttpMethod = "Post", UpdateTargetId = "tinyUrl" }))            {%>
        <%=Html.TextBox("url") %>
        <input id="btnMakeUrl" type="submit" value="Make tinyUrl" />
        <%             }%>
   

<div id="tinyUrl">
        <%Html.RenderPartial("TinyUrl"); %>
    </div>

</asp:Content>

[/xhtml]

Al pulsar en el botón, de manera asíncrona, llamaremos a la acción MakeTinyUrl donde llamaremos a la API disponible.

[csharp]

using System.IO;
using System.Net;
using System.Web.Mvc;

namespace TinyURLAPI.Controllers
{
    [HandleError]
    public class HomeController : Controller
    {
        public ActionResult Index()
        {
            ViewData["Message"] = "Welcome to ASP.NET MVC!";

            return View();
        }

        [HttpPost]
        public ActionResult MakeTinyUrl(string url)
        {
            var tinyUrl = WebRequest.Create("http://tinyurl.com/api-create.php?url=" + url);
            var shortUrl = tinyUrl.GetResponse();

            using (var reader = new StreamReader(shortUrl.GetResponseStream()))
            {
                ViewData["tinyUrl"] = reader.ReadToEnd();
            }
            return PartialView("TinyUrl");

        }
    }
}

[/csharp]

Si arrancamos la aplicación e introducimos cualquier url, el resultado sería el siguiente:

Tiny-URL-MVC

¡Saludos!

2 Comments

  1. Oscar febrero 28, 2011 at 6:51 pm

    Hola,

    Primero quiero agradecerte por el blog, sencillamente es espectacular. Explicas los temas de forma clara y precisa.

    Bueno aquí va mi «aporte»:

    Resulta estoy utilizando Ajax en un proyecto para ver el estado de conexión de una de las sucursales de la empresa… es bastante sencillo, en un Selector o «DropDownList» elijo la sucursal y automáticamente (Sin dar click en un botón tipo submit) traer la información de la entidad y el estado de conexión de la misma.

    Como buen principiante, aproveche de alguna manera la analogía que tenía mi problema con el expuesto aquí. Pero encontré problemas de mi aplicación con los navegadores Chrome e IE (Había utilizado el atributo onchange=»submit();» a modo de simular el botón).

    Después de «Googlear» encontré : http://tinyurl.com/4blxzr3 en donde explican que utilizando el método «Trigger» el problema se puede solucionar. Por último aquí http://tinyurl.com/4dgcnmq nos indican como hacerlo funcional para más navegadores.

    Gracias por tu Blog.

    Oscar.

    Reply
    1. Gisela marzo 3, 2011 at 1:09 am

      Hola Oscar,

      Muchas gracias por tu comentario, me alegra que mi blog te sea de utilidad 🙂

      ¡Gracias por tu aporte!

      ¡Saludos!

      Reply

Deja un comentario

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.