Tengo un script en jquery + ajax + php el cual tengo un problema que no se efectivamente sea de compatibilidad o de la manera en que lo estoy empleando pues hace dos peticiones dentro del mismo ajax. Los detalles:
El scrip envía a través de ajax 2 parámetros a php para ser procesados: Una bandera (para saber que función acceder) y un token (con este token sabe que información debe generar el pdf.). En php primero valido si el token que se recibe es válido, Si no existe regreso 1 y si existe regreso 2:
Ajax lo recibe y vuelve a hacer otra petición con otra bandera y el mismo token. php lo procesa y genera el pdf. En este sentido en ajax espero un blob para poder iniciar la descarga del pdf en la misma ventana.
Todo funciona correctamente en google chrome, sin embargo, en mozilla y en Microsoft Edge no quiere funcionar (ya ni se diga en internet explorer).
He revisado la consola de errores de los navegadores y bueno, para ser honesto si hay errores pero ninguno con mi archivo jquery que hace la petición. Me temo que es un problema de compatibilidad.
A continuación comparto mi código:
$('.descargarpdfbtn').click(function(){
var nombre = $("#dnombre").html();
var token = $(this).attr('id');
var datos = new FormData();
datos.append("getpdfdescargar",true);
datos.append("token",token);
$.ajax({
url:"../../views/ajax.php",
method:"POST",
data:datos,
cache:false,
contentType: false,
processData:false,
beforeSend: function() {
$("#loading").removeClass('d-none');
},
success: function(regreso){
$("#loading").addClass('d-none');
//alert(regreso);
if(regreso==1){
alertamensaje(':/','Al parecer ocurrió un problema. Por favor inténtalo nuevamente.');
}else if(regreso==2){
var dato = new FormData();
dato.append("getpdfdescargar2",true);
dato.append("token",token);
$.ajax({
url:"../../views/ajax.php",
method:"POST",
data:dato,
cache:false,
contentType: false,
processData:false,
xhrFields: {
responseType: 'blob'
},
beforeSend: function() {
$("#loading").removeClass('d-none');
},
success: function(regresos){
$("#loading").addClass('d-none');
descargar(regresos, nombre);
}
});
}
}
});
});
Las funciones de php que procesan las peticiones son las siguientes:
if(isset($_POST['getpdfdescargar']) && isset($_POST['token'])){
session_start();
//Se valida si el identificador es correcto
$instancia = new usuarioController();
$resultado = $instancia->validarIDPostulado($_POST['token']);
if($resultado==false){
//Error al desencriptar el Token
echo 1;
}else{
//Token válido
echo 2;
}
}
if(isset($_POST['getpdfdescargar2']) && isset($_POST['token'])){
session_start();
//Se valida nuevamente si el identificador es correcto
$instancia = new usuarioController();
$resultado = $instancia->validarIDPostulado($_POST['token']);
if($resultado==false){
//Error al desencriptar el token
echo 1;
}else{
//Se inicializa la generación del pdf
$pdf = new pdfcontroller();
$pdf->generarPdf($resultado);
}
}
El jquery inicial tiene una función que recibe el pdf e inicia la descarga. La función se llama "descargar", la cual sospecho que de aquí venga el problema porque testeando las funciones en php, todos los parámetros llegan sin problema y si recibe el blob de regreso, pero no se inicia la descarga. Este es el código:
function descargar(blob, nombre){
var a = document.createElement('a');
var url = window.URL.createObjectURL(blob);
a.href = url;
a.download = 'perfil_'+nombre+'.pdf';
a.click();
window.URL.revokeObjectURL(url);
}
Este asunto me tiene liado y ya he buscado documentarme pero no encuentro nada relacionado. Gracias por echarle un vistazo.
createObjectURL()
(que es mayor que el tamaño del propio PDF). Sin embargo las descargas del navegador requieren mucha menos memoria, apenas un búfer para la descarga en disco de lo que se va recibiendo poco a poco por HTTP.