Come costruire un backend per Flutter?

introduzione in questo tutorial, imparerai come costruire un backend per flutter utilizzando back4app, un backend open source e affidabile come servizio (baas) esploreremo l'integrazione delle funzionalità essenziali di back4app—come la gestione del database, le cloud functions, le api restful, le api graphql e l'autenticazione degli utenti—nel tuo progetto flutter scoprirai anche come gestire aggiornamenti in tempo reale utilizzando le live queries utilizzando i potenti server backend di back4app, puoi saltare gran parte della configurazione manuale e concentrarti sulla creazione di un'app flutter dinamica questa guida mostrerà agli sviluppatori flutter come impostare una struttura backend sicura, scalabile e robusta che comunica senza sforzo con il lato client metteremo anche in evidenza i vantaggi di lasciare che back4app gestisca il lavoro pesante—come l'hosting, l'autenticazione degli utenti e la logica del server—così puoi beneficiare di funzionalità come il ridimensionamento automatico, la sicurezza avanzata e la manutenzione semplificata se hai un progetto flutter e vuoi risparmiare innumerevoli ore di configurazione del backend, questo è il posto giusto per iniziare alla fine di questo tutorial, comprenderai il tipo di backend che puoi creare con back4app e sarai pronto ad estendere i tuoi servizi backend per un'applicazione pronta per la produzione o integrare funzionalità più complesse, come api esterne e autenticazione avanzata degli utenti iniziamo! requisiti per completare questo tutorial, avrai bisogno di 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 flutter di base assicurati di avere il flutter sdk https //docs flutter dev/get started/install installato e configurato inoltre, conferma di avere un ide (come android studio o vs code) configurato per flutter ambiente di programmazione dart di solito questo viene installato insieme a flutter assicurati di poter importare pacchetti dart senza errori familiarità con i fondamenti di flutter documentazione ufficiale di flutter https //docs flutter dev se sei nuovo in flutter, rivedi la documentazione ufficiale o un tutorial per principianti prima di iniziare assicurati di avere tutti questi requisiti in ordine avere il tuo progetto back4app configurato e il tuo ambiente flutter locale impostato ti aiuterà a seguire più facilmente passo 1 – creare un nuovo progetto su back4app e connettersi crea un nuovo progetto il primo passo per costruire il tuo backend flutter su back4app è creare un nuovo progetto se non ne hai già creato uno, 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, “flutter backend tutorial”) una volta creato il progetto, lo vedrai elencato nel tuo dashboard di back4app questo progetto sarà la base per tutte le configurazioni del backend di cui discuteremo installa e inizializza il parse sdk nella tua app flutter back4app si basa sulla parse platform per gestire i tuoi dati, aggiornamenti in tempo reale, autenticazione degli utenti e altro ancora per collegare il tuo progetto flutter a back4app, segui questi passaggi aggiungi il parse flutter sdk alla tua app dependencies parse server sdk flutter ^4 0 0 importa il pacchetto parse nel tuo main dart (o dove inizializzi la tua app) import 'package\ parse server sdk flutter/parse server sdk flutter dart'; import 'package\ flutter/material dart'; void main() async { widgetsflutterbinding ensureinitialized(); const keyapplicationid = 'your application id'; const keyparseserverurl = 'https //parseapi back4app com'; const keyclientkey = 'your client key'; // initialize parse with debug set to true await parse() initialize( keyapplicationid, keyparseserverurl, clientkey keyclientkey, autosendsessionid true, debug true, ); runapp(const myapp()); } class myapp extends statelesswidget { const myapp({key? key}) super(key key); @override widget build(buildcontext context) { return materialapp( title 'flutter + back4app example', theme themedata(primaryswatch colors blue), home const scaffold( body center( child text('hello from flutter + back4app!'), ), ), ); } } nel tuo dashboard di back4app, vai alla sezione sicurezza e chiavi per trovare il tuo id applicazione , chiave client , e url del server parse sostituisci i segnaposto sopra con le tue credenziali con questa inizializzazione, ogni richiesta dalla tua app flutter è instradata in modo sicuro alla tua istanza di back4app ricorda che la chiave master non dovrebbe mai essere utilizzata sul lato client della tua app flutter se hai bisogno della chiave master, conservala sul server o in un ambiente sicuro passo 2 – configurazione del database creazione di un modello di dati una volta che la tua app flutter è connessa a back4app, puoi iniziare a progettare il tuo schema di database puoi farlo manualmente dal dashboard di back4app naviga nella sezione “database” nel tuo dashboard crea una nuova classe (ad esempio, “todo”), e aggiungi colonne pertinenti (ad esempio, titolo, completato) back4app fornisce anche un agente ai per aiutare con la creazione automatica dello schema apri l'agente ai dal tuo dashboard dell'app o dal menu descrivi il tuo modello di dati in linguaggio semplice (ad es , “crea una nuova app todo con uno schema di classe completo ”) lascia che l'agente ai crei lo schema per te questo semplifica la configurazione dell'architettura dei dati se desideri che i campi vengano creati automaticamente, puoi semplicemente iniziare a salvare oggetti dalla tua app—parse supporta la creazione di schemi al volo creare un modello di dati utilizzando l'agente ai se scegli di utilizzare l'agente ai di back4app, basta fornire una breve descrizione e costruirà o suggerirà uno schema per te questo è un ottimo modo per accelerare la fase iniziale di modellazione dei dati del tuo progetto flutter leggere e scrivere dati utilizzando flutter parse sdk di seguito è riportato un semplice esempio che dimostra come creare e recuperare oggetti utilizzando il parse flutter sdk import 'package\ parse server sdk flutter/parse server sdk flutter dart'; future\<void> createtodoitem(string title, bool iscompleted) async { final todo = parseobject('todo') set('title', title) set('iscompleted', iscompleted); final response = await todo save(); if (response success && response result != null) { print('todo saved successfully ${response result}'); } else { print('error saving todo ${response error? message}'); } } future\<list\<parseobject>?> fetchtodos() async { final querybuilder\<parseobject> querytodo = querybuilder\<parseobject>(parseobject('todo')); final response = await querytodo query(); if (response success && response results != null) { print('fetched todo items ${response results}'); return response results as list\<parseobject>; } else { print('error fetching todos ${response error? message}'); return null; } } con questo, puoi interagire direttamente con il tuo database back4app dalla tua app flutter basta chiamare createtodoitem('feed the cat', false) o fetchtodos() per scrivere e leggere dati lettura e scrittura dei dati utilizzando l'api rest se hai bisogno di integrarti con altri servizi o preferisci un approccio più tradizionale, puoi comunque utilizzare l'api rest di back4app 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 lettura e scrittura dei dati utilizzando l'api graphql back4app offre anche un endpoint graphql mutation { createtodo(input { fields { title "clean the house" iscompleted false } }) { todo { objectid title iscompleted } } } questo ti offre flessibilità per costruire l'approccio che funziona meglio per la tua app flutter lavorare con le query live back4app fornisce query live in modo da poter ricevere aggiornamenti in tempo reale sui tuoi dati abilita le query live nel pannello di controllo di back4app (impostazioni del server) e poi utilizza il client flutter parse livequery import 'package\ parse server sdk flutter/parse server sdk flutter dart'; import 'package\ parse server sdk flutter/live query dart'; future\<void> subscribetotodos() async { final livequery = livequery(); final query = querybuilder\<parseobject>(parseobject('todo')); subscription subscription = await livequery client subscribe(query); subscription on(livequeryevent create, (value) { print('new todo created $value'); }); subscription on(livequeryevent update, (value) { print('todo updated $value'); }); subscription on(livequeryevent delete, (value) { print('todo deleted $value'); }); } con questa sottoscrizione, puoi ascoltare le modifiche ai dati mentre accadono questo è fantastico per costruire app collaborative in cui più utenti vedono aggiornamenti di dati in tempo reale una volta attivato il hot reload, la tua sottoscrizione rimarrà attiva a meno che l'app non venga riavviata passo 3 – applicare la sicurezza con acl e clp cosa sono acl e clp? back4app utilizza acl (liste di controllo degli accessi) e clp (permessi a livello di classe) per limitare chi può leggere o scrivere dati sia a livello di oggetto che di classe questo strato garantisce che i tuoi dati siano protetti da accessi non autorizzati impostare i permessi a livello di classe nel tuo dashboard di back4app, vai a database e seleziona una classe (ad esempio, “todo”) naviga a class level permissions imposta i valori predefiniti (ad esempio, solo gli utenti autenticati possono creare nuovi oggetti) configurare le acl nel codice puoi anche applicare le acl a livello di oggetto dal codice flutter import 'package\ parse server sdk flutter/parse server sdk flutter dart'; future\<void> createprivatetodo(parseuser owneruser, string title) async { final todo = parseobject('todo') set('title', title); final acl = parseacl(owner owneruser); acl setpublicreadaccess(allowed false); acl setpublicwriteaccess(allowed false); todo setacl(acl); final response = await todo save(); if (response success) { print('private todo saved '); } else { print('error ${response error? message}'); } } combinando clp e acl, puoi garantire che solo le persone o i ruoli giusti possano accedere o modificare dati specifici passo 4 – scrivere funzioni di cloud code perché cloud code? il cloud code ti consente di eseguire logica lato server senza dover configurare manualmente alcun server backend questo è perfetto per convalidare i dati, integrarsi con servizi esterni o applicare determinate regole nel tuo backend come servizio (baas) funzione di esempio ecco un esempio di cloud function che calcola la lunghezza di un testo // main js in your cloud code parse cloud define('calculatetextlength', async (request) => { const { text } = request params; if (!text) { throw new error('no text provided'); } return { length text length }; }); puoi distribuire questo codice tramite il back4app cli o nel dashboard della tua app sotto cloud code distribuzione utilizzando il back4app cli b4a configure accountkey b4a deploy utilizzando il dashboard nel dashboard della tua app, vai su cloud code > funzioni incolla il codice javascript clicca distribuisci chiamare il cloud code da flutter import 'package\ parse server sdk flutter/parse server sdk flutter dart'; future\<void> gettextlength(string text) async { final function = parsecloudfunction('calculatetextlength'); final params = \<string, dynamic>{'text' text}; final parseresponse result = await function execute(parameters params); if (result success && result result != null) { print('text length ${result result\['length']}'); } else { print('error calling cloud code ${result error? message}'); } } questo approccio sicuro garantisce che la logica sensibile rimanga sul server, mentre la tua app flutter effettua semplicemente richieste passo 5 – configurazione dell'autenticazione abilita l'autenticazione utente back4app utilizza la parse user classe per gestire la registrazione e il login degli utenti per impostazione predefinita, parse si occupa dell'hashing delle password, dei token di sessione e dello storage sicuro import 'package\ parse server sdk flutter/parse server sdk flutter dart'; future\<void> signupuser(string username, string password, string email) async { final user = parseuser(username, password, email); final response = await user signup(); if (response success) { print('user signed up successfully!'); } else { print('sign up error ${response error? message}'); } } future\<void> loginuser(string username, string password) async { final user = parseuser(username, password, null); final response = await user login(); if (response success) { print('user logged in ${response result}'); } else { print('login error ${response error? message}'); } } login sociale back4app supporta integrazioni con google, apple, facebook e altro ogni fornitore ha un approccio specifico e potrebbe richiedere librerie aggiuntive (ad esempio, per l'accesso con facebook o google) puoi quindi chiamare await parseuser loginwith('facebook', \<string, dynamic>{ 'id' 'user facebook id', 'access token' 'facebook access token', 'expiration date' 'date' }); regola i parametri secondo la documentazione del fornitore passo 6 – gestione dello storage dei file impostazione dello storage dei file puoi memorizzare immagini, documenti o altri file multimediali utilizzando parsefile back4app protegge questi file e fornisce un url per il recupero import 'dart\ io'; import 'package\ parse server sdk flutter/parse server sdk flutter dart'; import 'package\ image picker/image picker dart'; future\<void> uploadimage() async { final picker = imagepicker(); final xfile? pickedfile = await picker pickimage(source imagesource gallery); if (pickedfile == null) { print('no file selected '); return; } final parsefile = parsefile(file(pickedfile path)); final response = await parsefile save(); if (response success) { print('file saved ${parsefile url}'); } else { print('error uploading file ${response error? message}'); } } considerazioni sulla sicurezza puoi definire chi ha accesso ai file (pubblico, utenti autenticati o riservato) combinando la sicurezza a livello di file con le acl questo garantisce che i dati del tuo file rimangano al sicuro passo 7 – verifica email e ripristino password perché sono importanti la verifica dell'email conferma che un utente possiede l'indirizzo email fornito, mentre i flussi di ripristino della password migliorano l'esperienza dell'utente e la sicurezza configurazione del dashboard vai alle impostazioni email della tua app nel dashboard di back4app abilita verifica email e ripristino password configura i modelli email o il tuo dominio personalizzato se necessario queste impostazioni consentono alla tua app flutter di gestire automaticamente i controlli di proprietà degli utenti e il recupero della password implementazione in flutter final user = parseuser('testuser', 'password123', 'test\@example com'); final signupresponse = await user signup(); if (signupresponse success) { // the user will receive a verification email } // for password reset final resetresponse = await parseuser requestpasswordreset('test\@example com'); if (resetresponse success) { print('reset email sent successfully!'); } passo 8 – pianificazione dei compiti con cloud jobs cloud jobs potresti voler pianificare compiti ricorrenti (come la pulizia dei dati obsoleti o l'invio di email periodiche) i cloud jobs ti permettono di fare proprio questo // 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); const oldtodos = await query find({ usemasterkey true }); await parse object destroyall(oldtodos, { usemasterkey true }); return `deleted ${oldtodos length} old todos `; }); distribuisci questo codice, poi vai su impostazioni app > impostazioni server > lavori in background nel tuo dashboard di back4app per programmarlo passo 9 – integrazione dei webhook cosa sono i webhook? i webhook consentono alla tua app back4app di inviare richieste http a un servizio esterno quando si verificano determinati eventi (come il salvataggio di un nuovo oggetto) questo è ideale per l'integrazione con strumenti di terze parti vai su altro > webhooks nel tuo dashboard di back4app e aggiungi webhook imposta il tuo endpoint e i trigger (ad es , “nuovo record in todo”) puoi anche configurare manualmente i webhook nel cloud code effettuando richieste http nei trigger beforesave o aftersave passo 10 – esplorare il pannello di amministrazione di back4app dove trovarlo l' app di amministrazione di back4app è un'interfaccia user friendly che consente ai membri del team non tecnici di gestire i dati (operazioni crud, attività sui dati, ecc ) senza dover aprire il dashboard di parse vai a dashboard app > altro > app di amministrazione clicca su abilita app di amministrazione creerai un utente amministratore, sceglierai un sottodominio e accederai con le credenziali appena create l'app di amministrazione aiuta con revisioni e modifiche rapide dei dati conclusione in questo tutorial, hai imparato come costruire un backend per flutter utilizzando back4app e il parse flutter sdk hai creato classi, memorizzato dati, configurato query in tempo reale, applicato sicurezza con acl e clp, scritto cloud functions, programmato attività, integrato webhook ed esplorato il pannello di amministrazione di back4app questo approccio accelera lo sviluppo permettendoti di concentrarti sul lato client di flutter piuttosto che su una complessa configurazione del server la stringa finale che hai ora è un backend funzionante e sicuro che sfrutta api restful, autenticazione degli utenti e facile manipolazione dei dati puoi integrare funzionalità più avanzate in qualsiasi momento—come ulteriori cloud functions, chiamate api esterne o ruoli personalizzati prossimi passi vai in produzione implementa caching avanzato, analisi o controlli di accesso basati sui ruoli estendi la tua app integra servizi di terze parti o costruisci più cloud functions per logica aziendale specializzata consulta la documentazione di back4app esplora sicurezza avanzata, ottimizzazione delle prestazioni, analisi dei log e altro scopri di più dai un'occhiata ai tutorial per app di chat dal vivo, servizi basati sulla posizione o strutture dati più complesse combinali con il tuo progetto flutter per casi d'uso reali continuando a perfezionare questa configurazione, trasformerai la tua app flutter in una soluzione potente e scalabile costruita su un robusto servizio backend buon coding!