App Revista Desarrolla

Setup solucin servidor

Alejandro Barranco
ibeeBlue Mobile

! ! ! ! ! ! ! ! !

Octubre 2013

! !

Revista Desarrolla

! !

Contenido
Seccin 1.- Requerimientos 1.1 Componentes 1.2 Requisitos Seccin 2.- Configuracin de la base de datos - MySQL 2.1 Creacin de subdominios 2.2 Opciones de configuracin con la DB 2.3 Instalacin de archivos Seccin 3.- Instalacin de APP - interfaz de administracin 3.1 Creacin de sitio web 3.2 Opciones de configuracin con la DB 3.3 Instalacin de archivos Seccin 4.- Instalacin de API 4.1 Creacin de sitio web 4.2 Opciones de configuracin con la DB 4.3 Instalacin de archivos Seccin 5.- Configuracin de Newsstand App. 5.1 End-Points usados para la comunicacin

!! ibeeBlue Mobile !

! !

Revista Desarrolla

! !

Seccin 1 Requerimientos
1.1 Componentes iOS Newsstand App basada en la versin 4.1 de Baker Base de datos en MySQL Archivos de API Archivos de interfaz de administracin

API Server

App Store

APP/Administracin desde sitio web

!"! !"#

1.2 Requerimientos Se requiere de una cuenta en algn servidor que soporte los siguientes requerimientos mnimos: Apache 2.0 PHP 5.3 mayor MySQL 5.0 mayor phpMyAdmin 3.5

!! ibeeBlue Mobile !

! !

Revista Desarrolla

! !

Seccin 2 Configuracin de la base de datos

El primer paso requerido es crear una base de datos, la cual se compondr por las tablas necesarias tanto para la APP de administracin como para la API. Adems se requiere crear un usuario que permita realizar operaciones sobre esta base de datos. Desde phpMyAdmin: 1) Crear una base de datos. Nombre: app_revista_desarrolla Cotejamiento: ascii_general_ci (opcional)

2) Crear un nuevo usuario Nombre: admin_revista Servidor: localhost Contrasea: passwordRevista

!! ibeeBlue Mobile !

! !

Revista Desarrolla

! !

Al momento de crear el usuario no tendr privilegios sobre ninguna base de datos. Modificamos esto desde la accin Editar los privilegios

Seleccionamos la base de datos sobre la que tendr privilegios, continuar

Marcamos todos los privilegios, continuar

Ahora s regresamos a la vista de Usuarios ya estn actualizados los cambios

Las tablas y los datos necesarios se agregarn de manera automtica posteriormente durante la instalacin de la API.

!! ibeeBlue Mobile !

! !

Revista Desarrolla

! !

Seccin 3 Instalacin de APP - Interfaz de administracin

Para tener acceso y administrar toda la informacin referente a la revista se har uso de un sitio web. Para instalar este sitio simplemente correremos un archivo ejecutable y automticamente se crearan las tablas dentro de la base de datos creada anteriormente. Adems se insertaran datos de ejemplo para agilizar su uso.

3.1 Creacin de sitio web

Para una mejor organizacin de la informacin se crearn dos sitios web dentro del servidor para alojar los archivos de la APP y la API. La APP consiste en una consola de administracin desde la cual se podr agregar, editar y eliminar informacin de la base de datos. La API consiste en una serie de scripts en PHP los cuales permiten la comunicacin entre la app instalada en el iPad y la informacin en el servidor.

Para Mac OS X: El primer paso es abrir la app Server en la mac servidor, seleccionar el servicio Sitios web y habilitarlo de ser necesario junto con la opcin PHP web applications

Posteriormente crearemos un nuevo sitio con los siguientes valores: Nombre del dominio: app.serverside.com Puerto: 8885 !! ibeeBlue Mobile !

! !

Revista Desarrolla

! !

Las dems opciones se dejan con los valores por default.

