upload image base64 pe server

[andras]

Salut,
Am un div de forma asta, cu imagine cu sir base64:

Cod: Selectaţi tot

<div class="container text-center" style="border: 1px solid #a1a1a1;padding: 15px;width: 70%;">
  <img src="data:image/png;base64,{{DNS2D::getBarcodePNG($vinzare->id, 'QRCODE')}}" alt="barcode" />
  </div>

adica un div in care generez un cod de bare.
Cum salvez acest div ca imagine (PNG, JPG) pe server intr-un folder in care am drept de scriere? Care ar fi cea mai eleganta cale? Stiu ca am nevoie de ajax (preferabil JQuery ca il stiu mai bine), dar ce variabile folosesc? Acest fisier imagine il folosesc ulterior ca atasament la un mail. Multumesc.

Salut
Poti sa preiei sirul base64 din image src si-l trimiti prin POST la server (tagul <img> sa aibe un id).
In php decodezi sirul primit si-l salvezi intr-un fisier cu extensia imaginii.

- In html:

Cod: Selectaţi tot

<img id='img_id' src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAU1QTFRFNjtAQEVK////bG9zSk9T/v7+/f39/f3+9vf3O0BETlJWNzxB/Pz8d3t+TFFVzM3O1NXX7u/vUldbRElNs7W3v8HCmZyeRkpPW19j8vLy7u7vvsDC9PT1cHR3Oj9Eo6WnxsjJR0tQOD1Bj5KVgYSHTVFWtri50dLUtLa4YmZqOT5D8vPzRUpOkZOWc3Z64uPjr7Gzuru95+jpX2NnaGxwPkNHp6mrioyPlZeadXh8Q0hNPEBFyszNh4qNc3d6eHx/OD1Cw8XGXGBkfoGEra+xxcbIgoaJu72/m52ggoWIZ2tu8/P0wcLE+vr7kZSXgIOGP0NIvr/BvL6/QUZKP0RJkpWYpKaoqKqtVVldmJqdl5qcZWhstbe5bHB0bnJ1UVVZwsTF5ubnT1RYcHN3oaSm3N3e3NzdQkdLnJ+h9fX1TlNX+Pj47/DwwsPFVFhcEpC44wAAAShJREFUeNq8k0VvxDAQhZOXDS52mRnKzLRlZmZm+v/HxmnUOlFaSz3su4xm/BkGzLn4P+XimOJZyw0FKufelfbfAe89dMmBBdUZ8G1eCJMba69Al+AABOOm/7j0DDGXtQP9bXjYN2tWGQfyA1Yg1kSu95x9GKHiIOBXLcAwUD1JJSBVfUbwGGi2AIvoneK4bCblSS8b0RwwRAPbCHx52kH60K1b9zQUjQKiULbMDbulEjGha/RQQFDE0/ezW8kR3C3kOJXmFcSyrcQR7FDAi55nuGABZkT5hqpk3xughDN7FOHHHd0LLU9qtV7r7uhsuRwt6pEJJFVLN4V5CT+SErpXt81DbHautkpBeHeaqNDRqUA0Uo5GkgXGyI3xDZ/q/wJMsb7/pwADAGqZHDyWkHd1AAAAAElFTkSuQmCC">

<script>
// <![CDATA[
// Ajax, receives the url of file to access, data to send, and a callback function (called when the response is received)
function ajaxSend(url, data, callback){
  var ob_ajax = (window.XMLHttpRequest) ? new XMLHttpRequest() : new ActiveXObject('Microsoft.XMLHTTP');  // XMLHttpRequest object

  //put data from "data" into a string to be send to "php"
  var str_data ='isajax=1';  // to know in php it is ajax request
  for(var k in data){
    k = k.toString();  //convert numeric key to string

    //build the string with data to be sent
    str_data +='&'+ k +'='+ data[k].toString().replace('+', '%2B').replace(/\?/g, '%3F').replace(/=/g, '%3D').replace(/&/g, '%26').replace(/[ ]+/g, '%20').replace(/[\+]/g, '%2B');
  }
/// alert(str_data);  //for debug, to see the string that is sen

  //send data to php
  ob_ajax.open('POST', url, true);
  ob_ajax.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
  ob_ajax.send(str_data);

  //check the state request, if completed, pass the response to callback function
  ob_ajax.onreadystatechange = function(){
    if(ob_ajax.readyState == 4){
/// alert(ob_ajax.responseText);  // debug
      callback(ob_ajax.responseText.trim());
    }
  }
}

//get base64 string fro image src
var strb64 = document.querySelector('#img_id').getAttribute('src').replace('data:image/png;base64,', '');

//send data to ajax
ajaxSend('script.php', {imgb64:strb64}, function(res){
  console.log(res);
});
// ]]>
</script>

- In php:

Cod: Selectaţi tot

if(isset($_POST['imgb64'])){
  $imgb64 = base64_decode($_POST['imgb64']);
  file_put_contents('imgb64.png', $imgb64);
}