2. 22 - De JavaScript a JSON
(utilizando la librería json.js)
Librería Javascript.
Permite convertir objeto o array de
javascript a formato json y viceversa.
2
10. <?php
$conexion=mysql_connect("localhost","root","z80")
or die("Problemas en la conexion");
mysql_select_db("bdajax",$conexion) or
die("Problemas en la seleccion de la base de datos");
$registros=mysql_query("select codigo,descripcion,precio from
perifericos",$conexion)
or die("Problemas en el select".mysql_error());
while ($reg=mysql_fetch_array($registros))
{
$vec[]=$reg;
}
require('../JSON.php');
$json=new Services_JSON();
$cad=$json->encode($vec);
echo $cad;
?>
10
14. De JSON a PHP (utilizando
la librería JSON.php)
AHORA NOS QUEDA VER COMO EN EL SERVIDOR RECIBIR DATOS CON
FORMATO JSON Y PROCEDER A GENERAR UNA CLASE EN PHP MEDIANTE
LA LIBRERÍA JSON.PHP.
LA SINTAXIS ES:
$JSON=NEW SERVICES_JSON();
$CAD=$JSON->DECODE(STRIPSLASHES($_REQUEST['CADENA']));
ECHO 'NOMBRE:'.$CAD->NOMBRE;
...
...
14
15. la clase Services_JSON tiene un método llamado decode que recibe como
parámetro una cadena con datos codificados en JSON y procede a retornar la
información en un objeto.
15
16. Ejemplo:
Confeccionaremos un problema que envíe desde el navegador información en
formato JSON y en el servidor la convertiremos en un objeto de PHP y
procederemos a generar un trozo de HTML que retornaremos al navegador
para que lo muestre.
16
17. El archivo pagina1.html
<html>
<head>
<title>Problema</title>
<script src="../json.js" language="JavaScript"></script>
<script src="funciones.js" language="JavaScript"></script>
</head>
<body>
<h2>Enviar datos desde el navegador en formato JSON y proceder a la
decodificación en una clase PHP con la librería JSON.php</h2>
<input type="button" value="Enviar" id="boton1">
<div id="resultados"></div>
</body>
</html>
17
19. Cuando se presiona el botón procedemos a partir de un objeto JavaScript
generar una cadena en formato JSON, luego procedemos a llamar a la función
enviarDatos:
var obj={
nombre:'juan',
edad:25,
sueldos:[1200,1700,1990]
};
var cadena=obj.toJSONString();
enviarDatos(cadena);
19
20. La función enviarDatos procede a crear un objeto de la clase XMLHttpRequest y
pasa mediante el parámetro GET la cadena en formato JSON:
var conexion1;
function enviarDatos(cadena)
{
conexion1=crearXMLHttpRequest();
conexion1.onreadystatechange = procesarEventos;
conexion1.open('GET','pagina1.php?cadena='+cadena, true);
conexion1.send(null);
}
20
21. Solo queda mostrar el trozo de datos en HTML que retorna el servidor:
function procesarEventos()
{
var resultados = document.getElementById("resultados");
if(conexion1.readyState == 4)
{
resultados.innerHTML = conexion1.responseText;
}
else
{
resultados.innerHTML = "Cargando...";
}
}
21
23. El método que convierte una cadena con formato JSON en un
objeto de PHP es:
$cad=$json->decode(stripslashes($_REQUEST['cadena']));
Recordemos que con la función stripslashes sacamos los caracteres
de escape(barras invertidad para las comillas entre otras)
Luego podemos fácilmente acceder a los atributos del objeto con
la sintaxis
23
24. De JSON a PHP (utilizando
la librería JSON.php)
AHORA NOS QUEDA VER COMO EN EL SERVIDOR RECIBIR DATOS CON
FORMATO JSON Y PROCEDER A GENERAR UNA CLASE EN PHP MEDIANTE LA
LIBRERÍA JSON.PHP.
LA SINTAXIS ES:
$JSON=NEW SERVICES_JSON();
$CAD=$JSON->DECODE(STRIPSLASHES($_REQUEST['CADENA']));
ECHO 'NOMBRE:'.$CAD->NOMBRE;
...
...
25. la clase Services_JSON tiene un método llamado decode que recibe como
parámetro una cadena con datos codificados en JSON y procede a retornar la
información en un objeto.
26. Ejemplo:
Elaboraremos un problema que envíe desde el navegador información en
formato JSON y en el servidor la convertiremos en un objeto de PHP y
procederemos a generar un trozo de HTML que retornaremos al navegador
para que lo muestre.
27. El archivo pagina1.html
<html>
<head>
<title>Problema</title>
<script src="../json.js" language="JavaScript"></script>
<script src="funciones.js" language="JavaScript"></script>
</head>
<body>
<h2>Enviar datos desde el navegador en formato JSON y proceder a la
decodificación en una clase PHP con la librería JSON.php</h2>
<input type="button" value="Enviar" id="boton1">
<div id="resultados"></div>
</body>
</html>
29. Cuando se presiona el botón procedemos a partir de un objeto JavaScript
generar una cadena en formato JSON, luego procedemos a llamar a la función
enviarDatos:
var obj={
nombre:'juan',
edad:25,
sueldos:[1200,1700,1990]
};
var cadena=obj.toJSONString();
enviarDatos(cadena);
30. La función enviarDatos procede a crear un objeto de la clase XMLHttpRequest y
pasa mediante el parámetro GET la cadena en formato JSON:
var conexion1;
function enviarDatos(cadena)
{
conexion1=crearXMLHttpRequest();
conexion1.onreadystatechange = procesarEventos;
conexion1.open('GET','pagina1.php?cadena='+cadena, true);
conexion1.send(null);
}
31. Solo queda mostrar el trozo de datos en HTML que retorna el servidor:
function procesarEventos()
{
var resultados = document.getElementById("resultados");
if(conexion1.readyState == 4)
{
resultados.innerHTML = conexion1.responseText;
}
else
{
resultados.innerHTML = "Cargando...";
}
}
33. El método que convierte una cadena con formato JSON en un
objeto de PHP es:
$cad=$json->decode(stripslashes($_REQUEST['cadena']));
Recordemos que con la función stripslashes sacamos los caracteres
de escape(barras invertidad para las comillas entre otras)
Luego podemos fácilmente acceder a los atributos del objeto con
la sintaxis