Quickstarters
Feature Overview
¿Cómo construir un backend para jQuery?
39 min
introducción en este tutorial, aprenderás cómo construir un backend para jquery usando back4app integraremos las características esenciales de back4app gestión de bases de datos, cloud code, apis rest y graphql, autenticación de usuarios y consultas en tiempo real, para crear un backend seguro y escalable este backend se comunicará con tu frontend basado en jquery a través de llamadas ajax y otros métodos comunes de jquery el entorno intuitivo de back4app reduce el tiempo necesario para configurar servidores o bases de datos siguiendo unos pocos pasos simples, obtendrás experiencia práctica con acls, permisos a nivel de clase, modelado de datos, cargas de archivos y más al final de este tutorial, tendrás una base sólida para una aplicación completamente funcional basada en jquery conectada a un backend de back4app estarás listo para agregar lógica personalizada, integrar apis externas y asegurar tus datos con un control detallado requisitos previos para completar este tutorial, necesitarás una cuenta de back4app y un nuevo proyecto de back4app comenzando con back4app https //www back4app com/docs/get started/new parse app si no tienes una cuenta, puedes crear una gratis sigue la guía anterior para preparar tu proyecto entorno básico de jquery puedes descargar jquery desde el sitio web oficial https //jquery com/download/ node js (versión 14 o superior) instalado (opcional) aunque node js no es estrictamente necesario para jquery en un navegador, puede que lo necesites para ejecutar servidores de prueba locales o instalar paquetes npm si deseas hacer pruebas locales instalando node js https //nodejs org/en/download/ familiaridad con javascript y conceptos básicos de jquery documentación oficial de jquery https //api jquery com/ asegúrate de tener todos estos requisitos previos en su lugar antes de comenzar, para que puedas seguir sin problemas al construir tu front end basado en jquery y conectarlo a back4app paso 1 – configuración del proyecto de back4app crear un nuevo proyecto para comenzar tu proyecto de backend con jquery, crea un nuevo proyecto de back4app inicia sesión en tu cuenta de back4app haz clic en el botón “nueva app” en tu panel de back4app dale un nombre a tu app (por ejemplo, “jquery backend tutorial”) cuando se crea el proyecto, lo verás en tu panel de back4app esta será la base de tus configuraciones de backend para jquery conectar el sdk de parse back4app utiliza la plataforma parse para datos y características en tiempo real si deseas usar el sdk de parse directamente con jquery, puedes cargarlo como un script en tu html recupera tus claves de parse en el panel de control de back4app, abre “configuraciones de la aplicación” o “seguridad y claves” para encontrar id de aplicación clave de javascript url del servidor parse (usualmente https //parseapi back4app com ) incluye el sdk de parse en tu archivo html en un jquery entorno, puedes cargar jquery primero, luego parse, e interactuar con los objetos de parse en tus scripts esta conexión asegura que todas las llamadas de datos a tu backend de back4app pasen a través de la plataforma parse paso 2 – configurando la base de datos guardar y consultar datos después de integrar el sdk de parse, puedes guardar y recuperar datos de la base de datos de back4app aquí hay un ejemplo simple de cómo crear y recuperar objetos “todo” usando jquery y parse también puedes llamar a apis rest usando curl curl x post \ h "x parse application id your application id" \ h "x parse rest api key your rest api key" \ h "content type application/json" \ d '{"title" "buy groceries", "iscompleted" false}' \ https //parseapi back4app com/classes/todo o usa graphql mutation { createtodo(input { fields { title "clean the house" iscompleted false } }) { todo { objectid title iscompleted } } } diseño de esquema y tipos de datos en el panel de back4app ve a “base de datos ” crea una nueva clase (por ejemplo, “todo”) y añade columnas como título (string) y iscompleted (boolean) también puedes permitir que parse cree columnas automáticamente la primera vez que guardes un objeto usando el agente de ia back4app tiene un agente de ia para modelado de datos abre el agente de ia en el panel o menú de tu aplicación describe tu modelo de datos (por ejemplo, “crea una aplicación todo con un esquema de clase ”) deja que el agente de ia genere el esquema datos relacionales si tienes una categoría clase vinculada a muchos todo elementos, puedes usar punteros o relaciones consultas en vivo para actualizaciones en tiempo real en tu aplicación jquery habilitar consultas en vivo en tu panel de back4app bajo configuración del servidor inicializar una suscripción de consulta en vivo esta suscripción te notifica en tiempo real cada vez que se crea, actualiza o elimina un objeto “todo” paso 3 – aplicando seguridad con acls y clps mecanismo de seguridad de back4app acls (listas de control de acceso) y clps (permisos a nivel de clase) te permiten controlar quién puede leer y escribir datos a nivel de objeto o clase listas de control de acceso (acls) una acl se establece en objetos individuales para limitar el acceso permisos a nivel de clase (clps) los clps controlan los permisos predeterminados para toda una clase en tu panel de control de back4app , abre la sección de base de datos selecciona tu clase (por ejemplo, “todo”) ve a la pestaña de permisos a nivel de clase para configurar el acceso público, autenticado o basado en roles combina acls para la seguridad a nivel de objeto con clps para restricciones más amplias para más información, consulta directrices de seguridad de la aplicación https //www back4app com/docs/security/parse security paso 4 – escribir y desplegar funciones en la nube el código en la nube ejecuta javascript personalizado en el lado del servidor, permitiéndote agregar lógica de negocio, validaciones de datos o llamadas a apis externas cómo funciona coloca tu código en main js , despliega a back4app y deja que el servidor parse maneje la ejecución también puedes usar módulos de npm para lógica más compleja // main js const axios = require('axios'); parse cloud define('fetchexternaldata', async (request) => { const url = request params url; if (!url) { throw new error('url parameter is required'); } const response = await axios get(url); return response data; }); parse cloud beforesave('todo', (request) => { const todo = request object; if (!todo get('title')) { throw new error('todo must have a title'); } }); despliega tu función a través de la https //www back4app com/docs/local development/parse cli b4a deploy a través del dashboard en el dashboard de tu aplicación, ve a cloud code > functions copia/pega la función en main js haz clic en deploy llamando a tu función desde jquery, puedes llamar a una función en la nube así paso 5 – configuración de la autenticación de usuarios autenticación de usuarios en back4app back4app emplea la parse user clase para la autenticación el hashing de contraseñas, los tokens de sesión y el almacenamiento seguro se manejan automáticamente configurando la autenticación de usuarios gestión de sesiones puedes recuperar el usuario actual const currentuser = parse user current(); if (currentuser) { console log('logged in user ', currentuser getusername()); } else { console log('no user is logged in'); } cerrar sesión parse user logout(); integración de inicio de sesión social back4app admite google, facebook, apple y otros proveedores de oauth para más información, consulta la documentación de inicio de sesión social https //www back4app com/docs/platform/sign in with apple paso 6 – manejo del almacenamiento de archivos subiendo y recuperando archivos usa parse file para manejar las subidas puedes almacenar el archivo en una clase asignándolo a un campo const photo = parse object extend('photo'); const photo = new photo(); photo set('imagefile', parsefile); photo save(); recuperando la url del archivo const imagefile = photo get('imagefile'); const imageurl = imagefile url(); seguridad de archivos puedes gestionar quién puede subir archivos modificando la configuración de subida de archivos en parse server { "fileupload" { "enableforpublic" true, "enableforanonymoususer" true, "enableforauthenticateduser" true } } paso 7 – programación de tareas con trabajos en la nube trabajos en la nube puedes ejecutar tareas rutinarias, como eliminar datos antiguos // main js parse cloud job('cleanupoldtodos', async (request) => { const todo = parse object extend('todo'); const query = new parse query(todo); const now = new date(); const thirty days = 30 24 60 60 1000; const cutoff = new date(now thirty days); query lessthan('createdat', cutoff); try { const oldtodos = await query find({ usemasterkey true }); await parse object destroyall(oldtodos, { usemasterkey true }); return `deleted ${oldtodos length} old todos `; } catch (err) { throw new error('error during cleanup ' + err message); } }); en el panel de control, ve a configuración de la aplicación > configuración del servidor > trabajos en segundo plano para programarlo paso 8 – integración de webhooks webhooks permiten que tu aplicación envíe solicitudes http a un servicio externo cada vez que ocurren ciertos eventos ve a más > webhooks en tu panel de control de back4app agrega un nuevo webhook con tu endpoint externo configura disparadores para eventos como “nuevo registro en la clase todo ” puedes integrar slack o una pasarela de pago como stripe enviando datos de eventos a través de webhooks paso 9 – explorando el panel de administración de back4app la aplicación de administración de back4app ofrece una interfaz web no técnica para operaciones crud habilitando la aplicación de administración ir a app dashboard > más > admin app y hacer clic en “habilitar admin app” crear un primer usuario administrador , lo que crea automáticamente un nuevo rol (b4aadminuser) y clases en tu esquema elegir un subdominio para acceder a la aplicación de administración iniciar sesión usando tus nuevas credenciales de administrador una vez habilitada, esta aplicación de administración te permite gestionar datos o conceder acceso a los miembros del equipo sin necesidad de codificación conclusión en esta guía, aprendiste cómo construir un backend para jquery con back4app tú creaste un nuevo proyecto de back4app como tu base de backend configuraste una base de datos, incluyendo diseño de esquema y relaciones de datos usaste acls y clps para una seguridad más detallada desplegaste cloud code para lógica personalizada del lado del servidor configuraste autenticación de usuarios, almacenamiento de archivos y actualizaciones en tiempo real programaste trabajos en segundo plano e integraste webhooks para servicios externos exploraste el panel de administración de back4app para una gestión de datos más sencilla ahora estás equipado para extender esta configuración básica de jquery + back4app en una solución de producción completa continúa integrando características avanzadas como inicio de sesión social o reglas de seguridad más detalladas ¡disfruta construyendo tus aplicaciones escalables y basadas en datos! próximos pasos prepárate para producción agrega permisos avanzados basados en roles, estrategias de caché y optimización de rendimiento integra apis de terceros para pagos, mensajería o análisis explora la documentación de back4app profundiza en seguridad avanzada, registros o análisis crea aplicaciones del mundo real usa la simplicidad de jquery combinada con los poderosos servicios de backend de back4app