308 lines
11 KiB
HTML
308 lines
11 KiB
HTML
<div class="ciphering padded">
|
|
<h2 class="title">
|
|
Essais de chiffrement pour un framadate zéro knoledge
|
|
</h2>
|
|
<section class="boxed-shadow">
|
|
<h3 class="title">
|
|
Chiffrement par matrice
|
|
</h3>
|
|
Voici un texte que l'on voudrait chiffrer: <br />
|
|
<input type="text" [(ngModel)]="plainText" (ngModelChange)="encrypt(codingMatrice, plainText)" /><br />
|
|
Vous pouvez le changer, la page se met à jour automatiquement. Le texte clair fait
|
|
{{ plainText.length }} caractères.
|
|
<br />
|
|
Nous avons besoin d'une matrice de codage de 4 nombres.
|
|
<br />
|
|
<input type="text" [(ngModel)]="codingMatrice" />
|
|
|
|
<br />
|
|
<button class="btn is-primary" (click)="encrypt(codingMatrice, plainText)">
|
|
chiffrer avec la matrice
|
|
</button>
|
|
<br />
|
|
Et voilà la résultat:
|
|
<strong class="cipher-result">
|
|
<app-copy-text [textToCopy]="cipheredTextCIL" [displayLabelButton]="false"></app-copy-text>
|
|
{{ cipheredTextCIL }}
|
|
</strong>
|
|
|
|
<h4 class="title">Comment on a fait?</h4>
|
|
|
|
Voici notre alphabet autorisé ( {{ alphab.length }} caractères):
|
|
<pre>{{ alphab }}</pre>
|
|
Tout caractère qui n'est pas présent dans notre alphabet sera converti en souligné "_".
|
|
<br />
|
|
Notre texte après vérification : <code>{{ filterCharacters(plainText) }}</code>
|
|
<br />
|
|
On sépare le texte en {{ separatedCouples.length }} couples de caractères pour le mettre dans une matrice. On
|
|
prend la pilule rouge.
|
|
<br />
|
|
<span class="couple btn is-info" *ngFor="let c of separatedCouples"> [{{ c[0] }} , {{ c[1] }}] </span>
|
|
<br />
|
|
Pour chaque couple de caractères comme
|
|
<span class="couple btn is-info">[{{ separatedCouples[0][0] }} , {{ separatedCouples[0][1] }}]</span>
|
|
<br />
|
|
on crée le couple d'indices de ces caractères.
|
|
<code
|
|
>[
|
|
{{ dico.indexOf(separatedCouples[0][0]) }}
|
|
,
|
|
{{ dico.indexOf(separatedCouples[0][1]) }}
|
|
]</code
|
|
>
|
|
<br />
|
|
On
|
|
<a href="https://fr.wikipedia.org/wiki/Produit_matriciel#Produit_matriciel_ordinaire">
|
|
applique la matrice par produit
|
|
</a>
|
|
|
|
<code>
|
|
{{ convertStringToMatrix(codingMatrice) }}
|
|
</code>
|
|
au couple d'indices, ce qui donne:
|
|
<br />
|
|
<button class="btn is-info">
|
|
{{
|
|
applique(codingMatrice, [dico.indexOf(separatedCouples[0][0]), dico.indexOf(separatedCouples[0][1])])
|
|
| json
|
|
}}
|
|
</button>
|
|
<br />
|
|
et on re convertit les indices en caractères selon notre dictionnaire.
|
|
<button class="btn is-info">
|
|
{{
|
|
alphab[
|
|
applique(codingMatrice, [
|
|
dico.indexOf(separatedCouples[0][0]),
|
|
dico.indexOf(separatedCouples[0][1])
|
|
])[0]
|
|
]
|
|
}}
|
|
{{
|
|
alphab[
|
|
applique(codingMatrice, [
|
|
dico.indexOf(separatedCouples[0][0]),
|
|
dico.indexOf(separatedCouples[0][1])
|
|
])[1]
|
|
]
|
|
}}
|
|
</button>
|
|
<br />
|
|
on accumule ces lettres converties dans la chaine msgout et on obtient tout notre texte chiffré.
|
|
<code>
|
|
{{ cipheredTextCIL }}
|
|
</code>
|
|
</section>
|
|
<section class="boxed-shadow">
|
|
<h3 class="title">1) Chiffrement simple</h3>
|
|
<div class="notification is-info">
|
|
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.
|
|
</div>
|
|
Voici un texte que l'on voudrait chiffrer: <br />
|
|
<input type="text" [(ngModel)]="plainText" (ngModelChange)="encrypt(codingMatrice, plainText)" />
|
|
<br />
|
|
Vous pouvez le changer, la page se met à jour automatiquement. Le texte clair fait
|
|
{{ plainText.length }} caractères.
|
|
|
|
<br />
|
|
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 <code>monTexte.charCodeAt(1)</code> pour obtenir le code du caractère 1 de
|
|
notre texte à chiffrer. Exemple:
|
|
<ul>
|
|
<li>
|
|
Le premier caractère <code>{{ plainText[1] }}</code> de notre texte <code>{{ plainText }}</code> a pour
|
|
numéro de caractère <i class="fa fa-arrow-right"></i> <code>{{ plainText.charCodeAt(1) }}</code
|
|
>. <br />
|
|
Voici ce que ça donne pour tout notre texte:
|
|
</li>
|
|
<li *ngFor="let char of plainText.split(''); index as i">
|
|
Le caractère n° <code>{{ i }}</code> de notre texte est <code>{{ char }}</code> a pour numéro de
|
|
caractère <i class="fa fa-arrow-right"></i> <code>{{ plainText.charCodeAt(i) }}</code
|
|
>.
|
|
</li>
|
|
</ul>
|
|
<br />
|
|
On peut donc convertir notre texte en cette suite de nombres:
|
|
<strong class="cipher-result">
|
|
<app-copy-text [textToCopy]="simpleCipheredText" [displayLabelButton]="false"></app-copy-text>
|
|
<span>
|
|
{{ simpleCipheredText }}
|
|
</span>
|
|
</strong>
|
|
<br />
|
|
<h3 class="title">2) Avec un peu de sel?</h3>
|
|
<input type="text" [(ngModel)]="salt" />
|
|
({{ salt.length }} caractères)
|
|
<br />
|
|
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.
|
|
<strong class="cipher-result">
|
|
<app-copy-text [textToCopy]="simpleCipheredTextWithSalt" [displayLabelButton]="false"></app-copy-text>
|
|
{{ simpleCipheredTextWithSalt }}
|
|
</strong>
|
|
<h3 class="title">3) On hashe le sel</h3>
|
|
<div class="columns">
|
|
<div class="column is-half">
|
|
Pour gagner en aléatoire on peut passer le sel dans une fonction de hashage cryptographique, telle que
|
|
MD5 (Message Digest 5).
|
|
<img
|
|
src="https://upload.wikimedia.org/wikipedia/commons/thumb/3/38/Md5_generalview.png/330px-Md5_generalview.png"
|
|
alt="fonctionnement de MD5"
|
|
/>
|
|
</div>
|
|
<div class="column is-half">
|
|
Voici ce que le hashage du sel donne:
|
|
<code>
|
|
{{ md5(salt) }}
|
|
</code>
|
|
({{ md5(salt).length }}caractères)
|
|
<br />
|
|
Le nouveau texte chiffré avec le sel hashé est donc:
|
|
<strong class="cipher-result">
|
|
<app-copy-text
|
|
[textToCopy]="simpleCipheredTextWithHashedSalt"
|
|
[displayLabelButton]="false"
|
|
></app-copy-text>
|
|
{{ simpleCipheredTextWithHashedSalt }}
|
|
</strong>
|
|
</div>
|
|
</div>
|
|
|
|
<h3 class="title">4) Légèrement épicé</h3>
|
|
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.
|
|
<strong class="cipher-result">
|
|
<app-copy-text [textToCopy]="simpleCipheredTextWithSpreadSalt" [displayLabelButton]="false"></app-copy-text>
|
|
{{ simpleCipheredTextWithSpreadSalt }}
|
|
</strong>
|
|
<br />
|
|
|
|
<h3 class="title">5) On en remet une couche</h3>
|
|
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.
|
|
<strong class="cipher-result">
|
|
<app-copy-text [textToCopy]="layerOnSpread" [displayLabelButton]="false"></app-copy-text>
|
|
{{ layerOnSpread }}
|
|
</strong>
|
|
</section>
|
|
<section class="boxed-shadow">
|
|
<h3 class="title">Déchiffrement simple</h3>
|
|
|
|
Collez ici le texte chiffré à convertir en truc lisible par l'opération
|
|
<s>du saint esprit</s> réalisée dans l'autre sens.
|
|
<br />
|
|
<input type="text" [(ngModel)]="cipheredText" />
|
|
<br />
|
|
Simple texte déchiffré. Il suffit de séparer les numéros en caractère et trouver à quel caractère correspond une
|
|
autre pour trouver n'importe quel caractère ayant le même chiffre.
|
|
<strong class="cipher-result">
|
|
{{ simpleDeCipheredText }}
|
|
</strong>
|
|
<br />
|
|
simple texte déchiffré avec sel, en enlevant les {{ salt.length }} premiers caractères, ceux correspondant au
|
|
sel.
|
|
<!-- <strong class="cipher-result">-->
|
|
<!-- {{ simpleDeCipheredTextWithSalt }}-->
|
|
<!-- </strong>-->
|
|
<br />
|
|
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.
|
|
<!-- <strong class="cipher-result">-->
|
|
<!-- {{ simpleDeCipheredTextWithSpreadSalt }}-->
|
|
<!-- </strong>-->
|
|
</section>
|
|
<section class="boxed-shadow entropy">
|
|
<h2>Calcul d'entropie de Shannon</h2>
|
|
Un nombre élevé est signe de difficulté à deviner par calcul.
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<td>score d'entropie</td>
|
|
<td>texte à évaluer</td>
|
|
</tr>
|
|
</thead>
|
|
<tbody></tbody>
|
|
<tr>
|
|
<td>{{ getEntropy(plainText).toFixed(3) }}</td>
|
|
<td>
|
|
<input type="text" [(ngModel)]="plainText" (ngModelChange)="encrypt(codingMatrice, plainText)" />
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>{{ getEntropy(simpleCipheredText).toFixed(3) }}</td>
|
|
<td>
|
|
<p class="limited-text">{{ simpleCipheredText }}</p>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>{{ getEntropy(simpleCipheredTextWithSalt).toFixed(3) }}</td>
|
|
<td>
|
|
<p class="limited-text">{{ simpleCipheredTextWithSalt }}</p>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>{{ getEntropy(simpleCipheredTextWithHashedSalt).toFixed(3) }}</td>
|
|
<td>
|
|
<p class="limited-text">{{ simpleCipheredTextWithHashedSalt }}</p>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>{{ getEntropy(convertIntToText(simpleCipheredTextWithHashedSalt)).toFixed(3) }}</td>
|
|
<td>
|
|
<p class="limited-text">{{ convertIntToText(simpleCipheredTextWithHashedSalt) }}</p>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>{{ getEntropy(simpleCipheredTextWithHashedSpreadSalt).toFixed(3) }}</td>
|
|
<td>
|
|
<p class="limited-text">{{ simpleCipheredTextWithHashedSpreadSalt }}</p>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>{{ getEntropy(layerOnSpread).toFixed(3) }}</td>
|
|
<td>
|
|
<p class="limited-text">{{ layerOnSpread }}</p>
|
|
</td>
|
|
</tr>
|
|
<tr>
|
|
<td>
|
|
{{
|
|
getEntropy(
|
|
'KZ%feLx!D2qppSW3MEzcuMxDFpbS5&%vunsn5MpF8&VyM822Fg$$jU7Ue6PmFtujv5@ToFNp$P*3#PwS@3JAtnXFLE%9io7N23Q$Y&$&DoXEW&GsM6#Rb6m5$mvSpXAA'
|
|
).toFixed(3)
|
|
}}
|
|
</td>
|
|
<td>
|
|
<p class="limited-text">
|
|
comparaison avec une phrase de passe générée.
|
|
{{
|
|
'KZ%feLx!D2qppSW3MEzcuMxDFpbS5&%vunsn5MpF8&VyM822Fg$$jU7Ue6PmFtujv5@ToFNp$P*3#PwS@3JAtnXFLE%9io7N23Q$Y&$&DoXEW&GsM6#Rb6m5$mvSpXAA'
|
|
}}
|
|
</p>
|
|
</td>
|
|
</tr>
|
|
</table>
|
|
</section>
|
|
|
|
<section class="is-boxed">
|
|
<h3>Chiffrement AES</h3>
|
|
|
|
<app-wip-todo></app-wip-todo>
|
|
<!-- <input type="text" [(ngModel)]="cipheredText" />-->
|
|
<!-- texte avancé à déchiffrer-->
|
|
<!-- <br />-->
|
|
<!-- <input type="text" [(ngModel)]="salt" />-->
|
|
<!-- salt-->
|
|
<!-- <input type="text" [(ngModel)]="initial_vector" />-->
|
|
<!-- initial_vector-->
|
|
<!-- <br />-->
|
|
<!-- <input type="text" [(ngModel)]="key" />-->
|
|
<!-- key-->
|
|
</section>
|
|
</div>
|