Cómo pasar una variable de JavaScript a PHP

Si estás programando algún sistema web medianamente complejo, es muy probable que te hayas enfrentado a este problema alguna vez.

En muy resumidas cuentas, lo que estás intentando hacer es algo como:

var variable_js = 2;
$variable_php = variable_js;

Sería lindo que todo funcionara de esa forma, ¿no? Lamentablemente, la cosa no es tan fácil (Pero tampoco es tan difícil en realidad).

Por qué no se puede pasar directamente un valor de Js a PHP

Esta pregunta esconde un poco de confusión respecto de cómo funcionan las aplicaciones web. Algo parecido a lo que comentaba en este artículo.

El punto es que PHP y JavaScript se ejecutan en lugares y momentos diferentes.

Es como si estuvieses leyendo un libro y te encontraras con algo que no comprendés del todo y para solucionarlo le hicieras la pregunta al libro… algo no va a funcionar.

Empecemos entonces por comprender el ciclo de vida de una aplicación web.

Cómo es el ciclo de vida de una aplicación web

El flujo típico de una aplicación web es el siguiente:

  1. El cliente hace un pedido al servidor (Envía un comando HTTP)
  2. El servidor lo recibe y lo analiza
    1. Si se trata de un php se lo pasa al intérprete correspondiente
    2. El intérprete procesa el código y genera una salida (Usualmente HTML)
  3. El servidor envía la salida hacia el cliente
  4. El cliente analiza la respuesta y dibuja la página
  5. El cliente ejecuta el código Js

Entonces, si observás este ciclo, te darás cuenta que, para el momento en que la variable Js aparece en escena… php ya está haciendo cualquier otra cosa.

Pues entonces… ¿no hay solución? ¡No tan rápido!

Lo que necesitas es poder ejecutar JS y PHP en paralelo (es decir, en un mismo tiempo).

Cómo enviar información de JavaScript a PHP

La solución al problema pasa por usar un poco de imaginación… y ajax :).

Cómo funciona una aplicación con AJAX:

  1. El cliente hace un pedido al servidor (Envía un comando HTTP)
  2. El servidor lo recibe y lo analiza
    1. Si se trata de un php se lo pasa al intérprete correspondiente
    2. El intérprete procesa el código y genera una salida (Usualmente HTML)
  3. El servidor envía la salida hacia el cliente
  4. El cliente analiza la respuesta y dibuja la página
  5. El cliente ejecuta el código Js
    1. Dentro del código se ejecuta una segunda petición al servidor (la cual tiene su propio ciclo de vida que culmina con una respuesta HTTP).
    2. El cliente recibe la respuesta del servidor
    3. El cliente actúa sobre la respuesta recibida

Dependiendo de cuál sea tu necesidad puntual (Es decir, qué necesitas que la aplicación haga una vez reciba la variable de JS), deberás determinar si el cliente debe bloquearse (Es decir, no hacer nada hasta que PHP complete su procesamiento de la información enviada) o puede continuar con alguna otra tarea.

Un ejemplo de esto sería:

<?php
$var = 1;
?>
<html>
	<body>
		<input type="button" value="Enviar variable" id="send"/>
	</body>
	<script src="https://code.jquery.com/jquery-3.4.1.min.js" integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo=" crossorigin="anonymous"></script>
	<script type="text/javascript">
	$('#send').click( function() {
	alert('Enviando!');
		$.ajax(
				{
					url: 'get_var.php?var=<?php echo $var; ?>',
					success: function( data ) {
						alert( 'El servidor devolvio "' + data + '"' );
					}
				}
			)
		}
	);
	</script>
</html>

Y el get_var.php:

<?php
echo 'Recibi '.$_GET['var'];

Y de ese modo se puede comunicar JavaScript hacia PHP.

mchojrin

Docente y consultor PHP at Leeway Academy
Ayudo a desarrolladores PHP a acelerar su llegada a Sr.

2 comentarios en “Cómo pasar una variable de JavaScript a PHP

  • Hola Mauro!,

    tengo una gran duda, veo que se habla mucho de que Jquery está muerto, hace ya mucho tiempo, yo sigo usándolo pero…. si está muerto como mucha gente dice, llegará un momento en que dejará de funcionar?, los navegadores dejarán de usarlo?

    Si es así, en mi caso por ejemplo que estoy terminando un CRM que llevo casi un año y medio… estoy muerto…

    Recomiendas alguna alternativa de manera nativa?, ajax nativo o javascript?, no se si esto sería una solución…

    Ya me dices.

    Gracias por el post.

    • Hola Fran:

      Gracias por el mensaje!

      Respecto de tu pregunta, soy algo escéptico respecto de la «muerte» de jQuery… yo personalmente lo sigo usando y me va bastante bien con él (aunque, nobleza obliga) casi todo mi trabajo pasa más por el BackEnd y hago alguna pequeña cosita en FrontEnd cuando necesito.

      En principio te diría que no te desesperes… aún si jQuery muere, no será mañana… hay tiempo.

      Lo que sí te recomendaría es que si tienes mucho de front vayas mirando Vue.js o React que parece ser lo que se está poniendo de moda estos días.

      Exitos!

¿Te quedó alguna duda? Publica aca tu pregunta

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

A %d blogueros les gusta esto: