Discussion :

[legrandse]

Bonjour à tous,

Je développe une application utilisant la carte d'identité électronique.

Cependant à l'heure actuelle, pour lire les données, il faut bien entendu introduire sa carte dans le lecteur USB, cliquer sur 'Lire carte" et ensuite "Valider les données".

Ce que je souhaiterai, c'est que dès que la carte est insérée, la lecture démarre automatiquement. Il ne resterai plus qu'à valider le formulaire.

Je joins le script en annexe.

Pourriez-vous y jeter un coup d'oeil svp?

Merci de votre aide.

[RomainVALERI]

Bienvenue à toi

Je n'ai pas compris le rapport avec Javascript ^^

Erreur de forum ou explications insuffisantes ?

[vermine]

Bonjour,

Que je me souvienne mes grands travaux sur l'eId, RomainVALERI a raison. Il n'y aucun rapport avec le Javascript.

Le Javascript ne sait pas se rendre compte que la carte a été introduite dans son lecteur. C'est bel et bien le logiciel lié au lecteur qui le sait. C'est à lui d'auto-lire la carte. Ce qui est généralement le cas. Par contre, ce logiciel n'ira pas remplir votre formulaire Web mais son propre formulaire. Le Javascript non plus car il n'a pas accès aux données. Je crains qu'un clic ne soit nécessaire.

[legrandse]

Désolé de déterrer un peu mais j'ai trouvé un exemple de script en javascript qui permet de lire la carte dès qu'elle est insérée dans le lecteur.

Je les joins en annexe.

Par contre serait-il possible d'après vous que plutôt d'afficher les données dans un textearea, de positionner chaque données dans un champs de formulaire séparé ?

Merci de vos éclaircissement.

[legrandse]

la suite...

[RomainVALERI]

... serait-il possible d'après vous que plutôt d'afficher les données dans un textearea, de positionner chaque données dans un champs de formulaire séparé ?

C'est cette ligne, dans la fonction readCard() de ton html d'exemple qui controle l'affichage des donnees lues :

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

document.getElementById("content").value = card.toString();

Le principe serait de modifier les deux côtés conjointement :

- côté HTML, à la place du textarea "content" (tout à la fin) : un formulaire avec ses champs

- côté JS, à la place de la ligne de l'extrait ci-dessus : quelques lignes pour découper les données (seul toi peux nous dire quelle forme elles ont et comment doit être fait le découpage) puis une série d'affectations vers les input correspondants.
Exemple fictif :

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
var donnees = card.toString();
donnees = donnees.split("#");
// en imagineant par exemple un séparateur # pour tes champs dans la réponse de la carte
document.getElementById("input_machin").value = donnees[0];
document.getElementById("input_truc").value = donnees[1];

[vermine]

