viernes, 28 de septiembre de 2012

Botón Compartir en Linkedin para Blogger

Cuando creas una entrada en un

blog de Blogger

aparecen en la parte inferior los iconos para compartir ésta en

twiter, Facebook y Google+

pero muy probablemente eches de menos el compartir en

Linkedin

; en este artículo (donde puedes ver el mencionado botón) te explicaremos como añadirlo, personalizarlo y cambiar el

idioma

del texto.

  1. Entramos en

    Blogger

    , vamos al apartado Plantilla y pulsamos sobre el botón "Edición de HTML" y marcamos la casilla "Expandir plantilla de artilugios".


  2. Situaremos el

    botón Compartir en Linkedin

    justo debajo de los botones de

    twitter, facebook...

    (tal como está en este blog) por lo que buscamos dentro del HTML de la plantilla el código:
    <div class='post-footer-line post-footer-line-2'>
    
  3. Justo encima del código anterior añadimos el código siguiente para añadir el

    botón Compartir en Linkedin

    :
    <script src='http://platform.linkedin.com/in.js' type='text/javascript'/>
    <script data-counter='right' expr:data-url='data:post.url' type='IN/Share'/>
    
    Tras insertar el código guardamos la plantilla y recargamos nuestra página, nos aparecerá el siguiente botón.


  4. Todo lo comentado anteriormente está bien, lo podéis encontrar con facilidad en otros blogs, ahora vamos a por nota... El

    botón Compartir en Linkedin

    es ligeramente personalizable, os muestro las 3 opciones:

    Areatic, botón share / compartir en Blogger - Personalizar botón
    De izquierda a derecha, en función del valor de "data-counter" del segundo <script>:
    • data-counter="top":
      <script src='http://platform.linkedin.com/in.js' type='text/javascript'/>
      <script data-counter='top' expr:data-url='data:post.url' type='IN/Share'/>
      
    • data-counter="right":
      <script src='http://platform.linkedin.com/in.js' type='text/javascript'/>
      <script data-counter='right' expr:data-url='data:post.url' type='IN/Share'/>
      
    • eliminando data-counter del script:
      <script src='http://platform.linkedin.com/in.js' type='text/javascript'/>
      <script expr:data-url='data:post.url' type='IN/Share'/>
      

  5. Y ahora ya a por la matrícula de honor, je je je... Supongo que os habéis fijado en que el texto que aparece en el

    botón Compartir en Linkedin

    es

    Share

    y seguro que os gustaría cambiarlo a

    Compartir

    , a otro

    idioma

    o personalizarlo incluso más... para hacerlo utilizaremos JQuery, justo bajo las 2 líneas insertadas anteriormente añadiremos 2 más, el código quedaría de la forma:

    <script src='http://platform.linkedin.com/in.js' type='text/javascript'/>
    <script data-counter='right' expr:data-url='data:post.url' type='IN/Share'/>
    <script src='//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'/>
    <script> $(window).load( function() { $('.IN-widget').find('span[id$="-title-text"]').text('Share'); }); </script>
    

    Simplemente es modificar en la última línea del código anterior el texto

    Share

    por

    Compartir

    , cualquier otro

    idioma

    o simplemente el texto que más nos guste (manteniendo ' ').
Hecho, si recargas la página ya tienes el

botón Compartir en Linkedin personalizado y en el idioma deseado

. Es importante destacar que el HTML de los puntos 3, 4 y 5 podemos insertarlo en nuestro blog de

Blogger

pero también en cualquier otro blog o web. Espero que os sea útil este artículo, dentro de areaTIC puedes encontrar otros artículos interesantes, no dudes en consultar nuestro archivo.


viernes, 21 de septiembre de 2012

WCF - Interceptar y manipular mensaje soap Cliente usando Message Inspector en tiempo de ejecución

En la mayoría de los casos

WCF

permite mediante la clase

MessageContract

modificar el mensaje

soap

. Si cliente y servidor son

WCF

no debería haber problema para manipular el mensaje usando

MessageContract

y sin duda es el modo más elegante de personalizar un mensaje pero a efectos de

interoperabilidad

no es aplicable en todos los escenarios.

WCF Extensibility

proporciona herramientas con el objetivo que el desarrollador pueda personalizar el comportamiento de diversos aspectos de los servicios como seguridad, hosting, serialización, publicación de metadatos, canales...

En concreto en este artículo veremos como crear un

Message Inspector

personalizado y lo añadiremos a nuestro cliente

WCF

