Import sampleΒΆ

This sample demonstrates how to import objects from a PKCS#12 to the smart card, using the SCWS API.

<!doctype html>
<html>

	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<title>Titre de la page</title>
		<script src="libs/promise-polyfill.js"></script>
		<script src="../src/scwsapi.js"></script>
		<script>

window.webappcert = "2SvJ4hegUKJv}6.5vrlH2yJKIDd@n{fvTh{3B8#hpvR^OCB8LVjBz>@azy/vzA5]:dh8l)wgCHBhv@b<<zGFDXiXS9#BAzE.fe24le&2ppf!>pngCR0Cgby:rxMOuniXJcviwJiwhAirzhzu:rf/IcFgby:rxMOuniXJcvfFkare?]7kf/y)If!$KwenfcEA5]T9f!$WufFk4if/?3AgC)0^VbK@U4UsBz)9:E)H04=YE8Ek-nUkjXoq6W/sw5}7](eJfN#N[]SftPov.1=*ARD<ml!lY3NIC8ph13}&WSGKY=[=fFB@(wCjuy+3e4]]c*{lIe*>IQ1J4uPGxZWLt6a6.)w10qGM4}vab0UxV?9N@rpZ1}6VnZ>A]7.6HOuV+4Ulw&hw&?KkX]c#&v5^>ngdrXx*a]MV-#vt=g+FpVD&e{N=}YGighbc?{FNqDVh>uH^a8GbxFK4yS5UOh[:]L%{e/eMgBLJ>Xg>gSU@3.6W:^c]9ttE/h753GjtwF5*rOh6Ly?tXVw@G@mbr:z%hty7A[Rn(WlR2=UZ?5-kR<7g2F(Opz0!m2J>4VCo9LiNjF$p#+x]k6:O5[$nz9$y|MIIE1TCCAr2gAwIBAgIBADANBgkqhkiG9w0BAQsFADA9MQswCQYDVQQGEwJGUjEdMBsGA1UEAwwUSWRvcHRlIFdlYkFwcENlcnQgQ0ExDzANBgNVBAoMBklkb3B0ZTAgFw0yMzAxMDMxMTM1MTZaGA8yMDUyMTIzMTIyNTkwMFowMTESMBAGA1UEAxMJTWF4aW1lRGV2MQ8wDQYDVQQKEwZJZG9wdGUxCjAIBgNVBAsTATAwggEiMA0GCSqGSIb3DQEBAQUAA4IBDwAwggEKAoIBAQDDbbHFzPMOgflE7NLWtYXK0MV8xCLbSZ7qvUug0YdYSwiw9XDXe5uODG2ok9C1YrlSVuQ0O73CC07RqSys2XFsx6hW82JuwN+gEqJ+v+BKW3YQgT7NOzIRrvhucSo4UWrAZV6YXhd/1GZyYyyI1x3K1e1y/1p3Zw8nKAGeIP8vSQvSA7da124DOx860AXvF3eRUyonMEZagnPyueVVy0wodO1u1WRMjVN+f91FUhtbRf+u5am0vU+IZCE5Lv/ALghr0r3QqLAvHMlhe4uw9BmPCWQH7d/fdIbcZf7eDxWizei2dfl/dMh95f2RTGzE/Hnt56IVYvOT4kR5AU95gwCHAgMBAAGjgekwgeYwCQYDVR0TBAIwADAXBgNVHSUEEDAOBgwrBgEEAYHYJAECAgEwTQYDVR0gBEYwRDAPBg0rBgEEAYHYJAECAQEBMA8GDSsGAQQBgdgkAQIBAQMwDwYNKwYBBAGB2CQBAgEBBDAPBg0rBgEEAYHYJAECAQEGMHEGA1UdEQRqMGiGGGh0dHA6Ly8xMC4yNS4xMS4xMzI6MTIzNIYbaHR0cDovLzE5Mi4xNjguMTYwLjExNzoxMjM0hhhodHRwOi8vMTAuMjUuMTEuMTY1OjEyMzSGFWh0dHA6Ly8xMjcuMC4wLjE6MTIzNDANBgkqhkiG9w0BAQsFAAOCAgEAe0LSJpq7rmnkR6H9i/TxJ7GabjxZutC22Fmb+k5kDe8bsg2h2wjHjk6GLHccmhqOKGL5kJMQlSY9zM7NdcVDPxk2JQbt29lKSfQGn5Yp1jpmruU7Wnhq1XZ/ODqIgm55TGa1pqz8jBOIkC8rHJvjtZ8sBZNqKgsVtziwRHKnt+hqZ6N0XPmEMRU0EbOVgKBOYDbSfV3H9MsN+aElQXGwFYx31h68pWuICYYhDVF3jX+8mRAljalUm8gM+kGYm/eOczwIPihRdjbxV0lbrjPypZK2IeZhkyw9Cd4MaxisSGdnuueIU1PJLnJoBQ1rCSkNm91ZyHoJCYu20HoCm5s6yYZKA4g3Q3Q7KWBG9O2sur2ImP8gfOFKlQ37BuG1e1zHWI7yFKu2P1AfSHkpW/OIHXoXMr+NjjFvatST2tewTvW/AUcU5+3Wi4ZZA76JpRWDkC9CcaItHmYLhTBEh4VGKZGDJvryx08kp4s9P4oTa60mPQ8a4VNF1W9o6kU0k+lg5Yk+QvqJnPNFC7HSrlq2Johm7oIm7n3G/go2XF/e9qfqOu4NePvBAkGMxwrib/ST1hDV2X8JzyY595oiCokOs3tpGA+KjvsSVljrL3wHlRO3Lydg0h3XQtitf51wwfIPlQPf4utPtoVME2Zc0rXdK317/cpngykC0cbai+Dxu8A=";

