Almacenamiento remoto: formato JSON

Name: Aprender a desarrollar con JavaScript Aspectos principales del uso de frameworks (4ª edición)
Rating: 1 (1 reviews)

Presentación general de la solución

En el capítulo anterior, hemos visto cómo implementar una solución de almacenamiento remoto basada en las siguientes tecnologías:

HTML/JavaScript.
Ajax con XMLHttpRequest (objeto JavaScript o ActiveX, que permite recuperar desde un servidor remoto los datos en formato XML, JSON, pero también HTML e incluso texto simple con consultas HTTP).
Protocolo SOAP, que encapsula un encabezado y los datos en formato XML.
PHP (lenguaje orientado a servidor) para consultar a la base de datos.
NuSOAP (librería PHP dedicada a la preparación de mensajes SOAP).
MySQL (servidor de dase de datos).
Parser DOM para descodificar el mensaje SOAP recibido del servidor.

Las herramientas utilizadas son relativamente genéricas y se pueden extrapolar con facilidad utilizando, por ejemplo, otro SGBD en el servidor (PosgreSQL, Microsoft SQL Server...) u otro lenguaje de programación (PHP, Microsoft ASP.NET...).

Sin duda, la principal dificultad sería encontrar, en nuestro caso, una alternativa a la librería NuSOAP.

En este capítulo, vamos a desarrollar de nuevo el ejemplo del capítulo anterior, pero utilizando el formato de datos XML con otro formato: JSON (JavaScript Object Notation).

JSON es un formato ligero de intercambio de datos. Tiene la ventaja de ser independiente de los lenguajes de programación y presenta la particularidad de ser reconocido...

Implementación del almacenamiento remoto a través de ejemplos

Se van a presentar cinco ejemplos completos de aplicación.

Para las necesidades de estos ejemplos, vamos a reutilizar la tabla MySQL coches que hemos visto en el capítulo anterior.

Recordemos simplemente la estructura de esta tabla:

codigo_coche, de cuatro caracteres (código del coche).
nombre_coche, de 20 caracteres (etiqueta del coche).
velocidad_maxima es un número entero (velocidad máxima que el coche puede alcanzar, en un circuito, por supuesto).

1. Ejemplo 1: Presentación del sistema de notación JSON

Comentario del script JSON_01.htm

En este primer ejemplo, nos centramos en estudiar el sistema de notación propio de JSON y el modo de acceso a las propiedades de los objetos.

Todo el código JavaScript comentado que se muestra a continuación se ha situado en la sección HTML <body> del script (llamado JSON_01.htm). Por tanto, este código está dentro de:

<!-- Inicio script JavaScript --> 
<script type="text/JavaScript"> 
   /* Código JavaScript comentado a continuación */ 
</script>

El script empieza definiendo tres objetos (coche), caracterizados por las propiedades habituales (cf. capítulo anterior): código, nombre y velocidad máxima:

/* Definición de 3 objetos JSON */ 
var coche1 = { 
   codigo: "V001", 
   nombre: "Porsche 930 Turbo", 
   velocidad_maxima: 290 
};  
var coche2 = {  
   codigo: "V002",  
   nombre: "Porsche 964 Turbo",  
   velocidad_maxima: 300  
};  
var coche3 = {  
   codigo: "V003",  
   nombre: "Ferrari 430",  
   velocidad_maxima: 320  
};

Los valores de las propiedades de texto (nombre) aparecen entre comillas.

También creamos un objeto compuesto (ensamblado de objetos) llamado alemanes, que agrupa los objetos coche1 y coche2, que efectivamente son coches alemanes, como sigue:

/* Definición de un objeto compuesto */ 
var alemanes = { 
   aleman1: coche1, 
   aleman2: coche2 
};

Veamos ahora cómo utilizar estos objetos para mostrar, por ejemplo...