Oct 13

Small recap of web shell applications

Reading time: 2 – 2 minutes

Lately I found some useful web applications that publish a terminal application. This is very useful when you are traveling or you have a remote server which you want to maintain or access from anywhere. Also another interesting use of this kind of applications is as a terminal for embedded devices.

I tried to use them as my default applications but all of them have the same problem: keyboard shortcuts conflict with the browser. I’m very used to use a lot of shortcuts to manage my terminal application and remote shell and this is a problem because most of the shortcuts are redefined by your browser. May be it’s possible to disable browser shortcuts when you are using this kind of web applications but I didn’t find how.

I hope this small list is as much useful for you as it is for me:

  • Wetty = Web + tty (the best one IMHO)

wetty

ajaxterm

anyterm

gateone

Mar 07

WordPress plugin: permalink editor

Reading time: < 1 minute When your are using custom permalinks for posts in wordpress you can have problems to use permalinks in wordpress pages; because rewrite rules can't work properly for both: posts and pages. In my case permalink editor plugin has been the definitive solution.

Next you can see new permalink configuration form in wordpress after installing permalink editor:

UPDATE 2017-08-07, interesting alternative ultimate guide to blog readability.

Mar 05

Nova imatge

Reading time: < 1 minute Aquest cap de setmana he invertit algunes hores en començar el que serà el nou blog, de moment l'estructura de pestanyes és la mateixa que l'antic blog però l'aspecte ja ha canviat moltíssim. Així doncs, en base a aquest nou aspecte començaré a construir la nova estructura de categories que anava comentant en els últims articles. Desitjo que us agradi.

Dec 15

+1 Scraper (PlusOneScraper)

Reading time: 2 – 3 minutes

Google +1
La nova inteficie web del Google Reader ha portat molta cua a les xarxes socials i als mitjans digitals en general. Quan ets usuario d’un servei cloud, i si aquest és gratuït encara més, has d’estar obert a tot aquest tipus de situacions. Obviament hi ha coses que es fan estrictament per millorar l’experiència d’usuari i d’altres per anar alineats amb l’estrategia de negoci de l’empresa que ofereix el servei, en aquest cas Google.

Doncs bé, en el meu cas no entraré a discutir les moltíssimes sorpreses agradables que m’ha portat la nova interficie, sinó que em centraré a solucionar un dels pocs problemes que m’ha portat la interficie. Abans disposava d’un botó ‘share’ que em generava un petit blog on es penjaben les noticies que jo compartia. A través d’aquell blog la que em seguia podia veure les notícies que anava destacant dels meus feeds i jo mateix podia subscriurem amb un programa de lectura d’RSS per la tablet o el mòbil i així podia atendra les lectures més llargues en diversos moments morts del dia.

El famós botó de ‘share’ ha estat substituit pel ‘+1’ que com molts ja sabeu s’usa en molts llocs, no només al ‘Google Reader’ sinó a moltíssims blogs als que no cal estar sindicat per fer un ‘+1’ als articles que ens agraden, a busquedes de google, etc. De fet, jo pronostico que amb el temps això del ‘+1’ s’extendrà fins a nivell insospitats. Així doncs, a priori la idea és molt bona el problema és que tot el que botem dient que ens agrada s’afegeix al nostres ‘stream’ de ‘Google Plus’ que a dia d’avui no disposa de fil RSS, amb tot el que això suposa com ja he indicat abans.

Tot llegint el blog de l’Enrique Danz resulta que ell també té aquest problema i l’han resolt amb un simple script de PHP que fa d’scraper sobre la llista de ‘+1’ que manté ‘Google Plus’. El codi és senzillíssim d’usar el col·loquem al nostre server LAMP li passem l’usuari de la nostre compte google i l’script ens treu un XML en format RSS amb tot el que hem marcat amb un ‘+1’.

Oct 17

Screencast 0x01 – Com funciona OAuth?

Reading time: 1 – 2 minutes

Després de la primera prova pilot amb el tema dels screencast presento aquesta altre entrega en la mateixa línia de la primera però amb un tema una mica més interessant i difícil d’explicar. Per si no ús sona de res OAuth, comentar que és un sistema d’autorització d’accés a una API per part d’aplicaicons i d’aplicacions web. Compte, en si mateix OAuth no és un sistema d’autenticació sinó d’autorització, si no teniu clars aquests conceptes: wikipedia: authentication vs authorization.

Bé ja em comentareu si algú ha pogut entendre algo, he de dir que m’hi he esforçat força en simplificar el tema i no ha estat fàcil fer-ho.

Aug 21

Què és un WebHook?

Reading time: < 1 minute WebHook logo
Un WebHook és una HTTP callback, o sigui, un HTTP POST que es dona quan algo passa (un event); o sigui, que podem definir WebHook com a sistema de notificació d’events per HTTP POST.