Repetimos este proceso para crear otro dominio con los siguientes valores: Nombre del dominio: api.serverside.com Puerto: 8886 Las dems opciones se dejan con los valores por default. Al momento de crear estos sitios automticamente nos crearan las carpetas donde se guardaran los archivos que usaremos. Para comprobarlo podemos navegar hasta las rutas: Library/Server/Web/Data/Sites/api.serverside.com Library/Server/Web/Data/Sites/app.serverside.com

Para Windows:
El primer paso es crear dos directorios donde se guardaran los archivos de instalacin. La ubicacin puede ser cualquiera, en este tutorial se uso la siguiente ruta: /Users/Desktop/Path Server/app.ibeeblue.com /Users/Desktop/Path Server/api.ibeeblue.com Posteriormente se requiere crear dos puertos virtuales. Abre el archivo ubicado en /MAMP/conf/apache/httpd.conf y agrega las siguientes lneas al final del archivo:

!! ibeeBlue Mobile !

! !

Revista Desarrolla

! !

#Puerto para APP Listen 8885 <VirtualHost *:8885> DocumentRoot "/Users/Desktop/Path Server/app.serverside.com" ServerName localhost: 8885 ServerAlias app.ibeeblue.com CustomLog "/Users/Desktop/Path Server/app.serverside.com/log/apache_access.log" combined ErrorLog "/Users/Desktop/Path Server/app.serverside.com/log/apache_error.log" SetEnv APPLICATION_ENV development php_flag magic_quotes_gpc off <Directory "/Users/Desktop/Path Server/app.serverside.com"> Options Indexes MultiViews FollowSymLinks AllowOverride All Order allow,deny Allow from all </Directory> </VirtualHost> #Puerto para API Listen 8886 <VirtualHost *:8886> DocumentRoot "/Users/Desktop/Path Server/api.serverside.com" ServerName localhost: 8886 ServerAlias api.ibeeblue.com CustomLog "/Users/Desktop/Path Server/api.serverside.com/log/apache_access.log" combined ErrorLog "/Users/Desktop/Path Server/api.serverside.com/log/apache_error.log" SetEnv APPLICATION_ENV development php_flag magic_quotes_gpc off <Directory "/Users/Desktop/Path Server/api.serverside.com"> Options Indexes MultiViews FollowSymLinks AllowOverride All Order allow,deny Allow from all </Directory> </VirtualHost>

Modifica las lneas de acuerdo a la ruta de directorio que creaste. Salva el archivo y reinicia el servidor local.

!! ibeeBlue Mobile !

! !

Revista Desarrolla

! !

Una vez creados los directorios para cada sitio, subimos los archivos para cada uno de ellos. S se utiliza un servidor remoto la mejor forma de hacer esto es por medio de un cliente FTP, s se utiliza uno local basta con copiar y pegar las carpetas al destino deseado. Copiamos el contenido de la carpeta app.ibeeblue.com a la carpeta Library/Server/Web/Data/Sites/app.serverside.com. (Para este tutorial se utilizo el cliente FTP Cyberduck debido a que se trabajo sobre un servidor remoto)

Finalmente abriremos los puertos destinados a estos sitios desde el router para tener acceso a travs de internet. Desde la pagina de administracin del router (192.168.0.1), seleccionamos la opcin Port Forwarding y abrimos los puertos 8885 y 8886 para la IP del servidor donde se crearon los sitios (192.168.0.10) con el protocolo TCP.

!! ibeeBlue Mobile !

! !

Revista Desarrolla

! !

3.2 Opciones de configuracin de la DB

Opcionalmente se pueden configurar los valores que se usaran durante la instalacin de las tablas para la base de datos. Si no modificaste los valores durante la creacin de la DB y usaste los de este tutorial puedes dejar estos valores con el contenido por default. Para modificarlos abre el archivo que se encuentra en la ruta: Library/Server/Web/Data/Sites/app.serverside.com/application/config/dat abase.php Verificaremos que los siguientes valores se encuentren en el archivo ( reemplaza con los valores que se usaron durante la instalacin de la DB):
$db['default']['hostname'] = 'localhost'; $db['default']['username'] = ' admin_revista '; $db['default']['password'] = passwordRevista; $db['default']['database'] = app_revista_desarrolla '; // for pdo: mysql:host=localhost // DB Username // DB Username Password // DB Name