. El objetivo de

Message Inspector

es tener acceso a todos los mensajes de salida y entrada que procesa el cliente para manipular algún aspecto del mensaje

soap

.

En primer lugar crearemos una clase AreaTICMessageInspector:

    public class AreaTICMessageInspector: IDispatchMessageInspector, IClientMessageInspector
    {
        public AreaTICMessageInspector()
        {

        }

        #region IDispatchMessageInspector Members

        public object AfterReceiveRequest(ref System.ServiceModel.Channels.Message request, System.ServiceModel.IClientChannel channel, System.ServiceModel.InstanceContext instanceContext)
        {
            return null;
        }

        public void BeforeSendReply(ref System.ServiceModel.Channels.Message reply, object correlationState)
        {
        }

        #endregion

        #region IClientMessageInspector Members

        public void AfterReceiveReply(ref System.ServiceModel.Channels.Message reply, object correlationState)
        {

        }

        public object BeforeSendRequest(ref System.ServiceModel.Channels.Message request, System.ServiceModel.IClientChannel channel)
        {
            //Copiamos objeto request para poder modificarlo
            Message newMessage = null;
            MessageBuffer buffer = request.CreateBufferedCopy(Int32.MaxValue);
            request = buffer.CreateMessage();

            //obtenemos Xml del request
            XmlDocument oDoc = new XmlDocument();
            using (XmlWriter writer = oDoc.CreateNavigator().AppendChild())
            {
                request.WriteMessage(writer);
                writer.Close();
            }

            //Manipulamos XML mensaje
            //oDoc.Nodes.Add(...) o oDoc.Nodes[0].Attributes...

            //Damos el "cambiazo" de request original por el modificado
            XmlNodeReader reader = new XmlNodeReader(oDoc);
            newMessage = Message.CreateMessage(reader, int.MaxValue, request.Version);
            request = newMessage;

            return null;
        }

        #endregion
    }
}
En el ejemplo hemos implementado el método

BeforeSendRequest

que nos permite controlar el mensaje de salida en cliente. Si queremos manipular también la respuesta tendríamos que implementar

AfterReceiveReply

.

En segundo lugar hemos de crear una clase AreaTICMessageInspector, es importante implementar la interface

IEndPointBehavior

.

namespace AreaTIC
{
    [AttributeUsage(AttributeTargets.Class)]
    public class AreaTICMessageInspectorBehavior : Attribute, IEndpointBehavior
    {
        public AreaTICMessageInspectorBehavior() : base() 
        { 

        }

        #region IEndpointBehavior Members

        public void AddBindingParameters(ServiceEndpoint endpoint, System.ServiceModel.Channels.BindingParameterCollection bindingParameters)
        {
        }

        public void ApplyClientBehavior(ServiceEndpoint endpoint, System.ServiceModel.Dispatcher.ClientRuntime clientRuntime)
        {
            IClientMessageInspector inspector = null;
            inspector = new AreaTICMessageInspector();
            clientRuntime.MessageInspectors.Add(inspector);
        }

        public void ApplyDispatchBehavior(ServiceEndpoint endpoint, System.ServiceModel.Dispatcher.EndpointDispatcher endpointDispatcher)
        {
            //no es necesaria su implementación en cliente.
        }

        public void Validate(ServiceEndpoint endpoint)
        {
            //no es necesaria su implementación en cliente.
        }

        #endregion
    }
}
Por último hemos de añadir en tiempo de ejecución el

EndPointBehavior

personalizado al EndPoint que usa el cliente para comunicar:

      client.Endpoint.Behaviors.Add(new AreaTICMessageInspectorBehavior());
Espero que os sea útil este artículo, dentro de

areaTIC

puedes encontrar otros artículos interesantes, no dudes en consultar nuestro archivo.


sábado, 15 de septiembre de 2012

Capturar y analizar código HTTP con Fiddler

Hay varias herramientas como

Fiddler

, WebSphere, Cain (...) que nos permiten interceptar el tráfico entre aplicaciones cliente y servidor por protocolo

http

. Disponer de esta información puede ser útil en varios contextos. Por ejemplo, estamos desarrollando un servicio web que ha de ser totalmente interoperable con otras plataformas cliente y alguno de ellos está teniendo problemas de comunicación soap con nuestro servicio. Nos interesa comparar el mensaje en un cliente que funciona y en otro que no funciona para analizar que parte del mensaje hace que nuestro servicio lo rechace.

En este artículo veremos como configurar

Fiddler

