diff --git a/src/app/features/shared/components/ui/static-pages/ciphering/ciphering.component.html b/src/app/features/shared/components/ui/static-pages/ciphering/ciphering.component.html index bef038ed..c2caca64 100644 --- a/src/app/features/shared/components/ui/static-pages/ciphering/ciphering.component.html +++ b/src/app/features/shared/components/ui/static-pages/ciphering/ciphering.component.html @@ -2,89 +2,102 @@

Essais de chiffrement pour un framadate zéro knoledge

-
-
-
-

Chiffrement simple

- - texte clair de {{ plainText.length }} caractères à convertir en truc indéchiffrable (à priori) - -
- simple ciphered. On assigne un numéro à chaque caractère, séparé par un tiret en sortie. - - - {{ simpleCipheredText }} - -
-

Avec un peu de sel?

- - ({{ salt.length }} caractères) -
- simple ciphered avec un sel. on ajoute le sel avant le texte puis on passe le tout dans la conversion - comme ci-dessus. on obtient un message de {{ plainText.length }} + {{ salt.length }} caractères - convertis en {{ plainText.length + salt.length }} nombres séparés par des tirets. - - - {{ simpleCipheredTextWithSalt }} - -

On hashe le sel

-
-
- Pour gagner en aléatoire on peut passer le sel dans une fonction de hashage cryptographique, - telle que MD5 (Message Digest 5). - fonctionnement de MD5 -
-
- Voici ce que le hashage du sel donne: - - {{ md5(salt) }} - - ({{ md5(salt).length }}caractères) -
- Le nouveau texte chiffré avec le sel hashé est donc: - - - {{ simpleCipheredTextWithHashedSalt }} - -
-
- -

Légèrement épicé

- simple chiffrement avec un sel avant et un saupoudrage du sel sur chacun des caractères de la phrase. la - valeur du caractère est ajoutée à la valeur du caractère du sel correspondant. une fois arrivé à la fin - du sel on reprend au début pour saupoudrer toute la phrase à chiffrer. Ce qui donne - {{ simpleCipheredTextWithSpreadSalt.split('-').length }} chiffres. - - - {{ simpleCipheredTextWithSpreadSalt }} - -
- -

On en remet une couche

- Les nombres que l'on a obtenu peuvent être transmis après une opération de conversion en caractères. On - a donc autant de caractères que juste avant. ça ressemble déjà plus à un message pas évident à - déchiffrer. Le nouveau texte fait {{ layerOnSpread.length }} caractères. - - - {{ layerOnSpread }} - -
+
+

Chiffrement simple

+
+ Les ordinateurs font des opérations très rapidement sur des nombres, pour coder et décoder des textes, il + suffit donc de les convertir en nombre et faire des opérations plus ou moins complexes avec.
-
-
+ Voici un texte que l'on voudrait chiffrer:
+ +
+ Vous pouvez le changer, la page se met à jour automatiquement. Le texte clair fait + {{ plainText.length }} caractères. +
+ Texte chiffré très simplement: on assigne un numéro à chaque caractère, séparé par un tiret en sortie. + Javascript permet de faire ceci avec monTexte.charCodeAt(1) pour obtenir le code du caractère 1 de + notre texte à chiffrer. Exemple: + +
+ + + + {{ simpleCipheredText }} + + +
+

Avec un peu de sel?

+ + ({{ salt.length }} caractères) +
+ simple ciphered avec un sel. on ajoute le sel avant le texte puis on passe le tout dans la conversion comme + ci-dessus. on obtient un message de {{ plainText.length }} + {{ salt.length }} caractères convertis en + {{ plainText.length + salt.length }} nombres séparés par des tirets. + + + {{ simpleCipheredTextWithSalt }} + +

On hashe le sel

+
+
+ Pour gagner en aléatoire on peut passer le sel dans une fonction de hashage cryptographique, telle que + MD5 (Message Digest 5). + fonctionnement de MD5 +
+
+ Voici ce que le hashage du sel donne: + + {{ md5(salt) }} + + ({{ md5(salt).length }}caractères) +
+ Le nouveau texte chiffré avec le sel hashé est donc: + + + {{ simpleCipheredTextWithHashedSalt }} + +
+
+ +

Légèrement épicé

+ simple chiffrement avec un sel avant et un saupoudrage du sel sur chacun des caractères de la phrase. la valeur + du caractère est ajoutée à la valeur du caractère du sel correspondant. une fois arrivé à la fin du sel on + reprend au début pour saupoudrer toute la phrase à chiffrer. Ce qui donne + {{ simpleCipheredTextWithSpreadSalt.split('-').length }} chiffres. + + + {{ simpleCipheredTextWithSpreadSalt }} + +
+ +

On en remet une couche

+ Les nombres que l'on a obtenu peuvent être transmis après une opération de conversion en caractères. On a donc + autant de caractères que juste avant. ça ressemble déjà plus à un message pas évident à déchiffrer. Le nouveau + texte fait {{ layerOnSpread.length }} caractères. + + + {{ layerOnSpread }} + +

Déchiffrement simple

@@ -98,15 +111,18 @@ {{ simpleDeCipheredText }} - simple texte déchiffré avec sel, en enlevant les {{ salt.length }} premiers caractères du sel - - {{ simpleDeCipheredTextWithSalt }} - +
+ simple texte déchiffré avec sel, en enlevant les {{ salt.length }} premiers caractères, ceux correspondant au + sel. + + + +
Simple texte déchiffré avec sel saupoudré, en enlevant à chaque caractère la valeur du caractère courant du sel. Sans connaître le sel il est déjà plus difficile de deviner la phrase, mais des régularités apparaissent encore. - - {{ simpleDeCipheredTextWithSpreadSalt }} - + + +
diff --git a/src/app/features/shared/components/ui/static-pages/ciphering/ciphering.component.scss b/src/app/features/shared/components/ui/static-pages/ciphering/ciphering.component.scss index a9a47b26..831df7ea 100644 --- a/src/app/features/shared/components/ui/static-pages/ciphering/ciphering.component.scss +++ b/src/app/features/shared/components/ui/static-pages/ciphering/ciphering.component.scss @@ -11,14 +11,13 @@ color: #7d6c99; padding: 0.5em; margin-left: 1em; - display: block; min-width: 10ch; min-height: 2em; - max-width: 25%; + max-width: 80%; overflow-x: scroll; line-height: 2em; + display: flex; app-copy-text { - //float: left; margin-right: 1em; } }