3.3 Instalacin de archivos

Desde algn navegador nos direccionamos al dominio creado previamente, http://localhost:8885, el cual nos mostrar la siguiente pagina de instalacin:

Es importante notar que antes de continuar se nos pide que el directorio Library/Server/Web/Data/Sites/app.serverside.com/application/config/database debe tener permisos de lectura y escritura, de otro modo no se podrn insertar los valores de ejemplo durante la instalacin. Una vez checado esto, podremos instalar los archivos para la APP sin ningn problema. !! ibeeBlue Mobile !

! !

Revista Desarrolla

! !

El siguiente paso es ingresar al sistema. La nica credencial disponible despus de la instalacin es: Usuario: user Contrasea: 123456 Mas adelante se podr modificar el perfil para cambiar el nombre y contrasea del usuario.

Una vez dentro del sistema, se nos mostrara el panel de control con una descripcin bsica de las funciones disponibles.

!! ibeeBlue Mobile !

! !

Revista Desarrolla

! !

Seccin 4.- Instalacin de API

El segundo componente necesario para la solucin del servidor es la API, la cual nos permitir comunicar de manera reciproca la app con el servidor web. Esto es usado cada vez que en la app se realiza alguna operacin tales como compra, suscripcin o instalacin en un nuevo dispositivo. Al igual que la APP, se instalar un sitio web para alojar los archivos requeridos por la API. En este caso bastara con copiar los archivos y configurarlos correctamente para poder entablar comunicacin con la base de datos.

4.1 Creacin de sitios web

El dominio tanto para la APP como para la API, as como la configuracin de los puertos utilizados, se realizo en la seccin anterior. Lo que falta por hacer es copiar el contenido de la carpeta api.ibeeblue.com a la carpeta Library/Server/Web/Data/Sites/api.serverside.com. Sin embargo en este caso se requiere de un paso extra.

Uno de los archivos que contiene la API es htaccess.txt. Este archivo requiere una terminacin diferente: .htaccess. para funcionar correctamente. Este tipo de archivos aparecen como ocultos para el sistema operativo Mac, por lo que es necesario hacer la conversin de formato posterior a la copia en el directorio del servidor.

!! ibeeBlue Mobile !

! !

Revista Desarrolla

! !

Para cambiar la terminacin, abrimos la aplicacin Terminal, nos ubicamos en el directorio donde se encuentra el archivo htaccess.txt (Library/Server/Web/Data/Sites/api.serverside.com) y ejecutamos el comando: mv ~/htaccess.txt ~/.htaccess Para comprobar que se cambio la terminacin del archivo, desde terminal ejecutamos el siguiente comando: ls - all Nos deber mostrar todos los archivos del directorio y dentro de ellos el archivo .htaccess

4.2 Opciones de configuracin de la DB

4.2 Opciones de configuracin de la DB