en nuestra máquina cliente con el propósito de obtener toda la información que intercambia el navegador con el servidor web por puerto

http

y

https

(ssl).

Vamos a la página de descarga Fiddler, descargamos e instalamos. En el ejemplo usamos la versión v2.4.1. Una vez instalado, no haría falta configurar nada para empezar a usarlo. Al ejecutar

Fiddler

se nos abrirá una pantalla como esta.


Cada vez que desde un navegador hagamos una petición a una URL por puerto

http

/

https

quedará registrada como una nueva fila en el apartado Web Sessions que está situado en la parte izquierda de la pantalla.

Una vez empezamos a tener entradas, nos situamos en la fila que nos interesa y en la parte derecha seleccionamos la pestaña Inspectors. El apartado Insepectors se divide en dos partes (request y response) que nos permiten analizar las cabeceras y contenido del mensaje de petición cliente y su respectiva respuesta del servidor.

Es importante saber que

Fiddler

por defecto no desencripta el tráfico ssl por tanto si necesitamos capturar por puerto https tendremos que habilitar la opción. Nos situamos en el menú Tools/Fiddler Options. En la pestaña

HTTPS

marcamos las casillas que se muestran en la imagen.


Si es la primera vez que configuramos esta opción en la sesión de Windows, nos preguntará a cerca de si queremos almacenar el certificado de

Fiddler

en el CA de confianza de Windows. En otras palabras estamos permitiendo a

Fiddler

que suplante la identidad de los servidores donde están ubicadas URL que visitamos. Ya es eso lo que necesitamos en este caso por tanto respondemos "Sí" a esta y a la siguiente pregunta.


Por último en el escenario del ejemplo podría darse el caso que nuestro servicio sólo acepte peticiones autentificadas con certificado cliente. En este caso es necesario disponer del certificado cliente con claves privadas correctamente instalado en el almacén correspondiente. Si disponemos del certificado se trataría copiar la parte pública

.cer

en la ruta

%USERPROFILE%\My Documents\Fiddler2\ClientCertificate.cer

. De este modo

Fiddler

usará la parte pública de nuestro certificado cliente como puntero para acceder a las claves privadas que están almacenadas en Windows y podrá firmar la petición como cliente. Dentro de

areaTIC

puedes encontrar otros artículos interesantes, no dudes en consultar nuestro archivo.


viernes, 7 de septiembre de 2012

Metaetiqueta keywords en Blogger

La

metaetiqueta keywords

que sirve para indicar las palabras clave de una página no es usada para el

posicionamiento

en Google, si no habéis leído el artículo Metaetiqueta description en Blogger os lo recomiendo antes que sigáis adelante con éste.

Bien, si lo habéis leído "parece" (porque el famoso algoritmo de búsqueda de Google es secreto) que

metaetiqueta keywords

no es usada para el

posicionamiento

pero sí puede que sea usada por otros buscadores. Por tanto, os indicaré en unos breves pasos cómo podéis configurar una

metaetiqueta keywords

diferente para cada entrada de

Blogger

. Los pasos serían los siguientes, es muy sencillo:
  1. Entramos en

    Blogger

    , vamos al apartado Plantilla y pulsamos sobre el botón "Edición de HTML".


  2. Buscamos en el HTML en la plantilla el código:

    <title><data:blog.pageTitle/></title>
    

  3. Justo encima del código anterior añadimos el código siguiente para cada entrada de

    Blogger

    en la que queramos añadir la

    metaetiqueta keywords

    :

    <b:if cond='"http://url_entrada.html" == data:blog.url'>
      <meta content='metaetiqueta, keywords, blogger' name='keywords'/>
    </b:if>
    
    Donde:
    • "http://url_entrada.html" es la URL de la entrada de

      Blogger

      , algo del estilo "http://www.areatic.net/2012/08/metaetiqueta-keywords-en-blogger.html"
    • "metaetiqueta, keywords, blogger" son las palabras claves que queramos introducir, hasta N.
    Tras los cambios guardamos la plantilla.

  4. Por último comprobamos que ha funcionado correctamente. Tras publicar la entrada, abrimos en el navegador la entrada correspondiente y visualizamos el código fuente de la página, podemos ver cómo aparece la

    metaetiqueta keywords

    .


Espero que os sea útil este artículo, dentro de

areaTIC

puedes encontrar otros artículos interesantes, consulta nuestro archivo.


LECTURAS RELACIONADAS RECOMENDADAS POR AREATIC.NET