function log(msg) {
	window.infodiv.insertAdjacentHTML('beforeend', msg + '<br>');
	window.infodiv.scrollTop += 1000;
}

window.token = null;

window.onload = function() {
	window.infodiv = document.getElementById("infodiv");
	window.certlist = document.getElementById("certificatelist");
	/* connecting to SCWS */
	log("Connecting to SCWS...");
	SCWS.findService(window.webappcert).then(function(challenge) {
		log("Connection to SCWS succeeded");
		return new Promise(function(resolve, reject) {
			var req = new XMLHttpRequest();
			req.onreadystatechange = function () {
				if (this.readyState === 4) {
					if (this.status === 200)
						resolve(req.responseText);
					else
						reject(new Error("Challenge signature failed"));
				}
			};
			req.open("GET", "signchallenge.php?rnd=" + challenge, true);
			req.send();
		}).then(function(signature) {
			return SCWS.createEnvironment(signature);
		});
	}).then(function() {
		log("SCWS environment created successfully");

		/* register event callbacks for checking readers changes */
		SCWS.onreaderadded = function(reader) {
			log("Reader inserted: '" + reader.name + "'");
		}
		SCWS.onreaderremoved = function(reader) {
			log("Reader removed: '" + reader.name + "'");
			disconnectIfNeeded(reader);
		}
		SCWS.onreaderstatechanged = function(reader) {
			log("Reader state changed: '" + reader.name + "'");
			disconnectIfNeeded(reader);
		}
	}).catch(function(err) {
		log("ERROR: " + err.message);
	});
}

function disconnectIfNeeded(reader) {
	if (reader.status !== "ok" && !reader.cardPresent) {
		if (token && token.reader == reader)
			disconnect();
	}
}

function disconnect() {
	if (!token)
		return;
	log("Disconnecting token...")
	token.disconnect().then(function() {
		log("done with success.")
	}).catch(function(err) {
		log("failed " + err.message);
	});
	token = null;
}

async function proceed() {
	if (!token) {
		// find the 1st reader w/ a token
		let reader = null;
		for (var i = 0; i < SCWS.readers.length; i++) {
			if (SCWS.readers[i].status === "ok" && SCWS.readers[i].cardPresent) {
				reader = SCWS.readers[i];
				break;
			}
		}
		if (!reader) {
			log("No reader with token found");
			return;
		}
		token = await reader.connect();
	}

	var pin = token.pins[0];
	var pinVal = document.getElementById("pin").value;
	var formElt = document.getElementById("importform");
	log("Login...");
	pin.login(pinVal).then(function() {
		log("Login successful, loading objects...");
		return token.import(new FormData(formElt)).then(function() {
			log("Objects loaded.");
			disconnect();
		});
	}).catch(function(err) {
		log("ERROR: " + err.message);
		disconnect();
	});
}

		</script>
	</head>

	<body>
		
		<p>
			PIN: <input id="pin" type="password" /><br>
			<form id="importform">
				<input type="file" name="file" /><br>
				Password: <input type="password" name="password" /><br>				
			</form>
			<input type="button" onclick="proceed()" value="Import"/>
			<input type="button" onclick="disconnect()" value="Disconnect"/>

		</p>
		
		<div id="infodiv" style="display:inline-block;vertical-align:top;width:100%;height:10rem;overflow:auto;border:1px solid gray;"></div>

	</body>
</html>