Come costruire un backend per NativeScript?

introduzione in questo tutorial, imparerai come costruire un backend per nativescript utilizzando back4app, una piattaforma open source che semplifica lo sviluppo del backend per le app mobili esploreremo l'integrazione delle funzionalità essenziali di back4app—come la gestione del database, le funzioni cloud code, gli endpoint api rest e graphql, l'autenticazione degli utenti e le query in tempo reale (live queries)—per creare un backend sicuro e scalabile per le tue app nativescript scoprirai anche come back4app riduce drasticamente i tempi di configurazione rispetto alle configurazioni manuali di server e database esploreremo meccanismi di sicurezza avanzati, la pianificazione di attività con cloud jobs e l'uso di webhook per connettersi a servizi di terze parti entro la fine di questa guida, avrai un backend flessibile che sfrutta nativescript core, che alimenta le soluzioni mobili cross platform di nativescript con questa base, sarai pronto a integrare la tua logica personalizzata o api esterne secondo necessità questo sarà un passo importante verso lo sviluppo di app nativescript pronte per la produzione requisiti un account back4app e un nuovo progetto back4app iniziare con back4app https //www back4app com/docs/get started/new parse app se non hai un account, puoi crearne uno gratuitamente segui la guida sopra per preparare il tuo progetto ambiente di sviluppo nativescript di base puoi configurarlo utilizzando il nativescript cli o un altro flusso di lavoro preferito guida per iniziare con nativescript https //docs nativescript org/environment setup node js (versione 14 o superiore) installato avrai bisogno di node js per installare pacchetti npm e eseguire il nativescript cli installare node js https //nodejs org/en/download/ familiarità con javascript e nativescript core documentazione ufficiale di nativescript https //docs nativescript org/ se sei nuovo a nativescript, rivedi la documentazione ufficiale o un tutorial per principianti prima di iniziare assicurati di avere tutti questi requisiti in atto prima di iniziare avere il tuo progetto back4app configurato e il tuo ambiente locale nativescript pronto ti aiuterà a seguire più facilmente passo 1 – configurazione del progetto back4app crea un nuovo progetto il primo passo per costruire il tuo backend nativescript su back4app è creare un nuovo progetto se non lo hai già fatto, segui questi passaggi accedi al tuo account back4app clicca sul pulsante “nuova app” nel tuo dashboard di back4app dai un nome alla tua app (ad esempio, “nativescript backend tutorial”) dopo aver creato il progetto, lo vedrai elencato nel tuo dashboard di back4app questo progetto servirà come base per tutte le configurazioni del backend trattate in questo tutorial collegare il parse sdk back4app utilizza la parse platform per gestire i tuoi dati, la funzionalità in tempo reale, l'autenticazione degli utenti e altro ancora per collegare la tua app nativescript a back4app, installa il parse pacchetto npm e inizializzalo con le credenziali che ottieni dal tuo dashboard di back4app recupera le tue chiavi parse nel tuo dashboard di back4app, vai alla sezione “impostazioni app” o “sicurezza e chiavi” della tua app cerca il tuo id applicazione , chiave javascript , e url del server parse (nel formato https //parseapi back4app com ) installa il parse sdk npm install parse poi, inizializza parse in un file di configurazione o nel tuo file di ingresso principale (ad esempio, app js ) ad esempio, potresti creare un file chiamato parseconfig js in un progetto basato su nativescript src/parseconfig js import parse from 'parse'; // replace the placeholders with your back4app credentials parse initialize('your application id', 'your javascript key'); parse serverurl = 'https //parseapi back4app com'; export default parse; ogni volta che hai bisogno di accedere a parse nella tua app nativescript, basta importare questo file completando questo passaggio, hai stabilito una connessione sicura tra il tuo frontend nativescript e il backend back4app, semplificando le operazioni sui dati passo 2 – configurazione del database salvataggio e query dei dati con il tuo progetto back4app pronto e il parse sdk integrato, puoi salvare e interrogare i dati dalla tua app nativescript di seguito è riportato un esempio che utilizza la classe parse object per salvare e recuperare un elenco di elementi // example create a task item import parse from ' /parseconfig'; async function createtaskitem(title, iscompleted) { const task = parse object extend('task'); const task = new task(); task set('title', title); task set('iscompleted', iscompleted); try { const savedtask = await task save(); console log('task saved successfully ', savedtask); return savedtask; } catch (error) { console error('error saving task ', error); } } // example query all task items async function fetchtasks() { const task = parse object extend('task'); const query = new parse query(task); try { const results = await query find(); console log('fetched task items ', results); return results; } catch (error) { console error('error fetching tasks ', error); } } puoi anche utilizzare l'api rest di back4app se preferisci chiamate http dirette 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 supplies", "iscompleted" false}' \\ https //parseapi back4app com/classes/task oppure usa graphql mutation { createtask(input { fields { title "clean the house" iscompleted false } }) { task { objectid title iscompleted } } } questa flessibilità rende conveniente costruire funzionalità backend per le tue app nativescript attraverso il parse sdk, rest o gli endpoint api graphql progettazione dello schema e tipi di dati per impostazione predefinita, parse può creare automaticamente schemi al volo, oppure puoi definire le tue classi e tipi di dati nel dashboard di back4app vai alla sezione “database” nel tuo dashboard di back4app crea una nuova classe (ad esempio, “task”) e aggiungi colonne come titolo (string) e iscompleted (boolean) back4app supporta tipi di dati come string , number , boolean , object , date , file , pointer , array , relation , geopoint , e polygon puoi lasciare che parse crei queste colonne quando salvi per la prima volta un oggetto o definirle per avere maggiore controllo utilizzare l'ai agent di back4app può anche aiutarti a generare automaticamente schemi apri l'ai agent nel tuo app dashboard descrivi il tuo modello di dati desiderato (ad es , “per favore crea una nuova classe task per app mobili con i campi iscompleted e duedate ”) lascia che l'agente crei lo schema automaticamente dati relazionali se desideri dati relazionali—come un oggetto categoria che punta a più task —usa puntatori o relazioni in parse // linking a task to a category with a pointer async function createtaskforcategory(categoryobjectid, title) { const task = new parse object('task'); const categorypointer = new parse object('category'); categorypointer id = categoryobjectid; task set('title', title); task set('category', categorypointer); try { return await task save(); } catch (err) { console error('error creating task with category relationship ', err); } } // including the pointer data in a query const query = new parse query('task'); query include('category'); const taskswithcategory = await query find(); questo approccio ti aiuta a recuperare dati completi per un task e la sua categoria correlata in un'unica query query live per aggiornamenti in tempo reale, abilita query live nelle impostazioni del server nel dashboard di back4app gli sviluppatori di nativescript possono iscriversi ai cambiamenti in una classe specifica aggiorna la tua configurazione parse per includere un url del server live query src/parseconfig js import parse from 'parse'; // replace the placeholders with your back4app credentials parse initialize('your application id', 'your javascript key'); parse serverurl = 'https //parseapi back4app com'; parse livequeryserverurl = 'wss\ //your subdomain here b4a io'; export default parse; e poi iscriviti agli eventi in tempo reale import parse from ' /parseconfig'; async function subscribetotasks(callback) { const query = new parse query('task'); const subscription = await query subscribe(); subscription on('create', (newtask) => { console log('new task created ', newtask); callback('create', newtask); }); subscription on('update', (updatedtask) => { console log('task updated ', updatedtask); callback('update', updatedtask); }); subscription on('delete', (deletedtask) => { console log('task deleted ', deletedtask); callback('delete', deletedtask); }); return subscription; } questa iscrizione aggiorna automaticamente la tua interfaccia utente ogni volta che una task viene aggiunta, modificata o rimossa—perfetta per app nativescript collaborative in tempo reale passo 3 – applicare la sicurezza con acl e clp meccanismo di sicurezza back4app back4app incorpora liste di controllo degli accessi (acl) e permessi a livello di classe (clp) per proteggere i tuoi dati questi modelli di sicurezza ti consentono di controllare l'accesso in lettura/scrittura sia a livello di classe che di oggetto liste di controllo degli accessi (acl) un acl imposta i permessi per ogni oggetto ad esempio, per dare solo al proprietario accesso in lettura e scrittura async function createprivatetask(title, owneruser) { const task = parse object extend('task'); const task = new task(); task set('title', title); const acl = new parse acl(owneruser); acl setpublicreadaccess(false); acl setpublicwriteaccess(false); task setacl(acl); try { return await task save(); } catch (err) { console error('error saving private task ', err); } } questo garantisce che solo l'utente specificato possa modificare o leggere l'oggetto permessi a livello di classe (clp) i clp impostano i permessi predefiniti per un'intera classe apri il database in back4app e seleziona la classe pertinente accedi ai permessi a livello di classe regola i permessi per il pubblico, gli utenti autenticati o ruoli specifici secondo necessità combinare acl e clp offre un modello di sicurezza robusto per le app nativescript per ulteriori informazioni, vedere linee guida sulla sicurezza delle app https //www back4app com/docs/security/parse security passo 4 – scrivere e distribuire funzioni cloud il cloud code ti consente di eseguire codice javascript personalizzato sul lato server, quindi non è necessario mantenere l'infrastruttura da solo questo è ideale per aggiungere logica avanzata o integrazioni solo server nel tuo backend nativescript come funziona di solito posizioni il tuo cloud code (funzioni javascript, trigger e eventuali moduli npm richiesti) in un main js file poi lo distribuisci su back4app e viene eseguito nell'ambiente del parse server senza configurazione aggiuntiva del server esempio di struttura 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('task', (request) => { const task = request object; if (!task get('title')) { throw new error('task must have a title'); } }); puoi installare e utilizzare pacchetti npm come axios per le richieste http questo approccio consente una vasta gamma di integrazioni, dai gateway di pagamento alle api esterne, tutto dietro la sicurezza della tua app back4app casi d'uso tipici logica aziendale calcoli automatici, trasformazioni di dati o aggiornamenti di stato validazioni dei dati assicurati che i campi obbligatori siano presenti prima del salvataggio trigger esegui codice quando i dati vengono creati, aggiornati o eliminati integrazioni collega servizi esterni per pagamenti, analisi o messaggistica applicazione della sicurezza valida i dati in arrivo o i ruoli degli utenti prima di procedere distribuisci la tua funzione ecco una semplice funzione che calcola la lunghezza del testo main js parse cloud define('calculatetextlength', async (request) => { const { text } = request params; if (!text) { throw new error('no text provided'); } return { length text length }; }); distribuzione tramite https //www back4app com/docs/local development/parse cli installa il cli curl https //raw\ githubusercontent com/back4app/parse cli/back4app/installer sh | sudo /bin/bash per windows, scarica il b4a exe https //github com/back4app/parse cli/releases/download/release 3 3 1/b4a exe file dalla pagina delle versioni https //github com/back4app/parse cli/releases configura la tua chiave account b4a configure accountkey distribuisci il tuo codice cloud b4a deploy distribuzione tramite il dashboard vai a cloud code > functions nel tuo dashboard incolla il tuo codice funzione in main js clicca su deploy chiamare la tua funzione dalla tua app nativescript utilizzando il parse sdk import parse from ' /parseconfig'; async function gettextlength(text) { try { const result = await parse cloud run('calculatetextlength', { text }); console log('text length ', result length); } catch (err) { console error('error calling cloud function ', err); } } puoi anche chiamarlo utilizzando rest o graphql curl x post \\ h "x parse application id your app id" \\ h "x parse rest api key your rest api key" \\ h "content type application/json" \\ d '{"text" "hello back4app"}' \\ https //parseapi back4app com/functions/calculatetextlength mutation { calculatetextlength(input { text "hello graphql" }) { result } } questo ti offre un modo flessibile per integrare la logica lato server nelle tue app mobili basate su nativescript passo 5 – configurazione dell'autenticazione utente autenticazione utente in back4app back4app utilizza la parse user classe per gestire l'autenticazione, che include l'hashing delle password, i token di sessione e altro ancora questo elimina gran parte della complessità associata alla gestione degli account utente impostazione dell'autenticazione utente nella tua app nativescript, puoi creare un nuovo utente import parse from ' /parseconfig'; async function signupuser(username, password, email) { const user = new parse user(); user set('username', username); user set('password', password); user set('email', email); try { await user signup(); console log('user signed up successfully!'); } catch (error) { console error('error signing up user ', error); } } async function loginuser(username, password) { try { const user = await parse user login(username, password); console log('user logged in ', user); } catch (error) { console error('error logging in user ', error); } } un esempio rest potrebbe apparire così curl x get \\ h "x parse application id your app id" \\ h "x parse rest api key your rest api key" \\ g \\ \ data urlencode 'username=alice' \\ \ data urlencode 'password=secret123' \\ https //parseapi back4app com/login gestione delle sessioni dopo aver effettuato il login, parse assegna un token di sessione all'utente per controllare l'utente attualmente connesso const currentuser = parse user current(); if (currentuser) { console log('logged in user ', currentuser getusername()); } else { console log('no user is logged in'); } const currentuser = parse user current(); if (currentuser) { console log('logged in user ', currentuser getusername()); } else { console log('no user is logged in'); } disconnettersi è semplice await parse user logout(); integrazione del login sociale parse si integra anche con fornitori oauth come google o facebook la configurazione varia a seconda del fornitore, quindi consulta accedi con apple e altri https //www back4app com/docs/platform/sign in with apple per i dettagli ad esempio, con facebook const facebooklogin = async () => { try { const user = await parse facebookutils login('email'); console log(user existed() ? 'user logged in' 'user signed up and logged in'); } catch (error) { console error('error logging in with facebook ', error); } }; verifica email e ripristino password abilita queste funzionalità nel tuo dashboard di back4app naviga su impostazioni email nella tua app back4app abilita la verifica email e il ripristino della password configura i tuoi modelli email e l'indirizzo 'da' passo 6 – gestione dello storage dei file caricamento e recupero di file back4app supporta la gestione dei file tramite la parse file classe in nativescript, puoi caricare immagini o documenti in modo simile import parse from ' /parseconfig'; async function uploadimage(file) { const name = file name; const parsefile = new parse file(name, file); try { const savedfile = await parsefile save(); console log('file saved ', savedfile url()); return savedfile url(); } catch (err) { console error('error uploading file ', err); } } async function createphotoobject(file) { const photo = parse object extend('photo'); const photo = new photo(); const parsefile = new parse file(file name, file); photo set('imagefile', parsefile); return await photo save(); } puoi recuperare l'url del file dall'oggetto salvato const imagefile = photo get('imagefile'); const imageurl = imagefile url(); // use imageurl in your nativescript ui components sicurezza dei file parse server ti consente di configurare la sicurezza del caricamento dei file { "fileupload" { "enableforpublic" true, "enableforanonymoususer" true, "enableforauthenticateduser" true } } questo assicura che tu possa limitare o consentire i caricamenti di file in base alle tue preferenze di sicurezza passo 7 – pianificazione dei compiti con cloud jobs lavori nel cloud lavori nel cloud ti aiutano ad automatizzare compiti di routine, come rimuovere record obsoleti o inviare notifiche ad esempio // main js parse cloud job('cleanupoldtasks', async (request) => { const task = parse object extend('task'); const query = new parse query(task); 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 oldtasks = await query find({ usemasterkey true }); await parse object destroyall(oldtasks, { usemasterkey true }); return `deleted ${oldtasks length} old tasks `; } catch (err) { throw new error('cleanup error ' + err message); } }); distribuisci questo lavoro tramite cli o la dashboard nella dashboard di back4app > impostazioni del server > lavori in background , programmarlo per l'esecuzione giornaliera o a un intervallo di tua scelta passo 8 – integrazione dei webhook i webhook ti permettono di inviare richieste http a servizi esterni quando si verificano determinati eventi nella tua app, come nuovi record o registrazioni di utenti questo può essere utilizzato per integrarsi con slack, gateway di pagamento o piattaforme di analisi vai alla configurazione dei webhook nella tua dashboard di back4app e seleziona aggiungi webhook aggiungi il tuo endpoint url (ad es , https //your service com/webhook ) configura i trigger per classi o eventi specifici puoi anche definire webhook nel cloud code o chiamare api esterne direttamente nei trigger come beforesave o aftersave passo 9 – esplorare il pannello di amministrazione di back4app l' app di amministrazione di back4app è un'interfaccia user friendly e centrata sul modello per la gestione dei dati aiuta i team o gli utenti non tecnici a eseguire operazioni crud, creare dashboard personalizzate e gestire compiti a livello aziendale senza scrivere codice abilitare l'app di amministrazione nel tuo dashboard dell'app , clicca su altro > app di amministrazione abilita l'app di amministrazione crea un primo utente amministratore (nome utente/password) questa configurazione aggiunge il b4aadminuser ruolo e le classi associate ( b4asetting , b4amenuitem , ecc ) al tuo schema scegli un sottodominio, quindi accedi con le tue nuove credenziali di amministratore questo portale consente una rapida manipolazione dei dati senza lasciare un'interfaccia grafica—una grande soluzione per collaborare con membri del team che potrebbero non essere familiari con la programmazione conclusione seguendo questa guida, hai imparato come costruire un backend per nativescript utilizzando back4app e creato un backend sicuro per le tue app nativescript configurato un database con classi, schemi e relazioni implementato query in tempo reale per aggiornamenti live protetto i tuoi dati con acl e clp esteso la funzionalità con cloud code impostato l'autenticazione per la registrazione, il login e i token di sessione gestito caricamenti di file e recupero tramite parse file pianificato cloud jobs per compiti automatizzati e periodici creato webhook per integrazioni di terze parti utilizzato il pannello di amministrazione di back4app per la gestione dei dati senza codice questi passaggi formano una base solida per costruire app mobili open source e multipiattaforma con nativescript core continua a esplorare funzionalità avanzate, incorpora più endpoint api o integra la tua logica personalizzata per adattare il backend alle esigenze esatte della tua app prossimi passi scala le tue app nativescript ottimizzando le prestazioni, la memorizzazione nella cache e le regole di sicurezza esplora la gestione avanzata degli utenti come le autorizzazioni basate sui ruoli controlla la documentazione ufficiale di back4app per guide approfondite su sicurezza, registri e prestazioni sperimenta con integrazioni nel mondo reale come strumenti di pagamento o di analisi buon coding e goditi il flusso di lavoro di sviluppo semplificato che back4app offre!