ASP.NET MVC Aggregate CSS / JS da più controller
-
05-07-2019 - |
Domanda
Abbiamo un'applicazione abbastanza complessa che precedentemente utilizzava WebForms. Stiamo riscrivendo pezzi di esso da zero usando MVC. La nostra applicazione è composta da una serie di widget, che insieme costituiscono la funzionalità dell'applicazione.
In WebForms abbiamo usato UserControls. Ogni UserControl registra i propri CSS e JavaScript mediante una raccolta che è stata memorizzata in HttpContext.Current.Items. Tale raccolta verrebbe quindi unita per generare come una singola richiesta. In genere ciò si verificherebbe nell'evento Page_Load e la pagina contenente visualizzerebbe quindi un tag di script che comprenderebbe tutti i JavaScript e CSS necessari per quella pagina.
Abbiamo avuto difficoltà a fare lo stesso in MVC. Stiamo utilizzando un numero di visualizzazioni all'interno di una pagina master per imitare i widget. Ogni widget ha il suo controller, quindi la funzionalità può essere sufficientemente separata. La pagina principale crea i widget sulla pagina utilizzando RenderAction dai futures MVC. Inizialmente utilizzavamo lo stesso metodo di registrazione per i file CSS / JS. Ogni controller registra i file richiesti in un'azione. I file sarebbero quindi contenuti nella raccolta HttpContext.Current.Items e verrebbero trasferiti alla pagina. Per facilitare questo, ho scritto un'estensione HtmlHelper per rendere i collegamenti / script alla pagina. Sembra così:
<%= Html.GetRegisteredCssFiles() %>
Il problema è che MVC utilizza un approccio più dall'alto verso il basso. Questa chiamata viene effettuata nel tag della pagina, ma le nostre successive chiamate a RenderAction avvengono di seguito. Quando viene chiamato RenderAction e i file richiesti sono registrati in HttpContext.Current.Items, il codice sopra è già stato eseguito. Pertanto, la raccolta non viene modificata al momento giusto.
Qualcuno ha qualche idea su come dovremmo costruirlo? Sto cercando risposte che incorporino le migliori pratiche per MVC.
Soluzione
Questa domanda è stata posta molto tempo fa, quindi probabilmente l'hai già affrontata. Ma per i futuri visitatori, forse questa soluzione sarà utile: http://marcinbudny.blogspot.com/2010/01/handling -stylesheet riferimenti-in.html
Altri suggerimenti
Gli strumenti Free Telerik MVC hanno uno script e un registro di stile che potrebbero fare quello che vuoi ...
Non sono sicuro che questa sia una soluzione fattibile per te, ma prova a spostare quella chiamata in fondo a ogni pagina.
Ho sempre incluso i miei file javascript e css in html HEAD, quindi non so se funzionerebbe più in basso. La mia ipotesi è che funzionerà nella maggior parte dei browser, ma potresti avere problemi casuali in pochi.
L'alternativa è avere GetRegisteredFiles () in uscita un po 'di javascript che carica i file CSS nella posizione corretta (tramite manipolazione DOM).
Il problema con una di queste soluzioni è che i file non sono inclusi fino alla fine, il che potrebbe far apparire la pagina "semplice". fino al download del CSS.
In alternativa, il controller potrebbe prevedere quali "widget" verrà caricato e passerà quei dati alla pagina principale.