Objektový WYSIWYM

PHP Objektově orientované programování Objektový WYSIWYM

Ukázka editoru WYSIWYM v PHP. Aplikace byla vytvořena do soutěže Machr na PHP za týden 24 v roce 2015. Aplikace je psaná objektově a využívá principu polymorfismu. Aplikace obsahuje ochranu proti útoku XSS.

WYSIWYM

WYSIWYM je editor textu, který ukazuje obsah tak jak bude vypadat a různé prvky textu jsou v něm označeny. Ve vstupu pro WYSIWYM lze vidět jednotlivě označené části textu. Krom WYSIWYM existuje ještě WYSIWYG (G na konci místo M) který funguje podobně, akorát přímo vidíte to,co bude výsledkem (nastylovány text).

Prvky WYSIWYM

Existuje několik variant,jak jsou prvky textu označovány. Zadání soutěže řeklo, že máme využít formátu Texy, který říká, že text by měl být označován následovně:

Nadpis1
#######

Odstavec
další řádek odstavce se neodřádkuje.

**Tučné** písmo a *kurzíva*

Nadpis 2
========

- položka seznamu1
- položka seznamu2

"http://www.itnetwork.cz":itnetwork

[* obrazek.png .(Obrázek) *]

Tady tento formát se má převést na formát HTML, který se pak zobrazí uživateli. Vstupem tedy bude na HTML stránce víceřádkové textové políčko.

Polymorfismus

Polymorfismus zde najdeme u rozhraní IConvertor což zastupuje převodník nějakého prvku. Implementovány jsou prvky nadpisu, odkazu, tučného písma, atd.

Dědičnost

Najdeme zde využité dědičnosti, přece nebudeme zvlášť implementovat nadpis1 a nadpis2 nebo tučný text a kurzívu. Vždyť to je přece úplně stejné!

Ochrana proti XSS

V článku Obrana proti útoku XSS v PHP si můžete přečíst jak XSS funguje. V jednoduchosti jde o to, že když se ve vstupu objeví <script>blablabla</script>, tak to samozřejmě nemůže fungovat, protože pak by si na naší stránce mohl pouštět, kdo chce, co chce.

Implementované to mám tak, že celý dokument naparsuju jako XML a pak rekurzivně projdu všechny elementy a ověřím jejich tag. Whitelist s tagy lze volitelně předat metodě pro ověřování, pokud udán nebude, strážce XSS si ho zjistí sám, tak že všechny převaděče požádá o seznam jimi povolených elementů (právě jsme narazili na druhou potřebnou metodu v rozhraní IConvertor).

Pokud rekurzí procházený element není na whitelistu jeho tag bude nahrazen elementem span, což je neutrální element.

Ke stažení je kompletně funkční WYSIWYM editor, který je také dočasně dostupný na jednom z mých webů .


Galerie

Program byl vytvořen v roce 2015.

 

Stáhnout

Staženo 33x (74.52 kB)
Aplikace je včetně zdrojových kódů v jazyce PHP

 

  Aktivity (1)

Program pro vás napsal Michal Žůrek (misaz)
Avatar
Autor se věnuje tvorbě aplikací pro počítače, mobilní telefony, mikroprocesory a tvorbě webových stránek a webových aplikací. Nejraději programuje ve Visual Basicu a TypeScript. Ovládá HTML, CSS, JavaScript, TypeScript, C# a Visual Basic.

Jak se ti líbí článek?
Celkem (2 hlasů) :
333 33


 


Miniatura
Předchozí článek
Jmenné prostory v PHP
Miniatura
Následující článek
Cvičení k 24.-26. lekci OOP v PHP

 

 

Komentáře

Avatar
Kejmou
Člen
Avatar
Kejmou:

Zdravím,

chci se zeptat, dá se to něják pak uložit do databáze a vypsat aby to neztratilo dan formátování?

Díky.

 
Odpovědět 21.6.2015 22:07
Avatar
Odpovídá na Kejmou
Michal Žůrek (misaz):

samozřejmě že to jde, máš celkem 2 možnosti. Buď uložit vstup anebo výstup. Jak se to ukládá najdeš ve zdejších tutoriálech.

Odpovědět  +1 21.6.2015 22:35
Nesnáším {}, proto se jim vyhýbám.
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 2 zpráv z 2.