Opcionalmente se pueden configurar los valores que se usaran durante la instalacin de las tablas para la base de datos. Si no modificaste los valores durante la creacin de la DB y usaste los de este tutorial puedes dejar estos valores con el contenido por default. Abre el archivo que se encuentra en la ruta: Library/Server/Web/Data/Sites/api.serverside.com/index.php Verificaremos que los siguientes valores se encuentren en el archivo ( remplaza con los valores que se usaron durante la instalacin de la DB):
$dbContainer['db.options'] = array( 'host' => 'localhost', 'username' => admin_revista ', 'password' => passwordRevista 'dbname' => ' app_revista_desarrolla ' );

!! ibeeBlue Mobile !

! !

Revista Desarrolla

! !

4.3 Instalacin de archivos

Desde algn navegador nos direccionamos al dominio de la API, http://localhost:8886, el cual nos mostrar la siguiente pagina de instalacin:

! ! ! ! ! ! ! ! ! !

En este caso no es necesaria una instalacin de archivos, simplemente comprobamos que la comunicacin con la base de datos sea correcta. De ser as, el sistema nos mostrara un aviso como el siguiente:

!! ibeeBlue Mobile !

! !

Revista Desarrolla

! !

Seccin 5.- Configuracin de Newsstand App

Cada proyecto de la app contiene un archivo Constants.h donde se enumeran los end-points de la API a los que necesita conectarse para funcionar correctamente. Estos se llamarn durante varias procesos de la aplicacin.

5.1 End-Points usados para la comunicacin

Para iniciar, abre el proyecto de la Newsstand App en Xcode y navega hasta el siguiente archivo BakerShelf/Constants.h, deber mostrar contenido como este:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50

#ifdef BAKER_NEWSSTAND // Remove the following line once you complete the Newsstand setup below. #warning Newsstand: Remember to set the AppStore/Newsstand constants and delete this line once you did it. // ---------------------------------------------------------------------------------------------------// Mandatory - This constant defines where the JSON file containing all the publications is located. // For more information on this file, see: https://github.com/Simbul/baker/wiki/Newsstand-shelf-JSON // E.g. @"http://example.com/shelf.json" #define NEWSSTAND_MANIFEST_URL @"http://api.yourdomain.com/issues/:app_id/:user_id" // ---------------------------------------------------------------------------------------------------// Optional - This constant specifies the URL to ping back when a user purchases an issue or a subscription. // For more information, see: https://github.com/Simbul/baker/wiki/Baker-Server-API // E.g. @"http://example.com/purchased" #define PURCHASE_CONFIRMATION_URL @"http://api.yourdomain.com/confirmpurchase/:app_id/:user_id" // ---------------------------------------------------------------------------------------------------// Optional - This constant specifies a URL that will be used to retrieve the list of purchased issues. // For more information, see: https://github.com/Simbul/baker/wiki/Baker-Server-API // E.g. @"http://example.com/purchases" #define PURCHASES_URL @"http://api.yourdomain.com/purchases/:app_id/:user_id" // ---------------------------------------------------------------------------------------------------// Optional - This constant specifies the URL to ping back when a user enables push notifications. // For more information, see: https://github.com/Simbul/baker/wiki/Baker-Server-API // E.g. @"http://example.com/post_apns_token" #define POST_APNS_TOKEN_URL @"http://api.yourdomain.com/apns/:app_id/:user_id" // // // //

---------------------------------------------------------------------------------------------------Mandatory - The following two constants identify the subscriptions you set up in iTunesConnect. See: iTunes Connect -> Manage Your Application -> (Your application) -> Manage In App Purchases You *have* to set at least one among FREE_SUBSCRIPTION_PRODUCT_ID and AUTO_RENEWABLE_SUBSCRIPTION_PRODUCT_IDS.

// This constant identifies a free subscription. // E.g. @"com.example.MyBook.subscription.free" #define FREE_SUBSCRIPTION_PRODUCT_ID @"" // This constant identifies one or more auto-renewable subscriptions. // E.g.: // #define AUTO_RENEWABLE_SUBSCRIPTION_PRODUCT_IDS [NSArray arrayWithObjects: // @"com.example.MyBook.subscription.3months", // @"com.example.MyBook.subscription.6months", // nil] #define AUTO_RENEWABLE_SUBSCRIPTION_PRODUCT_IDS [NSArray arrayWithObjects: nil] #endif

!! ibeeBlue Mobile !

! !

Revista Desarrolla

! !

Simplemente remplaza el nombre del dominio por el que se creo anteriormente. Los endpoints de la API con los que se comunica la app son:

NEWSSTAND_MANIFEST_URL PURCHASE_CONFIRMATION_URL PURCHASES_URL POST_APNS_TOKEN_URL

!! ibeeBlue Mobile !