Читать книгу Aprender desarrollo de videojuegos para móviles y web con Phaser.js - Pablo Monteserín - Страница 10
ОглавлениеEjecutar en el servidor
El código fuente de los juegos que haremos en Phaser está escrito en ficheros con código HTML y Javascript. Los documentos con extensión HTML suelen utilizarse para el desarrollo de páginas web. En nuestro caso, contendrá el código fuente de nuestro videojuego. Para lanzar un fichero HTML en nuestro navegador, en general, basta con hacer doble click sobre él; de esta forma, se abrirá con el navegador que el sistema operativo tenga asociado por defecto.
Sin embargo, por motivos de seguridad, los navegadores web (Chrome, Firefox, etc) bloquean ciertas funcionalidades cuando no ejecutamos nuestra aplicación a través de un servidor. Por ejemplo, bloquean peticiones Ajax, que es un tipo de petición que Phaser usa para cargar los recursos gráficos, sonidos, etc.
Por ello, para ejecutar videojuegos hechos con Phaser no basta con hacer doble click. Para ejecutar nuestros juegos necesitamos instalar un software que creará un servidor web local en nuestro ordenador. A través del servidor web local (en adelante localhost) debemos ejecutar nuestros videojuegos.
Por tanto, para programar con Phaser vamos a instalar un servidor local. Existen varias aplicaciones que nos permiten instalar un servidor local cómodamente. Yo le propongo descargar e instalar XAMPP. Si ya conoce o quiere probar otras opciones, le dejo los enlaces de otros servidores locales:
• WAMP: http://www.wampserver.com (para Windows)
• EASY PHP: http://www.easyphp.org (para Windows)
• MAMP: https://www.mamp.info (para Mac)
En nuestro caso, instalaremos XAMPP. Pasos en la instalación de XAMPP:
1. Iremos a su página web: https://www.apachefriends.org
2. Pulsamos sobre la versión de XAMPP correspondiente a nuestro sistema operativo para descargar el instalador.
3. Ejecutamos el instalador. La instalación muy sencilla y bastará con seguir las instrucciones que nos dan e ir pulsando el botón de siguiente cuando sea necesario. Cuando lleguemos al final, tendremos un servidor local instalado en nuestro equipo.
4. Arrancamos el servidor. Si es usuario de Windows, podrá acceder al panel de administración de nuestro servidor ejecutando la aplicación xampp-control que está en la carpeta xampp.
Aprender desarrollo de videojuegos para móviles y web con Phaser.js con 100 ejercicios prácticos
002
Tras ejecutar el programa xampp-control, debemos pulsar sobre el botón de Start que corresponde al módulo de Apache. Fíjese en la captura. Está señalado con un cículo naranja alrededor del botón de Start. En la siguiente imagen ya se ve el servicio arrancado, resaltando en verde el módulo de Apache.
Pasos a seguir en la ejecución de nuestro código Phaser:
Tras haber instalado y arrancado el servidor...
1. Accedemos mediante un navegador a
y se mostrará la página de bienvenida de Apache. Sin embargo, en el siguiente paso vamos a eliminarla.
2. Borramos el contenido de la carpeta:
c:/xampp/htdocs
Esta es la carpeta de su ordenador que se corresponde con la dirección:
Verá que en esa carpeta hay más cosas. Le recomiendo eliminar todo su contenido. De esta forma le será más cómodo utilizar el navegador web para acceder a los juegos, ya que cuando navegue por esta carpeta verá el contenido de la misma, en lugar de la página de bienvenida de XAMPP.
3. Dentro de la carpeta htdocs vamos a crear la carpeta elige-tu-propia-aventura, en la que dejaremos el código fuente de nuestro juego. Para acceder a ella desde el navegador, usaremos la siguiente dirección:
http://localhost/elige-tu-propia-aventura/
