Ein PNG-Bild von PHP mit AJAX erhalten

Ich habe ein PHP-Skript, das den nächsten Wert in einer Zeitreihendaten berechnet und das in einem Diagramm als PNG-Bild darstellt. Ich werde diese Daten über AJAX bereitstellen, und PHP erstellt das PNG-Bild. Nun, wie bekomme ich das generierte PNG-Bild von PHP als AJAX-Antwort? Der Code lautet wie folgt:Ein PNG-Bild von PHP mit AJAX erhalten

PHP:

<?php 

$data = json_decode($_POST['data']); 
// Some code to calculate the next value in this series 
plotRenderRegression($polynomialRegression, $coefficients, 0, 11 , $colorMap[ "Blue" ]); 

header("Content-Type: image/png"); 
echo imagePNG($image); 
?>

JS:

$.post({ 
    dataType: "image/png", 
    url: "predict.php", 
    data: { 
     sent: true, 
     data: "[[1,0.63151965],[2,0.58534249],[3,0.43877649],[4,0.2497794],[5,0.07730788],[6,0.08980716],[7,0.11196788],[8,0.19979455],[9,0.4833865],[10,0.9923332]]" 
    }, 
    success: function (img) { 
     console.log(img) 
     i = new Image(); 
     i.src = img; 
     console.log(img); 
     $("#imgdiv").prepend(i); 
    }, 
    error: function (error, txtStatus) { 
     console.log(txtStatus); 
     console.log('error'); 
    } 
});

Konsolenausgabe:

�PNG 


IHDRX�Ao�NPLTE������00�������000������������333MMMfff���������������vD���IDATx��][��*�*>���o���$ ?$[��ɑq� Ι�����������2������Fp�;D33������c���وeĪF�iO̮H�����r*3'���[N 
o~p#���X��ˀ���ub��T�X�,���׽���q�.�R��}� �]��#æy����l}� 
}:U���,�����'�w�W_�0S9ԡ�wl�0�עOfTc8qw��9,=�s����7��^��h�U�1b-��?��鎿G����Ag��}����7Gg��GY���R��4y� LE����8'o� �+L>A��ʻ�e�hry��سد�끷�j����`#�����)ժϜΟc-)_ck��� ���=2�W�rY�X�gY]���1�H�T�3�*�]'�V�T̼t$���ྑN��&�K���%qp�cuf���2}8����`�PA'VF%6�PoC-6!���ky����8䪏U�:������,�Ƌ� 
�9Uby���W� 
���共� .....

Was mache ich falsch hier?

UPDATE 1:

ich die JS-Code geändert haben, wie folgt, aber es immer noch ein gebrochenes Bild

success: function (data) { 
    $('#imgdiv').html('<img src="data:image/png;base64, ' + btoa(unescape(encodeURIComponent(data))) + '" />'); 
}

Quelle

2016-04-18 Aditya Vikas Devarapalli

haben Sie bei dieser Antwort sah http://stackoverflow.com/a/13265644/689579? – Sean

oder diese http://stackoverflow.com/a/10802497/689579? – Sean

Siehe http://stackoverflow.com/questions/12876000/how-to-build-pdf-file-from-binary-string-returned-from-a-web-service-using-javas/ – guest271314

Sie können nicht SRC selbst auf dem Bild gesetzt bekommen. Sie können das Problem auf zwei Arten lösen:

1- eine temporäre Datei erstellen und einen Link, um es in Ihrem PHP-Datei

2- base64 kodieren die PNG zurückkehren und übergeben Sie es so, wie Sie sind momentan src tun.

Auf beiden Wegen müssten Sie wahrscheinlich den Filter "dataType" von jQuery verlieren, damit die Antwort als erfolgreich interpretiert wird.

Beispiel der endgültigen HTML (src über Ihre JavaScript Ajax eingestellt):

<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNby // blAAAADElEQVQImWNgoBMAAABpAAFEI8ARAAAAAElFTkSuQmCC />"

<img src="data:image/png;base64,[base64_encoded_png_goes_here] />"

Quelle

2016-04-18 04:11:01 henry700

Es scheint immer noch nicht zu arbeiten @ henry700 –

Ein PNG-Bild von PHP mit AJAX erhalten

Antwort

Verwandte Themen