Ils ont dû s'amuser.
Par contre, ça ne lit que les cartes belges, dirait-on (d'où le nom).

[legrandse]

Merci à toi RomainVALERI pour ton aide.

J'ai modifié les lignes de code concernées et créé des champs de formulaire.

Cependant, après essai, les données ne sont pas séparées par un "#" et sont toutes contenues dans le champs "nameField".

Le champs firstNamesField récolte quant à lui un "undefined".

Pourrais-je encore solliciter ton aide ?

Voici le bout de code modifié :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
function readCard() {
	document.getElementById("content").value = "Please wait ...";
	var card = cardReader.read();
	if (card != null) {
		var donnees = card.toString();
donnees = donnees.split("#");
// en imagineant par exemple un séparateur # pour tes champs dans la réponse de la carte
document.getElementById("nameField").value = donnees[0];
document.getElementById("firstNamesField").value = donnees[1];
 
	} else {
		document.getElementById("content").value = "No card returned.";
	}
}

[RomainVALERI]

Cependant, après essai, les données ne sont pas séparées par un "#" et sont toutes contenues dans le champs "nameField".

Ben oui
Comme je te le disais, j'ai pris cet exemple parce qu'il fallait bien "supposer" une manière dont les données sont retirées de ton cardReader ^^ Mais je suis bien conscient qu'il y a une chance sur 10 millions pour que ce soit justement le type de présentation des données de cet appareil... J'aurais tout aussi bien pu partir sur la supposition de donnees associatives :

Code JSON :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
{
   identifiant: 987,
   nom: "MARTIN",
   notes: [15, 10, 11]
}

Mais en fin de compte ça ne dépend que des spécifications de l'appareil : à toi de nous dire sous quelle forme les données sont fournies.
Notamment : le contenu que tu récupères dans namefield, ...sinon il nous reste éventuellement la méditation transcendantale parce que ça c'est pas dans le JS, qui lui s'arrête à un appel à l'applet de l'appareil pour récupérer les données :

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

this.BEIDApplet = document.getElementById(this.appletLauncherId).getSubApplet()

Tu as la notice ? un lien vers la doc en ligne de leur API ? ^^

[legrandse]

Voilà comment se positionnent les données dans un textarea:

*********************************
eID card
cardNumber: xxxxxxxxxxxx
validityBeginDate: 01/01/1970
validityEndDate: 01/01/1970
chipNumber:
issuingMunicipality: blabla
nationalNumber: xxxxxxxxxxx
surname: Legrand
firstName1: Sebastien
firstName2: Christian
firstName3: A
nationality: Belge
birthLocation: blabla
birthDate: 24/07/1977
sex: M
nobleCondition:
documentType: 1
specialStatus: 0
whiteCane: false
yellowCane: false
extendedMinority: false
street: blablabla
streetNumber:
boxNumber:
zipCode: 4970
municipality: blabla
country: be
A picture is available.

***********************************

Je ne sais pas si c'est cela dont tu parles?

[legrandse]

Je pense que le fichier joint peut t'aider.

Sinon voici le lien vers l'EID Applet


Encore merci de ton aide

[legrandse]

Voilà après quelques heures de recherche j'ai trouvé la solution:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
function readCard() {
	document.getElementById("namefield").value = "Please wait ...";
	var card = cardReader.read();
	if (card != null) {
		var donnees = card.toString();
donnees = donnees.split("#");
 
// en imagineant par exemple un séparateur # pour tes champs dans la réponse de la carte
document.getElementById("namefield").value = card.getSurname();
document.getElementById("firstNamesField").value = card.getFirstName1();
document.getElementById("birthDateField").value = card.getBirthDate();
document.getElementById("streetField").value = card.getStreet();
document.getElementById("municField").value = card.getZipCode() + " " + card.getMunicipality();
document.getElementById("countryField").value = card.getCountry();
document.getElementById("natNumberField").value = card.getNationalNumber();
	} else {
		document.getElementById("content").value = "No card returned.";
	}
}

Merci en particulier à RomainVALERI qui m'a aidé dans la solution.

[RomainVALERI]

Merci en particulier à RomainVALERI qui m'a aidé dans la solution.

Je t'en prie ^^ je n'ai fait que te mettre sur la voie.

Par contre, juste pour être sûr : il me semble qu'il te reste cette ligne "en trop" dans ta solution : (plus le commentaire qui allait avec ^^)

Code javascript :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
function readCard() {
   document.getElementById("namefield").value = "Please wait ...";
   var card = cardReader.read();
   if (card != null) {
      var donnees = card.toString();
      donnees = donnees.split("#");
      // en imagineant par exemple un séparateur # pour tes champs dans la réponse de la carte
      document.getElementById("namefield").value = card.getSurname();
      document.getElementById("firstNamesField").value = card.getFirstName1();
      document.getElementById("birthDateField").value = card.getBirthDate();
      document.getElementById("streetField").value = card.getStreet();
      document.getElementById("municField").value = card.getZipCode() + " " + card.getMunicipality();
      document.getElementById("countryField").value = card.getCountry();
      document.getElementById("natNumberField").value = card.getNationalNumber();
   } else {
      document.getElementById("content").value = "No card returned.";
   }
}

(enfin j'imagine que ce n'est qu'une erreur dans le message, mais que c'est correct de ton côté ^^)