Quali sono le tecniche comuni per gestire l'HTML generato dall'utente modificato in modo diverso dai vari browser?

Question

Quali sono le tecniche comuni per gestire l'HTML generato dall'utente modificato in modo diverso dai vari browser?

#1 da (2 voti)
#2 da (1 voti)

6

Sto sviluppando un programma di aggiornamento del sito web. Il front-end utilizza HTML, CSS e JavaScript e il back-end utilizza Python.

Il modo in cui funziona è che <p/> , <b/> e alcuni altri elementi HTML possono essere aggiornati dall'utente. Per abilitarlo, carico la pagina Web e, con JQuery, converti tutti quegli elementi in <textarea/> elementi. Una volta modificato il contenuto dell'area di testo, applico la modifica agli elementi originali e la invio a uno script Python per memorizzare il nuovo contenuto.

Il problema è che sto riscontrando che diversi browser modificano l'HTML originale.

Come risolvi questo problema?
Quali librerie Python usi?
Quali tecniche o progetti applicativi utilizzi per evitare o superare questo problema?

I problemi che ho riscontrato sono:

IE rimuove le virgolette attorno agli attributi class e id . Ad esempio, <img class='abc'/> diventa <img class=abc/> .
Firefox rimuove il backslash dalle interruzioni di riga: <br \> diventa <br> .
Alcuni siti web hanno tecnicismi di visualizzazione molto specifici, quindi l'inserimento di un semplice "\ n" (che IE fa) può influenzare la visualizzazione di un sito web. Esempio: cambiando <img class='headingpic' /><div id="maincontent"> in <img class='headingpic'/>\n <div id="maincontent"> inserisce uno spazio verticale in IE.

Le cose che ho provato senza successo a superare questi problemi:

Uso di JQuery o Python per rimuovere tutte le occorrenze >\n< , <br> ecc. Ma questo non funziona perché ottengo diversi pattern in IE, a volte un ∙\n , a volte un \n∙∙∙ .
In un Python, analizza il nuovo HTML, estrai il nuovo testo / contenuto, inseriscilo nel vecchio HTML in modo che gli elementi e il formato non cambino mai, solo il contenuto. Questo è molto difficile e sembra essere eccessivo.

python algorithms technique

posta Jakie 07.10.2011 - 03:41

fonte

2 risposte

Leggi altre domande sui tag python algorithms technique

Cos'è una buona introduzione all'architettura di cloud computing? [chiuso] Esiste un metodo leggero per descrivere i servizi Web, simile a robots.txt o sitemap.xml?

score 2 · Answer 1

Una delle prime regole dello sviluppo web è di non fidarsi mai del cliente. Un utente malintenzionato o client buggy potrebbe bypassare qualsiasi cosa tu faccia in Javascript e alimentare il tuo codice HTML malformato e potenzialmente dannoso sul lato server di Python, quindi il tuo server Python ha bisogno di standardizzare e ripulire tutto ciò che ottiene.

Fintanto che devi svolgere parte del lavoro sul lato server, perché non fare tutto sul lato server, ignorando completamente i bizzarri dei browser web? Ti consiglio di inviare il contenuto del textarea al server e di pulirlo sul server con BeautifulSoup .

Puoi continuare a eseguire la conversione da text-to-HTML sul lato client, se lo desideri, per mostrare all'utente le anteprime delle loro modifiche e semplicemente inviare i contenuti di textareas al server.

score 1 · Answer 2

Qual è il tuo obiettivo?

Innanzitutto, perché lo stai facendo? Se offri ai tuoi clienti la possibilità di modificare il contenuto di una pagina web, ci sono due casi:

I tuoi clienti hanno una formazione tecnica sufficiente, come gli utenti di Stack Exchange. In questo caso, perché non utilizzare Markdown, molto user friendly e molto più facile da scrivere?
I tuoi clienti non hanno abbastanza conoscenze tecniche. In questo caso, fornire loro la possibilità di gestire l'HTML manualmente è come se il tuo ISP dicesse che per avere una connessione internet, devi prima fare il tuo cablaggio da casa al centro, quindi costruire il tuo router che corrisponda al loro protocolli e quindi eseguire personalmente tutte le configurazioni. Ecco come i tuoi clienti percepiranno la tua attività.

Ricorda, è HTML

Se hai ancora un motivo valido per utilizzare le funzionalità di modifica diretta di HTML, devi ricordare che hai a che fare con l'HTML. Il che significa, no string.replace e nessuna espressione regolare (l'ho messo in grassetto, ma immagino di averlo inserito in Arial Black 200 in grassetto rosso lampeggiante).

Devi analizzare l'input.

Primario, è necessario analizzarlo per normalizzare la formattazione. È qui che rimuovi le tue estremità, sostituisci <br> di <br /> (stai parlando di una barra rovesciata nella tua domanda, si tratta di un refuso?), Ecc.

Inoltre, devi essere sicuro che sia un codice HTML valido. Cosa succede se l'utente aggiunge un </div> che non corrisponde ad alcun tag di apertura? Sì, probabilmente interromperà il layout della tua pagina.

Ricorda che è l'input dell'utente

Ultima, ma la ragione più importante per analizzare l'input come HTML: devi convalidarlo.

Che cosa succede se aggiungo un tag <script/> con un codice JavaScript sgradevole? Cosa succede se voglio rompere il layout solo per infastidirti? O per reindirizzare gli utenti dal tuo sito web al mio? Cosa succede se ...

Se apri il codice HTML per essere modificato da una fonte non attendibile, sii pronto a farti male presto o tardi, entrambi (vedi, non è mai piacevole vedere che sei stato bannato dai risultati di Google perché il tuo contenuto della pagina contiene virus) e i tuoi clienti, che non torneranno mai.