Symfony2 e singole applicazioni pagina web utilizzando un framework come AngularJS

Question

(Se questo non è il posto giusto per pubblicare questo tipo di domanda Sarei felice di inviare da qualche altra parte)

Sto cercando di costruire un sistema interattivo applicazione web per gestire le risorse aziendali. Ho esperienza con Symfony2 ma mi piace colpire un muro con questa nuova applicazione.

Mi piacerebbe rendere questa applicazione abbastanza interattiva sul lato client. Quasi una singola pagina web completa. Le mie precedenti applicazioni web normalmente usavano solo un tipico pattern MVC con pagine CRUD.

In quei semplici applicazioni avrei

/employees/ 
/employees/create 
/employees/detail/45 
/employees/update/45 
/employees/delete/45 

Utilizzando symfony in questo tipo di applicazione mi avrebbe dato un sacco di vantaggi:

• Routing
• Security (CSRF gettoni)
• FormTypes e gestione moduli
• convalida
• Integrazione con Doctrine
• Ramoscello

Soprattutto funzionalità simile in Twig è molto rinfrescante (dato che i miei modelli sono stati costruire come entità Doctrine):

<p>{{ employee.getCurrentTask().description }}</p> 

Il problema che Ora sto affrontando il fatto che mi sembra che Symfony2 non sia realmente costruito per le singole applicazioni di pagine web. Non appena cerco di aggiungere alcune funzionalità Ajax sono di fronte a questi problemi:

• CSRF token non valida
• Troppa logica di presentazione non riutilizzabile vista/in jQuery
• Aggiunta di data-attributi html per ottenere id ecc.

Ho quindi esaminato Knockout.js e Angularjs ma poi mi sento di perdere tutti i vantaggi di Doctrine e Twig. Devo ricostruire comunque i miei modelli dal lato client e devo mantenerli in due luoghi diversi allora.

Così mi è venuta questa idea: (? FOSRestBundle forse)

• modelli Usa Symfony2 e controllori a persistere i dati nel database, ma lasciare che i controller in symfony spedice appena JSON e ricevere JSON
• Usa un framework come AngularJS o KnockoutJS per ricostruire i dati JSON sul lato client per utilizzare il binding a 2 vie.

Ma allora come dovrei affrontare le questioni come Doctrine2 relazioni, Form Validation, CSRF che Symfony già risolto ma sono inutilizzabili se io uso un frontend quadro js?

Tutti i suggerimenti sono benvenuti!

Answer 1

Alcune parole su JSON, serializzazione e modelli

Simon, ho affrontato esattamente le stesse domande e problemi. Prima come ken già menzionato. Non è necessario ricostruire alcun modello. Meglio usare FosRestBundle e/o JMS Serializer. Trasforma le entità con le relazioni in oggetti JSON. Questi oggetti vengono trasferiti tramite API al frontend e si può lavorare con loro, proprio come in ramoscello, quando si utilizza angular.js come questo

{[{ user.username }]} 

è come stessi in ramoscello. Ma ricorda che devi impostare parentesi personalizzate per angolari perché per impostazione predefinita usa la stessa cosa di twig.

Routing

Lei parla di una singola applicazione pagina, in modo di routing di symfony è mantenuto su un livello basso per avere pochi refresh della pagina. Invece si deve utilizzare il routing del quadro frontend, perché io sono solo familiarità con angular.js, faccio un esempio angolare:

app.config(function($routeProvider, $interpolateProvider) { 

    //here you go, custom brackets 
    $interpolateProvider.startSymbol('{[{'); 
    $interpolateProvider.endSymbol('}]}'); 

    $routeProvider.when('/user', { 
     controller: UserController, 
     templateUrl: Routing.generate('suser_list') 
    }).when('/ticket', { 
     controller: TicketController, 
     templateUrl: Routing.generate('ticket_list') 
    }); 
}); 

Quando si colpisce un link come

<a href="#/ticket">Go to tickets</a> 

AngularJs saprà quale controller di frontend attivare. Cose davvero grandiose, senza ricaricare la pagina. Dai un'occhiata anche allo FosJSRoutingBundle. Esso consente di generare percorsi di symfony in JavaScript, li uso per collegare i controllori js con modelli HTML in cui i dati è premuto.

FormTypes, maneggia la forma, la convalida

Beh, quando si utilizza un quadro frontend come angularjs, i tuoi tipi di forma symfony sono piuttosto inutili. Ma non sono sicuro. Ricorda che i dati sono spinti e tirati via api come json, penso che questo sarebbe un lavoro duro per i tipi di moduli per gestire questo tipo di compexity.

Per la convalida è possibile utilizzare la convalida live di angular o la convalida di symfony nel back-end, nessun problema. Potrebbe essere una buona cosa utilizzare la convalida sia lato client che lato server.

Ramoscello

Twig è fuori gara. Tutti i dati sono resi sul lato client, e non pre rendering sul lato server come con twig. Ma questo è solo il caso se la tua applicazione è davvero un'applicazione a singola pagina. Ovviamente puoi usare twig, ma si aggiornerà solo se ricarichi l'intera pagina.

Integrazione con Doctrine

È comunque possibile utilizzare la dottrina nel backend. Hai una domanda specifica riguardante la dottrina e la SPA?

Answer 2

Non è necessario ricostruire il modello nel client. Normalmente creo solo un servizio in angularjs che fornisce dati json. La manipolazione dei dati avviene ancora sul lato server usando ajax.

Per le forme che richiedono csrf, di solito invio semplicemente il codice html restituito da twig tramite json. Oppure puoi serializzare $ form-> createView() con serializzatore jms. Tuttavia avrete bisogno di qualche script client per trasformare i dati JSON in veri e propri controlli dei moduli.