El valor més important dels WebHooks és la possibilitat de poder rebre events quan aquest passen no a través dels ineficaços mecanismes de polling.

Si voleu més informació sobre aquest tema: WebHooks site.

Apr 29

Webs 2.0 interessants: formspring, doodle i uwish

Reading time: 2 – 3 minutes

Aquest mes he publicat articles una mica densos i pesats de seguir, així doncs per relaxar una mica l’ambient abans de seguir els que tinc preparats que no són menys durs ús deixo amb tres referències que trobo molt interessants:

formspring

  • URL: http://formspring.me
  • Descripció: servei molt simple, que permet que la gent ens pregunti coses, nosaltres podem contestar i queda un registre de les preguntes i respostes. Això ens permet elaborar un FAQ sense gairebé cap esforç, a més de contestar les preguntes que realment interessen a la gent i no només les que se’ns acudeixen a nosaltres. Si per casualitat em voleu preguntar alguna cosa: http://www.formspring.me/oriolrius

doodle

  • URL: http://doodle.com
  • Descripció: alguna vegada ja l’havia usat però mai me l’havia mirat amb calma, és una eina genial per quan has de prendre una decisió entre un grup de gent. La decisió pot ser sobre una pregnuta o sobre una data. A més també es poden organitzar votacions per un tema, o crear llistes perquè la gent s’afegeixi i els usuaris es pronunciïn sobre la qüestió. Alguns exemples: quina data quedem per sopar amb la gent de l’escola? quin disseny ús agrada més? qui vindrà a esquiar aquest cap de setmana?

uwish

  • URL: http://uwi.sh
  • Descripció: le descobert per casualitat llegint un blog, que ni recordo quin era. El servei permet tenir la nostre ‘wish list‘ publicada perquè tothom sapigue què desitgem tenir. Malgrat ser una versió molt inicial, la socialització de la idea la trobo molt interessant i útil. Realment una idea i implementació boníssimes. Si voleu veure la meva wish list: http://uwi.sh/oriolrius. Trànquils no aspiro a que ningú hem regali res, però m’agrada tenir referenciades les coses que m’agradaria comprar-me.
Apr 16

long polling amb jquery+jsonp+couchdb (cross domain suportat)

Reading time: 6 – 9 minutes

Porto mesos somiant amb fer la prova de concepte que explico en aquest article, intentaré descriure en que consisteix però ja aviso que la cosa és un pèl complicadilla.

Funcionalitats requerides:

  • long polling: l’objectiu és rebre els canvis d’una base de dades de couchdb en temps real sense haver d’anar preguntant si hi ha canvis, sinó que aquest s’envien cada vegada que es donen de forma automàtica.
  • A través de jQuery el que vull és actualitzar una pàgina web de forma asíncrona, de forma que els nous resultats que vagin entrant a la BBDD es vagin mostrant en temps real a la pantalla.
  • JSONP, és una tècnica que ens permet rebre la sortida JSON de CouchDB i després cridar una funció de callback de JavaScript. El problema és que la funció jQuery.getJSON() original de jQuery té algunes mancances que gràcies a el plugin jQuery-JSONP podem solucionar, aquestes són: (copy/paste de la web del plugin)
    • error recovery in case of network failure or ill-formed JSON responses,
    • precise control over callback naming and how it is transmitted in the URL,
    • multiple requests with the same callback name running concurrently,
    • two caching mechanisms (browser-based and page based),
    • the possibility to manually abort the request just like any other AJAX request,
    • a timeout mechanism.
  • CouchDB és una base de dades NoSQL basada en documents que és capaç d’emetre una senyal (trigger) cada vegada que el contingut d’una base de dades canvia. Per més informació sobre el tema es pot consultar a: CouchDB: The Definitive Guide al capítol Change Notifications.
  • Cross-domain: quan es llença una petició XmlHttpRequest (la base del AJAX) amb JavaScript tenim la limitació de només poder-ho fer sobre el domini que serveix la pàgina web, cap altre port ni subdomini. Obviament tampoc un altre host. Per saltar-se aquesta restricción és quan cal recorrer a JSONP.

La prova de concepte ha estat crear una base de dades anomenada: notifcations on es guarden documents que són notificacions a mostrar a la pàgina web.

Després he programat la següent web:

<html>
<head>
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="jquery.jsonp-1.1.4.js"></script>
<script type="text/javascript">
function longpoll(since) {
    var url = "http://IP_COUCHDB_SERVER:5984/notifications/_changes?include_docs=true&feed=longpoll&since="+since+"&callback=?";
    console.log("since="+since);
    $.jsonp({
        "url":url,
        "success":function(data) {
            //console.log(data);
            since=data.last_seq;
            try {
                console.log(data.results[0].doc.msg);
            } catch(err) {
                console.log("error:"+err);
            };
            longpoll(since);
        },
        "error":function(msg) {
            //console.log(msg);
            console.log('capturat error');
        }
    });
};

