Context Navigation

source: prototipo_portal_2018/WebContent/index.html @ d76b369

Last change on this file since d76b369 was d76b369, checked in by antonioaraujob <antonioaraujob@…>, 9 years ago
Modificaciones en archivo index.html para ejecutar tipo de firma de acuerdo al radioButton seleccionado: PDF o BDOC.
Property mode set to `100644`
File size: 38.5 KB

Line
1	<!DOCTYPE html>
2	<!-- release v4.1.8, copyright 2014 - 2015 Kartik Visweswaran -->
3	<html lang="en">
4	<head> <!--Inicio del head -->
5	<meta charset="UTF-8"/>
6	<link href="bootstrap.min.css" rel="stylesheet">
7	<link rel="stylesheet" type="text/css" href="css/dataTables.bootstrap.css">
8	<link rel="stylesheet" type="text/css" href="css/font-awesome.css">
9
10	<script type="text/javascript" src="jquery.min.js"></script>
11	<script type="text/javascript" src="js/jquery.dataTables.min.js"></script>
12	<script type="text/javascript" src="js/dataTables.bootstrap.js"></script>
13	<script src="bootstrap.min.js" type="text/javascript"></script>
14
15	<link href="css/fileinput.css" media="all" rel="stylesheet" type="text/css" />
16	<script src="js/jquery.form.js" type="text/javascript"></script>
17	<script src="js/fileinput.js" type="text/javascript"></script>
18	<script type="text/javascript" src="gitversion.js"></script>
19	<script type="text/javascript" src="hwcrypto-legacy.js"></script>
20	<script type="text/javascript" src="hwcrypto.js"></script>
21	<script type="text/javascript" src="hex2base.js"></script>
22
23	<script type="text/javascript" charset="utf-8">
24	$(document).ready(function() {
25	$('table.display').dataTable();
26	} );
27	</script>
28
29
30	</head> <!--fin del head -->
31
32	<!-- Header -->
33	<header>
34	<div id="barner">
35	<center>
36	<img class="img-responsive" alt="Cinque Terre" src="cabecera.png">
37
38	</div>
39
40	<nav class="navbar navbar-inverse">
41	<div class="container-fluid">
42	<div class="navbar-header">
43	<a class="navbar-brand" href="https://www.cenditel.gob.ve/">CENDITEL</a>
44	</div>
45	<div>
46	<ul class="nav navbar-nav navbar-right">
47	<li class="active"><a href="#">Home</a></li>
48	<li><a href="https://tibisay.cenditel.gob.ve/murachi">Wiki</a></li>
49	<li><a href="#">Contacto</a></li>
50	</ul>
51	</div>
52	</div>
53	</nav>
54	</header>
55	<!-- End Header -->
56
57	<div class="container">
58	<div class="jumbotron">
59
60
61	<h1><img src="version-beta2.png">Portal de firma electrónica y verificación</h1>
62	<p>Sistema para firmar electrónicamente documentos y verificar los documentos firmados</p>
63	</div>
64	</div>
65
66
67
68
69	<!--Inicio Funciones que utiliza el sistema -->
70
71	<!-- tomado de https://open-eid.github.io/hwcrypto.js/sign.html -->
72	<script>
73
74	function log_text(s) {
75	var d = document.createElement("div");
76	d.innerHTML = s;
77	document.getElementById('log').appendChild(d);
78	}
79
80	function debug() {
81	window.hwcrypto.debug().then(function(response) {log_text("Debug: " + response);});
82	}
83
84	function sign() {
85
86	alert("sign()");
87	// Clear log
88	document.getElementById('log').innerHTML = '';
89	// Timestamp
90	log_text("sign() clicked on " + new Date().toUTCString());
91
92	// Select hash
93	//var hashtype = $("input[name=hash]:checked").val();
94	var hashtype = "SHA-256";
95
96	// Set backend if asked
97	//var backend = $("input[name=backend]:checked").val()
98	var backend = "autodetect";
99
100	// get language
101	var lang = "en";
102	if (!window.hwcrypto.use(backend)) {
103	log_text("Selecting backend failed.");
104	}
105
106	var hash = $("#hashvalue").val();
107	log_text("Signing " + hashtype + ": " + hash);
108	// debug
109	window.hwcrypto.debug().then(function(response) {
110	log_text("Debug: " + response);
111	}, function(err) {
112	log_text("debug() failed: " + err);
113	return;
114	});
115	// Sign
116	window.hwcrypto.getCertificate({lang: lang}).then(function(response) {
117	var cert = response;
118	log_text("Using certificate:\n" + hexToPem(response.hex));
119
120
121	window.hwcrypto.sign(cert, {type: hashtype, hex: hash}, {lang: lang}).then(function(response) {
122	log_text("Generated signature:\n" + response.hex.match(/.{1,64}/g).join("\n"));
123	}, function(err) {
124	log_text("sign() failed: " + err);
125	});
126	}, function(err) {
127	log_text("getCertificate() failed: " + err);
128	}
129
130	);
131	}
132	</script>
133
134	<script>
135	function logGetCertificate() {
136
137	alert("logGetCertificate()");
138	// Clear log
139	document.getElementById('log').innerHTML = '';
140	// Timestamp
141	log_text("sign() clicked on " + new Date().toUTCString());
142
143	// Select hash
144	//var hashtype = $("input[name=hash]:checked").val();
145	var hashtype = "SHA-256";
146
147	// Set backend if asked
148	//var backend = $("input[name=backend]:checked").val()
149	var backend = "autodetect";
150
151	// get language
152	var lang = "en";
153	if (!window.hwcrypto.use(backend)) {
154	log_text("Selecting backend failed.");
155	}
156
157	var hash = $("#hashvalue").val();
158	log_text("Signing " + hashtype + ": " + hash);
159	// debug
160	window.hwcrypto.debug().then(function(response) {
161	log_text("Debug: " + response);
162	}, function(err) {
163	log_text("debug() failed: " + err);
164	return;
165	});
166	// Sign
167	window.hwcrypto.getCertificate({lang: lang}).then(function(response) {
168	var cert = response;
169	log_text("Using certificate:\n" + hexToPem(response.hex));
170	});
171	}
172
173
174	function getCertificate() {
175
176	alert("getCertificate()");
177	// Clear log
178	document.getElementById('log').innerHTML = '';
179	// Timestamp
180	log_text("sign() clicked on " + new Date().toUTCString());
181
182	// Set backend if asked
183	//var backend = $("input[name=backend]:checked").val()
184	var backend = "autodetect";
185
186	// get language
187	var lang = "en";
188	if (!window.hwcrypto.use(backend)) {
189	log_text("Selecting backend failed.");
190	}
191	window.hwcrypto.getCertificate({lang: lang}).then(function(response) {
192	var cert = response;
193	log_text("Using certificate:\n" + hexToPem(response.hex));
194	return cert;
195	});
196	}
197	</script>
198
199	<!-- Función que se conecta al servicio web de verificación de la firma electrónica
200	captura el evento submit y toma el formulario para firmar -->
201
202	<script>
203	$(function(){
204	$("#firmar").on("submit", function(e){
205	e.preventDefault();
206	var f = $(this);
207	// inicio control de los botones radio en el formulario firmar (pdf,bdoc)--------------------------------------------
208	//alert("manejo de JsonPDF");
209
210	// FIRMA DE PDF
211	if(document.SignFormat.optradio[0].checked) // chequea si el botón radio PDF esta seleccionado y entra a la sección en caso contrario va al otro if (botón radio BDOC)
212	{
213	alert(document.SignFormat.optradio[0].value);
214	//alert("se presiono firmar pdf")
215
216	//var formData = new FormData(document.getElementById("verificar"));
217	var formData = new FormData();
218
219	//formData.append("dato", "valor");
220	formData.append("upload", $("#file-sign")[0].files[0]);
221	//formData.append(f.attr("name"), $(this)[0].files[0]);
222
223	//alert("antes de ajax");
224
225	$.ajax({
226	url: "https://192.168.12.125:8443/Murachi/0.1/archivos",
227	//url: "https://murachi.cenditel.gob.ve/Murachi/0.1/archivos",
228	type: "post",
229	dataType: "json",
230	data: formData,
231	cache: false,
232	contentType: false,
233	processData: false,
234	success: function(response) {
235	//alert(JSON.stringify(response));
236	var html = manejoJsonPDF(JSON.stringify(response));
237	//alert(html);
238	//alert("ver respuesta")
239	document.getElementById("respuesta").innerHTML = html;
240
241	// identificador del archivo en el servidor
242	var fileId = response.fileId.toString();
243	//alert("fileId: "+ fileId);
244
245	// seleccionar certificado del firmante
246	//alert("va a seleccionar certificado");
247	var cert;
248	window.hwcrypto.getCertificate({lang: "en"}).then(function(response) {
249	var cert = response;
250	//log_text("Using certificate:\n" + hexToPem(response.hex));
251
252	//alert("cert: "+ cert.hex);
253
254	var parameters = JSON.stringify({
255	"fileId":fileId,
256	"certificate":cert.hex,
257	"reason":"prueba firma web",
258	"location":"Oficina",
259	"contact":"582746574336",
260	"signatureVisible":"true"
261	});
262
263	// ahora llamar al ajax de obtener la resena del pdf
264	$.ajax({
265	type: 'POST',
266	contentType: 'application/json',
267	url:"https://192.168.12.125:8443/Murachi/0.1/archivos/pdfs",
268	//url:"https://murachi.cenditel.gob.ve/Murachi/0.1/archivos/pdfs",
269	dataType: "json",
270	data: parameters,
271	success: function(data, textStatus, jqXHR){
272	var json_x = data;
273	var hash = json_x['hash'];
274	//alert("hash recibido del servidor "+hash);
275
276	var hashtype = "SHA-256";
277	var lang = "eng";
278
279	window.hwcrypto.sign(cert, {type: hashtype, hex: hash}, {lang: lang}).then(function(signature) {
280
281	//var signature = response.hex.match(/.{1,64}/g).join("\n");
282	//log_text("Generated signature:\n" + response.hex.match(/.{1,64}/g).join("\n"));
283	//log_text("Generated signature:\n" + signature.hex);
284
285	//alert("valor de la firma: " + signature.hex);
286
287	$.ajax({
288	type: 'POST',
289	contentType: 'application/json',
290	url:"https://192.168.12.125:8443/Murachi/0.1/archivos/pdfs/resenas",
291	//url:"https://murachi.cenditel.gob.ve/Murachi/0.1/archivos/pdfs/resenas",
292	dataType: 'json',
293	data: JSON.stringify({"signature":signature.hex}),
294	success: function(data, textStatus, jqXHR){
295	/*
296	var json_x = data;
297	var msg = json_x['message'];
298	alert('Archivo firmado en el servidor: ' + msg);
299	*/
300	alert('Archivo firmado correctamente: ' + data['signedFileId']);
301
302	alert("ver respuesta");
303	var linkToDownload = "<a href=\"https://192.168.12.125:8443/Murachi/0.1/archivos/descargas/" + data['signedFileId'] +"\">descargar archivo firmado</a>";
304	//var linkToDownload = "<a href=\"https://172.16.137.11:8443/Murachi/murachi/archivos/descargas/" + data['signedFileId'] +"\">descargar archivo firmado</a>";
305	//var linkToDownload = "<a href=\"https://murachi.cenditel.gob.ve/Murachi/0.1/archivos/descargas/" + data['signedFileId'] +"\">descargar archivo firmado</a>";
306	//alert(linkToDownload);
307	document.getElementById("respuesta").innerHTML = linkToDownload;
308
309
310	//descargar el archivo
311	/*
312	//var urlToDownload = "https://192.168.12.125:8443/Murachi/murachi/archivos/descargas/" + data['signedFileId'];
313	$.ajax({
314	type: 'GET',
315	contentType: false,
316	url: "https://192.168.12.125:8443/Murachi/murachi/archivos/descargas/" + data['signedFileId'],
317	dataType: false,
318	data: false,
319	success: function(data, textStatus, jqXHR){
320	alert("descargo el archivo");
321	},
322	error: function(jqXHR, textStatus, errorThrown){
323	alert('error en descarga de archivo: ' + textStatus);
324	$("#respuesta").html("error en descarga de archivo: " + textStatus);
325	}
326	});
327	*/
328	// fin de descarga de archivo
329
330
331	},
332	error: function(jqXHR, textStatus, errorThrown){
333	alert('error en pdfs/resenas: ' + textStatus);
334	$("#respuesta").html("error en pdfs/resenas: " + textStatus);
335	}
336	});
337
338	}, function(err) {
339	log_text("sign() failed: " + err);
340	alert("sign() failed: " + err);
341	$("#respuesta").html("sign() failed: " + err);
342	});
343
344	},
345	error: function(jqXHR, textStatus, errorThrown){
346	//alert('error: ' + textStatus);
347	//var responseText = jQuery.parseJSON(jqXHR.responseText);
348	alert('ajax error function: ' + jqXHR.responseText);
349	$("#respuesta").html("error function: " + jqXHR.responseText);
350	}
351
352
353	});
354
355
356
357	}, function(err) {
358	log_text("getCertificate() failed: " + err);
359	alert("getCertificate() failed: " + err);
360	$("#respuesta").html("getCertificate() failed: " + err);
361	});
362
363
364
365	},
366	error: function(response) {
367	//Que se ejecuta cuando finalice la petición de con error
368	$("#respuesta").html('Error...!!!');
369	alert("ocurrio un error")
370	}
371	});
372	}
373
374	// FIRMA DE BDOC
375	if(document.SignFormat.optradio[1].checked) //chequea si el botón radio BDOC esta seleccionado y entra
376	{
377	alert(document.SignFormat.optradio[1].value);
378	//alert("se presiono firmar")
379
380	//var formData = new FormData(document.getElementById("verificar"));
381	var formData = new FormData();
382
383	//formData.append("dato", "valor");
384	// TODO: identificar una manera de pasar varios archivos a la vez
385	formData.append("upload", $("#file-sign")[0].files[0]);
386
387
388
389	$.ajax({
390	url: "https://192.168.12.125:8443/Murachi/0.1/archivos/bdocs/cargas",
391	//url: "https://172.16.137.11:8443/Murachi/murachi/archivos",
392	//url: "https://172.16.137.11:8443/JAXRS-Murachi/murachi/archivos",
393	//url: "https://murachi.cenditel.gob.ve/Murachi/0.1/archivos",
394	type: "post",
395	dataType: "json",
396	data: formData,
397	cache: false,
398	contentType: false,
399	processData: false,
400	success: function(response) {
401	//alert(JSON.stringify(response));
402
403	//var aux = JSON.stringify(response);
404	//alert("aux: " + aux);
405
406	// identificador del archivo en el servidor
407	var fileId = response.containerId.toString();
408	//alert("fileId: "+ fileId);
409
410	// seleccionar certificado del firmante
411	//alert("va a seleccionar certificado");
412	var cert;
413	window.hwcrypto.getCertificate({lang: "en"}).then(function(response) {
414	var cert = response;
415	//log_text("Using certificate:\n" + hexToPem(response.hex));
416
417	//alert("cert: "+ cert.hex);
418
419	var parameters = JSON.stringify({
420	"fileId":fileId,
421	"certificate":cert.hex,
422	"city":"Rubio",
423	"state":"Tachira",
424	"postalCode":"1234",
425	"country":"Venezuela",
426	"role":"Militar",
427	"addSignature":false
428	});
429
430	// ahora llamar al ajax de obtener la resena del bdoc
431	$.ajax({
432	type: 'POST',
433	contentType: 'application/json',
434	//url:"https://192.168.12.125:8443/Murachi/0.1/archivos/bdocs",
435	url:"https://192.168.12.125:8443/Murachi/0.1/archivos/bdocs/firmas/pre",
436	//url:"https://172.16.137.11:8443/Murachi/murachi/archivos/pdfs",
437	//url:"https://murachi.cenditel.gob.ve/Murachi/0.1/archivos/pdfs",
438	dataType: "json",
439	data: parameters,
440	success: function(data, textStatus, jqXHR){
441	var json_x = data;
442	var hash = json_x['hash'];
443	//alert("hash recibido del servidor "+hash);
444
445	var hashtype = "SHA-256";
446	var lang = "eng";
447
448	window.hwcrypto.sign(cert, {type: hashtype, hex: hash}, {lang: lang}).then(function(signature) {
449
450	//var signature = response.hex.match(/.{1,64}/g).join("\n");
451	//log_text("Generated signature:\n" + response.hex.match(/.{1,64}/g).join("\n"));
452	//log_text("Generated signature:\n" + signature.hex);
453
454	//alert("valor de la firma: " + signature.hex);
455
456	$.ajax({
457	type: 'POST',
458	contentType: 'application/json',
459	//url:"https://192.168.12.125:8443/Murachi/0.1/archivos/bdocs/resenas",
460	url:"https://192.168.12.125:8443/Murachi/0.1/archivos/bdocs/firmas/post",
461	//url:"https://172.16.137.11:8443/Murachi/murachi/archivos/pdfs/resenas",
462	//url:"https://murachi.cenditel.gob.ve/Murachi/0.1/archivos/pdfs/resenas",
463	dataType: 'json',
464	data: JSON.stringify({"signature":signature.hex, "containerId":fileId}),
465	success: function(data, textStatus, jqXHR){
466	/*
467	var json_x = data;
468	var msg = json_x['message'];
469	alert('Archivo firmado en el servidor: ' + msg);
470	*/
471	alert('Archivo firmado correctamente: ' + data['signedFileId']);
472
473	alert("ver respuesta");
474	var linkToDownload = "<a href=\"https://192.168.12.125:8443/Murachi/0.1/archivos/descargas/" + data['signedFileId'] +"\">descargar archivo firmado</a>";
475	//var linkToDownload = "<a href=\"https://172.16.137.11:8443/Murachi/murachi/archivos/descargas/" + data['signedFileId'] +"\">descargar archivo firmado</a>";
476	//var linkToDownload = "<a href=\"https://murachi.cenditel.gob.ve/Murachi/0.1/archivos/descargas/" + data['signedFileId'] +"\">descargar archivo firmado</a>";
477	//alert(linkToDownload);
478	document.getElementById("respuesta").innerHTML = linkToDownload;
479
480
481	//descargar el archivo
482	/*
483	//var urlToDownload = "https://192.168.12.125:8443/Murachi/murachi/archivos/descargas/" + data['signedFileId'];
484	$.ajax({
485	type: 'GET',
486	contentType: false,
487	url: "https://192.168.12.125:8443/Murachi/murachi/archivos/descargas/" + data['signedFileId'],
488	dataType: false,
489	data: false,
490	success: function(data, textStatus, jqXHR){
491	alert("descargo el archivo");
492	},
493	error: function(jqXHR, textStatus, errorThrown){
494	alert('error en descarga de archivo: ' + textStatus);
495	$("#respuesta").html("error en descarga de archivo: " + textStatus);
496	}
497	});
498	*/
499	// fin de descarga de archivo
500
501
502	},
503	error: function(jqXHR, textStatus, errorThrown){
504	alert('error en /bdocs/resenas: ' + textStatus);
505	$("#respuesta").html("error en /bdocs/resenas: " + textStatus);
506	}
507	});
508
509	}, function(err) {
510	log_text("sign() failed: " + err);
511	alert("sign() failed: " + err);
512	$("#respuesta").html("sign() failed: " + err);
513	});
514
515	},
516	error: function(jqXHR, textStatus, errorThrown){
517	//alert('error: ' + textStatus);
518	//var responseText = jQuery.parseJSON(jqXHR.responseText);
519	alert('ajax error function: ' + jqXHR.responseText);
520	$("#respuesta").html("error function: " + jqXHR.responseText);
521	}
522
523	});
524
525	}, function(err) {
526	log_text("getCertificate() failed: " + err);
527	alert("getCertificate() failed: " + err);
528	$("#respuesta").html("getCertificate() failed: " + err);
529	});
530
531	},
532	//error: function(response) {
533	error: function(xhr, status, error) {
534	//Que se ejecuta cuando finalice la petición de con error
535	$("#respuesta").html('Error...!!!');
536
537	alert(xhr.responseText);
538	alert(error);
539
540	alert("ocurrio un error en cargas");
541
542
543
544	}
545	});
546
547
548	}
549
550	//fin de control de los botones radio en el formulario firmar (pdf,bdoc)----------------------------------------------
551
552
553
554	});
555	});
556	</script>
557
558
559	<!-- Prueba de firma de BDOC -->
560	<!--
561	<script>
562	$(function(){
563	$("#firmar").on("submit", function(e){
564	e.preventDefault();
565	var f = $(this);
566
567	//alert("se presiono firmar")
568
569	//var formData = new FormData(document.getElementById("verificar"));
570	var formData = new FormData();
571
572	//formData.append("dato", "valor");
573	formData.append("upload", $("#file-sign")[0].files[0]);
574	//formData.append(f.attr("name"), $(this)[0].files[0]);
575
576	$.ajax({
577	url: "https://192.168.12.125:8443/Murachi/0.1/archivos",
578	//url: "https://172.16.137.11:8443/Murachi/murachi/archivos",
579	//url: "https://172.16.137.11:8443/JAXRS-Murachi/murachi/archivos",
580	//url: "https://murachi.cenditel.gob.ve/Murachi/0.1/archivos",
581	type: "post",
582	dataType: "json",
583	data: formData,
584	cache: false,
585	contentType: false,
586	processData: false,
587	success: function(response) {
588	//alert(JSON.stringify(response));
589	var html = manejoJsonPDF(JSON.stringify(response));
590	//alert(html);
591	//alert("ver respuesta")
592	document.getElementById("respuesta").innerHTML = html;
593
594	// identificador del archivo en el servidor
595	var fileId = response.fileId.toString();
596	alert("fileId: "+ fileId);
597
598
599	// seleccionar certificado del firmante
600	alert("va a seleccionar certificado");
601	var cert;
602	window.hwcrypto.getCertificate({lang: "en"}).then(function(response) {
603	var cert = response;
604	//log_text("Using certificate:\n" + hexToPem(response.hex));
605
606	//alert("cert: "+ cert.hex);
607
608	var parameters = JSON.stringify({
609	"fileId":fileId,
610	"certificate":cert.hex,
611	"city":"Merida",
612	"state":"Merida",
613	"postalCode":"5101",
614	"country":"Venezuela",
615	"role":"Desarrollador",
616	"addSignature":false
617	});
618
619	// ahora llamar al ajax de obtener la resena del bdoc
620	$.ajax({
621	type: 'POST',
622	contentType: 'application/json',
623	url:"https://192.168.12.125:8443/Murachi/0.1/archivos/bdocs",
624	//url:"https://172.16.137.11:8443/Murachi/murachi/archivos/pdfs",
625	//url:"https://murachi.cenditel.gob.ve/Murachi/0.1/archivos/pdfs",
626	dataType: "json",
627	data: parameters,
628	success: function(data, textStatus, jqXHR){
629	var json_x = data;
630	var hash = json_x['hash'];
631	//alert("hash recibido del servidor "+hash);
632
633	var hashtype = "SHA-256";
634	var lang = "eng";
635
636	window.hwcrypto.sign(cert, {type: hashtype, hex: hash}, {lang: lang}).then(function(signature) {
637
638	//var signature = response.hex.match(/.{1,64}/g).join("\n");
639	//log_text("Generated signature:\n" + response.hex.match(/.{1,64}/g).join("\n"));
640	//log_text("Generated signature:\n" + signature.hex);
641
642	alert("valor de la firma: " + signature.hex);
643
644
645	$.ajax({
646	type: 'POST',
647	contentType: 'application/json',
648	url:"https://192.168.12.125:8443/Murachi/0.1/archivos/bdocs/resenas",
649	//url:"https://172.16.137.11:8443/Murachi/murachi/archivos/pdfs/resenas",
650	//url:"https://murachi.cenditel.gob.ve/Murachi/0.1/archivos/pdfs/resenas",
651	dataType: 'json',
652	data: JSON.stringify({"signature":signature.hex}),
653	success: function(data, textStatus, jqXHR){
654	/*
655	var json_x = data;
656	var msg = json_x['message'];
657	alert('Archivo firmado en el servidor: ' + msg);
658	*/
659	alert('Archivo firmado correctamente: ' + data['signedFileId']);
660
661	alert("ver respuesta");
662	var linkToDownload = "<a href=\"https://192.168.12.125:8443/Murachi/0.1/archivos/descargas/" + data['signedFileId'] +"\">descargar archivo firmado</a>";
663	//var linkToDownload = "<a href=\"https://172.16.137.11:8443/Murachi/murachi/archivos/descargas/" + data['signedFileId'] +"\">descargar archivo firmado</a>";
664	//var linkToDownload = "<a href=\"https://murachi.cenditel.gob.ve/Murachi/0.1/archivos/descargas/" + data['signedFileId'] +"\">descargar archivo firmado</a>";
665	//alert(linkToDownload);
666	document.getElementById("respuesta").innerHTML = linkToDownload;
667
668
669	//descargar el archivo
670	/*
671	//var urlToDownload = "https://192.168.12.125:8443/Murachi/murachi/archivos/descargas/" + data['signedFileId'];
672	$.ajax({
673	type: 'GET',
674	contentType: false,
675	url: "https://192.168.12.125:8443/Murachi/murachi/archivos/descargas/" + data['signedFileId'],
676	dataType: false,
677	data: false,
678	success: function(data, textStatus, jqXHR){
679	alert("descargo el archivo");
680	},
681	error: function(jqXHR, textStatus, errorThrown){
682	alert('error en descarga de archivo: ' + textStatus);
683	$("#respuesta").html("error en descarga de archivo: " + textStatus);
684	}
685	});
686	*/
687	// fin de descarga de archivo
688
689
690	},
691	error: function(jqXHR, textStatus, errorThrown){
692	alert('error en /bdocs/resenas: ' + textStatus);
693	$("#respuesta").html("error en /bdocs/resenas: " + textStatus);
694	}
695	});
696
697	}, function(err) {
698	log_text("sign() failed: " + err);
699	alert("sign() failed: " + err);
700	$("#respuesta").html("sign() failed: " + err);
701	});
702
703	},
704	error: function(jqXHR, textStatus, errorThrown){
705	//alert('error: ' + textStatus);
706	//var responseText = jQuery.parseJSON(jqXHR.responseText);
707	alert('ajax error function: ' + jqXHR.responseText);
708	$("#respuesta").html("error function: " + jqXHR.responseText);
709	}
710
711
712	});
713
714
715
716	}, function(err) {
717	log_text("getCertificate() failed: " + err);
718	alert("getCertificate() failed: " + err);
719	$("#respuesta").html("getCertificate() failed: " + err);
720	});
721
722
723
724	},
725	error: function(response) {
726	//Que se ejecuta cuando finalice la petición de con error
727	$("#respuesta").html('Error...!!!');
728	alert("ocurrio un error")
729	}
730	});
731	});
732	});
733	</script>
734	-->
735
736
737	<!-- Función que se conecta se servicio web de verificación de la firma electrónica
738	captura el evento submit y toma el formulario para enviar el servicio web -->
739
740	<script>
741	$(function(){
742	$("#verificar").on("submit", function(e){
743	e.preventDefault();
744	var f = $(this);
745
746	//var formData = new FormData(document.getElementById("verificar"));
747	var formData = new FormData();
748
749	//formData.append("dato", "valor");
750	formData.append("upload", $("#file-check-sign")[0].files[0]);
751	//formData.append(f.attr("name"), $(this)[0].files[0]);
752
753	$.ajax({
754	url: "https://192.168.12.125:8443/Murachi/0.1/archivos/firmados",
755	//url: "https://172.16.137.11:8443/Murachi/murachi/archivos/firmados",
756	//url: "https://172.16.137.11:8443/JAXRS-Murachi/murachi/archivos",
757	//url: "https://murachi.cenditel.gob.ve/Murachi/0.1/archivos/firmados",
758	type: "post",
759	dataType: "json",
760	data: formData,
761	cache: false,
762	contentType: false,
763	processData: false,
764	success: function(response) {
765	//alert(JSON.stringify(response));
766	var html = manejoJsonPDF(JSON.stringify(response));
767	//alert(html);
768	alert("ver respuesta")
769	document.getElementById("respuestaVerificacion").innerHTML = html;
770	$('table.display').dataTable();
771	},
772	error: function(response) {
773	//Que se ejecuta cuando finalice la petición de con error
774	$("#respuestaVerificacion").html('Error...!!!');
775	}
776	});
777	});
778	});
779	</script>
780
781
782	<!--Función que captura el evento del button reset del formulario verificar
783	y limpia el div respuesta (tabla de la verificación de la firmna)-->
784
785	<script>
786	$(document).ready(function() {
787	$("#resetVerificacion").click(function() { // apply to reset button's click event
788	$("#respuestaVerificacion").html('');
789	});
790	});
791	</script>
792
793	<!--Función que captura el evento del button reset del formulario firmar
794	y limpia el div respuesta (tabla de la firma)-->
795	<script>
796	$(document).ready(function() {
797	$("#reset").click(function() { // apply to reset button's click event
798	$("#respuesta").html('');
799	});
800	});
801	</script>
802
803
804	<!--Funcion para el manejo de un archivo json
805	Recibe el json (verificación de una firma pdf),
806	lo introduce en una tabla
807	y devuelve una un cadena de texto -->
808
809
810	<script>
811	function manejoJsonPDF(json) {
812
813	var fielJsonEs = {fileId: "Identificador único del archivo en el servidor", fileExist:"El archivo se cargó exitosamente en el servidor", mimeType:"Tipo MIME del archivo verificado", error:"Extension not supported. En caso de que el archivo sea diferente de PDF y BDOC", numberOfSignatures:"Número de firmas existentes en el archivo", signatures:"Lista de firmas", signatureType:"Tipo de firma de archivo PDF", signedOn:"Fecha en que se realiza la firma", integrityCheck:"Chequea la integridad de la firma", timeStamp:"Estampilla de tiempo", reason:"Razón de la firma", location:"Ubicación donde se realiza la firma", alternativeNameOfTheSigner:"Nombre alternativo del firmante", signerCertificateValidFrom:"Fecha de inicio de validez del certificado", signerCertificateStillValid:"El certificado todavía está válido", signerCertificateHasExpired:"El certificado expiró", signatureCoversWholeDocument:"La firma abarca todo el documento PDF", filterSubtype:"Tipo de subfiltro: /adbe.pkcs7.sha1, /adbe.pkcs7.detached", signerCertificateSubject:"Sujeto firmante", signerCertificateValidAtTimeOfSigning:"El certificado es válido en el momento de la firma", encryptionAlgorithm:"Algoritmo de cifrado", timeStampService:"Servicio de estampillado de tiempo", digestAlgorithm:"Algoritmo hash (reseña)", certificatesVerifiedAgainstTheKeyStore:"Certificado verificado contra el repositorio de certificados confiables", documentRevision:"Número de revisión del documento PDF", nameOfTheSigner:"Nombre del firmante", totalDocumentRevisions:"Número total de revisiones del documento PDF", contactInfo:"Información de contacto del firmante", timeStampVerified:"Estampilla de tiempo verificada", signerCertificateIssuer:"Emisor del certificado firmante", signerCertificateValidTo:"Fecha de fin de validez del certificado", signerCertificateSerial:"BDOC: Serial del certificado del firmante", signatureProfile:"BDOC: Perfil de la firma", signatureMethod:"BDOC: Algoritmo de firma utilizado", signatureId:"BDOC: identificador de la firma", signatureSigningTime:"BDOC: Hora y fecha en que se realiza la firma", signerCertificateIsValid:"BDOC: El certificado firmante es válido", signatureValidationException:"BDOC: Exepciones de la validación de la firma", isValid:"BDOC: Firma electrónica válida", signerCertificateSubjectName:"BDOC: Nombre del sujeto firmante", containerValidation:"BDOC: Especifica si el contenedor posee una estructura válida", numberOfDataFiles:"BDOC: Cantidad de archivos incluidos en el contenedor BDOC", dataFiles:"BDOC: Lista de archivos incluidos en el contenedor", name:"BDOC: Nombre del archivo incluido en el contenedor", dataFileSize:"BDOC: Tamaño del archivo incluido en el contenedor", filename:"BDOC: Nombre del archivo incluido en el contenedor", mediaType:"BDOC: Tipo MIME del archivo incluido en el contenedor"};
814	var objVarVerifique = JSON.parse(json);
815	var signatures = ''; //variable que maneja las firmas
816	var fields = ''; //variable que maneja los campos de la firma
817	var title = '<h2> Información de la firma electronica </h2> \n ';
818	var head = '<div class=\'container\'> \n <table id=\' \' class=\'display table table-striped table-bordered\' cellspacing=\'0\' width=\'100%\' > \n <thead> \n <tr>\n <th>#</th>\n <th>Campo</th>\n <th>Descripción</th> \n </tr>\n </thead>\n <tbody> \n';
819	var footer = '</tbody> \n </table> \n </div> \n </div>';
820	var html = title;
821	var numsign = 0;
822
823	$.each(objVarVerifique, function(idx, obj) {
824
825	if(idx == "error") {
826	html = '<h4> Extensión no soportada, verifique el archivo </h4>';
827	return(html);
828	}
829
830	if(idx == "numberOfSignatures"){
831	numsign = obj;
832	html += '<h4>' + fielJsonEs[idx] + ': ' + obj +' </h4>\n <br><br>';
833	}
834
835	if(idx == "signatures") {
836	signatures = obj; //se almacena la(s) cabecera(s) de las firmas
837	}
838	});
839
840	var contsing = 1; // variable que indica la firma donde esta posicionado
841
842	<!-- recorre las firmas signatures -->
843
844	$.each(signatures, function(idx, obj) {
845	html += '<h4> Información de la firma: '+contsing+'<h4> \n';
846	html += head;
847	var contfiels = 1; // variable que indica el campo de la firma
848	fields = obj; // variable que almacena los campos de la firma
849	$.each(fields, function(id, objx) { <!-- Recorreo los campos de la firma -->
850	html += '<tr>\n<td>'+contfiels+'</td>\n<td>' + fielJsonEs[id] + '</td>\n<td>' + objx +' </td>\n</tr>\n';
851	contfiels++;
852	});
853	contsing++;
854	html += footer;
855	//if(contsing>numsign) html += footer;
856	//else html += footer + head
857	});
858	//html += footer;
859	return(html);
860	}
861	</script>
862
863	<!--Funcion para el manejo de la extensión de los archivos en el momento de firmar de acuerdo a la selección del tipo de formato de firma
864	electronica que se vaya a utilizar señalada en el button radio (pdf,bdoc)-->
865
866	<script>
867	function manejoExtension() {
868	if(document.SignFormat.optradio[0].checked)
869	document.getElementById("file-sign").accept=".pdf";
870	else
871	document.getElementById("file-sign").accept=".*";
872	}
873	</script>
874
875
876
877	<!--Final Funciones que utiliza el sistema -->
878
879	<body>
880	<noscript><h1>Por favor habilite JavaScript!</h1></noscript>
881
882	<div class="container">
883	<div id="operation">
884	<ul id="tabs-operation" class="nav nav-tabs" data-tabs="tabs">
885	<li class="active"><a href="#firmar" data-toggle="tab">Firmar</a></li>
886	<li><a href="#verificar" data-toggle="tab">Verificar</a></li>
887	</ul>
888	<div id="operation-tab-content" class="tab-content">
889
890	<!-------------------Sección para firmar (formulario)------------------------->
891
892	<div class="tab-pane active" id="firmar">
893	<h1>Firmar Electrónicamente</h1>
894	<div class="container kv-main">
895	<form enctype="multipart/form-data" action="https://192.168.12.125:8443/Murachi/0.1/archivos" method="post" id="firmar" name="SignFormat">
896	<!-- <form enctype="multipart/form-data" action="https://192.168.12.125:8443/Murachi/murachi/archivos" method="post" id="firmar"> -->
897	<!-- <form enctype="multipart/form-data" action="https://172.16.137.11:8443/Murachi/murachi/archivos" method="post" id="firmar"> -->
898	<!-- <form enctype="multipart/form-data" action="https://murachi.cenditel.gob.ve/Murachi/0.1/archivos" method="post" id="firmar" name="SignFormat"> -->
899	<h2>Formato para la Firma</h2>
900	<p>Seleccione el tipo de formato que va a utilizar para firmar electrónicamente</p>
901	<div class="radio">
902	<label><input type="radio" name="optradio" value="pdf" checked >PDF</label>
903	</div>
904	<div class="radio">
905	<label><input type="radio" name="optradio" value="bdoc" >BDOC</label>
906	</div>
907	<br>
908	<input id="file-sign" class="file" type="file" multiple data-min-file-count="1" onclick="manejoExtension()" name="upload" >
909	<br>
910	<button type="submit" class="btn btn-primary">Enviar</button>
911	<button type="reset" id="reset" class="btn btn-default">Limpiar</button>
912	<br>
913	<br>
914	<div id="respuesta"> </div>
915
916	</form>
917	<br>
918	</div>
919	</div>
920
921	<!--------------------Sección para verificar (formulario)---------------------------->
922
923	<div class="tab-pane" id="verificar">
924	<h1>Verificar la firma electrónica</h1>
925	<div class="container kv-main">
926	<form enctype="multipart/form-data" action="https://192.168.12.125:8443/Murachi/0.1/archivos/firmados" method="post" id="verificar">
927	<!-- <form enctype="multipart/form-data" action="https://172.16.137.11:8443/Murachi/murachi/archivos/firmados" method="post" id="verificar"> -->
928	<!-- <form enctype="multipart/form-data" action="https://murachi.cenditel.gob.ve/Murachi/0.1/archivos/firmados" method="post" id="verificar"> -->
929	<input id="file-check-sign" class="file" type="file" multiple data-min-file-count="1" name="upload">
930	<br>
931	<button type="submit" class="btn btn-primary">Enviar</button>
932	<button type="reset" id="resetVerificacion" class="btn btn-default">Limpiar</button>
933	<br>
934	<br>
935	<div id="respuestaVerificacion"> </div>
936
937	</form>
938	</div>
939	</div>
940	</div>
941	</div>
942	<script type="text/javascript">
943	jQuery(document).ready(function ($) {
944	$('#tabs').tab();
945	});
946	</script>
947	</div>
948	<!-- container -->
949
950	<!--
951	<p><button id="click1" onclick='sign();'>Click here to invoke <b>sign()</b></button></p>
952
953	<p><button id="click2" onclick='logGetCertificate();'>get Certificate</button></p>
954	-->
955
956	<p>
957	<div id="log" style="white-space: pre; font-family: monospace;"></div>
958
959	</body>
960	</html>

Note: See TracBrowser for help on using the repository browser.

Download in other formats: