Le symbole ne s'affiche pas correctement

Question

Le symbole est : ؤْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْْ

Qu'est-ce que ce symbole a de si spécial et d'où vient-il ?

Que peut-on faire pour valider de telles entrées ? Ou mieux encore, comment afficher correctement de tels symboles (c'est-à-dire sans les laisser se superposer à d'autres éléments) ?

Answer 1

Eh bien, puisque cela semble ne pas être aussi trivial que je le pensais pour les autres, voici ma réponse.

C'est ce qu'on appelle Combinaison de signes diacritiques .

Pour vous donner un exemple, vous pouvez écrire un ä directement ou en tant que ä ce qui donne "ä".

Maintenant, vous pouvez vous tromper avec ces signes comme ici : "ä̈̈̈̈̈̈̈", ici j'ai entré : ä̈̈̈̈̈̈

Pour vous protéger contre de telles attaques "unicode", vous pourriez limiter le nombre de caractères unicode qui sont autorisés à se suivre. Je ne peux pas vous donner d'exemple précis puisque vos tags ne donnent aucune indication sur le langage de votre serveur. Si vous avez un site Web en anglais simple, vous pouvez essayer de le limiter aux caractères ascii uniquement. Cependant, je ne le recommanderais pas, car je ne serais pas autorisé à signer avec mon nom :-)

Je limiterais simplement le nombre de caractères Unicode les uns après les autres. Cela pourrait être fait avec regex.

Si vous voulez simplement éviter que les caractères Unicode ne "sortent" de leur conteneur, essayez d'utiliser style="overflow:auto" ce qui semble limiter la façon dont il est rendu.

Answer 2

Je viens de copier le symbole vers SQL Server et Visual Studio et j'ai constaté que le symbole a été converti en

Il semble donc que la combinaison de ْ (qui ressemble à un Symbole arabe )symbole que le navigateur n'est pas en mesure de reconnaître.

Le symbole est Symbole arabe Hamza .

Le même symbole est également interprété correctement par IE.

Il semble donc que certains navigateurs ne soient pas en mesure de reconnaître le symbole.

EDIT :

Pour valider une telle entrée, vous pouvez généralement utiliser une sorte de validation( comme pour redonner à l'utilisateur la possibilité de saisir uniquement des caractères ASCII. ) en utilisant des langages comme Javascript ou PHP, ce qui vous permet de limiter la saisie des caractères par l'utilisateur selon votre choix.

Ou mieux encore, comment peut-on afficher correctement de tels symboles ?

Si le navigateur ne peut pas rendre le symbole comme celui que vous avez montré, vous pouvez limiter ces caractères, par exemple en les plaçant à l'intérieur d'un div avec la balise overflow:auto mais ce ne serait pas une bonne solution. Une meilleure solution serait d'utiliser une validation script.

Answer 3

Il est étrange que, sur l'écran, vous ne voyez qu'un seul caractère suivi d'une ligne tirée de nulle part.

Mais lorsqu'on l'inspecte avec chrome, il s'agit en fait de caractères, le 1er caractère étant le suivant Unicode 1572 suivi par 161 caractères qui dessinent une ligne ayant Unicode 1618 ! Et après ça, il y a Unicode (or ASCII code) 32 pour l'espace.

Answer 4

Je ne suis pas sûr que l'analyse de vos symboles en Javascript soit utile, mais voici un script qui le fait :

var text = 'your symbol goes here',
regex1 = /(?:[\u0624|\u0652])/g,
result;
// note that the symbol comprises of the letter and the repeated diacritics;
// to remove the symbol completely: 
result = text.replace( regex1, '');

Voici un moyen de voir quels types de caractères sont inclus dans le symbole et comment ces caractères le font paraître très bizarre (il utilise le regex javascript) :

https://regex101.com/r/yW4aM8/3

Vous pouvez utiliser meta tag: charset=UTF-8 de rendre le symbole entier correctement sur tous les navigateurs plutôt que de l'essayer uniquement sur IE. Je dirais que la seule raison pour laquelle votre symbole semble bizarre est que les diacritiques (les caractères répétés) ne sont pas utilisés correctement, sinon, les caractères inclus sont tous légitimes. Je ne serais pas vraiment surpris que ce symbole soit simplement le résultat d'une tentative d'utilisation abusive d'une entrée de formulaire ou autre pour obtenir le même effet.

Le symbole utilise des caractères arabes purs, et pour votre information, la gamme des caractères de cette langue dans l'unicode est la suivante (javascript regex) et est disponible à l'adresse suivante unicode.org :

/[\u0600-\u06FF]/g

/[\u0600-\u06FF]/g.exec( ‘text here’ );

// it's advised that you wrap the Arabic words in spans to control and show them correctly, do the following:
'text includes arabic words'.replace(/(?:([\u0600-\u06FF]+))/g, '<span class="xyz">$1</span>';

et le css serait :

.xyz { unicode-bidi: bidi-override; }

J'espère que cela vous aidera un peu. Bonne chance.

Answer 5

$ echo -n ؤْْ | recode utf8..dump
UCS2   Nem   Descripción

0624   wH    arabic letter waw with hamza above
0652   0+    arabic sukun
0652   0+    arabic sukun
0652   0+    arabic sukun
[...lots of repeated lines...]
0652   0+    arabic sukun

C'est le waw (w) arabe avec beaucoup de diacritiques : 1 hamza (précomposé comme le caractère waw avec hamza ci-dessus) et environ 160 diacritiques sukun répétés.