var url = "http://IP_COUCHDB_SERVER:5984/notifications?callback=?";
$.jsonp({
    "url":url,
    "success":function(data) {
        //console.log(data);
        longpoll(data.update_seq);
    },
    "error":function(msg) {
        console.log(msg);
    }
});
</script>
</head>
<body>
cos
</body>
</html>

El codi és força simple de seguir, primer de tot es carreguen les llibreries: jQuery 1.4.2 i jquery-jsonp 1.1.4, ambdues necessaries per cridar el métode $.jsonp que és el que realment farà la feina.

A continuació es declara la funció longpoll que té com a paràmetre el númeral que indica quin ha estat el últim canvi a la base de dades. Aquest s’utiliza per construir la petició que es fa a CouchDB:

var url = "http://IP_COUCHDB_SERVER:5984/notifications/_changes?include_docs=true&feed=longpoll&since="+since+"&callback=?";

La URL el que fa és demanar el següent:

  • els canvis (_changes)
  • incloent els documents que han canviat (include_docs=true)
  • tracta la petició com a long polling (feed=longpoll)
  • mostra els canvis des de la versió X (since=X)
  • quan enviis els canvis fes una crida a la funció de callback definida aquí (callback=?)
    • ‘?’ és substituit per jquery-jsonp per la funció anomenada ‘C’, aquest nom es pot canviar usant paràmetres en la declaració de $.jsonp() que ve a continuació

Els missatges de l’estil ‘console.log()‘ són per tenir un seguiment del que va passant a la consola de javascript del navegador.

$.jsonp() té força paràmetres possibles definits a la API, però en aquesta prova de concepte només uso ‘url’, ‘success’ i ‘error’. El primer esta clar que és, els altres dos són les funcions a cridar quan l’acció va bé o malament respectivament. Dins de la funció posem el codi referent a les accions que volem fer, per exemple, actualitzar la pàgina actual. Com que això només és una prova de concepte el que faig és mostrar missatges per consola i llestos. La part més important és fixar-se que quan la cosa ha anat bé es fa una crida a ella mateix de forma que la cosa no acabi mai. De fet quan hi ha un error es podria també fer una crida a si mateix perquè no pares de provar de llençar la petició un i altre cop, però el que he fet per provar eś que es notifiqui a la consola de javascript i prou.

Fora de la funció longpoll el que es fa és una petició JSONP per saber quina és l’últim número de seqüència de la base de dades, paràmetre necessari per entrar per primera vegada a la funció recursiva de longpoll.

Conclusions

Pot semblar tot una mica enravassat però diria que he simplificat el problema moltíssim, ja que fins ara havia estat teoritzant moltíssim sobre el tema. Fins que ahir i abans d’ahir vaig haver de posar-me a provar-ho a la pràctica per saber exactament com es podia implementar. Sota el meu punt de vista ha quedat tot força net i entenedor.

Pels que sou programadors de webs habitualment haureu tingut necessitats semblants així doncs espero que ús pugui ser tan útil com a mi, de fet, fa unes setmanes que estic treballant amb Tiny Core Linux montant un Quiet PC sobre una DOM de 512MB per usar-la de sistema de monitorització de les meves xarxes i les d’alguns clients, espero que d’aquí uns mesos pugui donar-vos més informació del projecte.

Mar 05

Terminals via Web (CLI via Web)

Reading time: 2 – 2 minutes

UPDATE 2017/1/18: I just discovered Wetty which is by far the best option that I found to have a Web Terminal completely easy to use and compatible with Linux terminals. I highly recommend it.

En l’article sobre Turnkey Linux vaig parlar sobre shellinabox, doncs bé per coses de l’atzar he descobert que no és l’únic sistema que preten donar accés a una sessió de shell a través d’una pàgina web.

De fet, les tres eines que he trobat són realment bones, així doncs si algú en sap alguna cosa més sobre elles que m’ho digui perquè no sé amb quina quedar-me:

  • shellinabox: emula un terminal VT100 i es llença com un dimoni que dona accés al host local a través del port que escollim, pot treballar amb o sense SSL.
  • ANYTerm: també suporta SSL però treballa a través d’Apache recolzant-se amb mod_proxy.
  • AJAXTerm: inspirat en ANYTerm però molt més simple d’instal·lar, ja que només depèn de python, o sigui, que treballa com a dimoni en el sistema on volem tenir la shell.
Jun 19

podcast 1×09: sistema de autentcació unificat (single-sign-on)

Reading time: < 1 minute Perseguint el paradigme de la SSO dins de l'empesa avui intentaré explicar el següent esquema:

mapa d'autenticació single-sign-on

Disclaimer: si alguna cosa és incoherent o no funciona hem sap greu, he fet el que he pogut.