Hjälp med foto beskärnings app!

Bilden sparas som base64-kodad PNG i variabeln dataUrl. Stoppa det värdet i ett formulärsfält, eller posta via ajax, till servern och packa upp datat med base64_decode.

Okej, ska se om jag kan fixa till det för fattar nada av base64 saken...

Ok, det är inte så komplicerat. De flesta bildformat innehåller binärt data. base64 är ett sätt att koda (binärt) data med enbart ascii-tecken. Detta för att det skall gå att transportera binärt data via andra format som i sig inte tillåter binärt data. Som exempelvis när du skickar ett mail. base64_decode tar alltså en sträng med ascii-tecken och avkodar det till orginaldatat som ofta är binärt, som i detta fall en PNG-bild.

Nu har jag sökt runt och fattar inte hur jag ska skriva iallafall! Hur skriver jag i denna? Och vilket värde skall jag spara informationen i php sen?

  <script type="text/javascript">
    $(function() {
      $(".coverphoto").CoverPhoto({
        currentImage: '<?php echo $base_url; ?>coverphoto/funny.jpg',
        editable: true
      });
      $(".coverphoto").bind('coverPhotoUpdated', function(evt, dataUrl) {
        $(".output").empty();
        $("<img>").attr("src", dataUrl).appendTo(".output"); 
      });
    });
  </script>

Filen ska typ heta savephoto.php som jag skall spara ner detta. Kommer inte att skriva ut den omskurna bilden som den gör utan har hidden på .output

Varför ska du ha output om du inte ska visa något? Då räcker det ju att skicka base64-koden till servern.

Det var så i koden på scriptet. Så nu vill jag ha hjälp hur jag ska skriva för att spara ner det via ajax!

  <script type="text/javascript">
    $(function() {
      $(".coverphoto").CoverPhoto({
        currentImage: '<?php echo $base_url; ?>coverphoto/funny.jpg',
        editable: true
      });
      $(".coverphoto").bind('coverPhotoUpdated', function(evt, dataUrl) {
        $(".output").empty();
        $("<img>").attr("src", dataUrl).appendTo(".output"); 
        var imageData = dataUrl.replace(/^.*?base64,/i, ""); // URLen börjar med data:image/png;base64, - Det tar vi bort.
        $.post("http://www.yourdomain.se/savephoto.php", { myImage: imageData } );
        });
    });
  </script>

<?php
$file = fopen("/path/to/your/image.png","wb");
fwrite($file,base64_decode($_POST["myImage"]));
fclose($file);
?>

Skall php koden vara savephoto.php eller hur är det tänkt? Sökvägen på fopen förstår jag ju men vilken bild menar du man skall skriva där? Är väl det värdet som kommer i myImage? Eller vad är det jag inte förstår?

Asa skrev:

Skall php koden vara savephoto.php eller hur är det tänkt?

Yes, korrekt.

Asa skrev:

Sökvägen på fopen förstår jag ju men vilken bild menar du man skall skriva där?

Det är sökvägen till den beskärda bilden som du vill spara... Antar att det var det du ville åstakomma? Filen skapas med bilddatat som skickas via ajax.

Asa skrev:

Är väl det värdet som kommer i myImage? Eller vad är det jag inte förstår?

Värdet som kommer i post-variabeln myImage är ren PNG-data som sparas direkt ner i filen. Jag vet inte vad det är du inte förstår :)

Okej så jag ska alltså ge bilden ett eget namn i savephoto.php?

Jao, det känns som en god idé så skrivs inte samma fil över hela tiden. :) Antar att du har något användar-id som kan vara lämligt att använda.

Okej, får testa imorgon om jag får igång det för idag gick det inge bra. :/ Är nog för trött.
Kan man på nå vis se i en alert namnet på bilden när man klickar på Spara också?

Samt kan man skriva ut om man skrivit fel sökväg i savephoto.php ? Så jag verkligen vet att det är rätt!

alert är en javascript-funktion som körs i webbläsaren. Filnamnet som bilden har innan du beskär den är tämligen irrelevant. Om 2 använder använder en bild med samma namn ska dom ju inte påverka varandra. Så det namnet bör du inte använda på serversidan.

Beträffande sökvägen på serversidan är ett tips att använda dirname(_FILE_) som returnerar sökvägent till katalogen där php-scriptet körs ifrån. Så ungefär:

$file = fopen(dirname(__FILE__)."/$uniqueFileName.png","wb");

$uniqueFileName skall då innehålla filnamnet som bilden skall sparas som.

Det verkar ta tid innan bilden kan visas fast den har sparats i mappen. Låter detta konstigt eller är det så? Sen är det problem att skriva över filen? Måste man skriva något speciellt?

Prova

$file = fopen(dirname(__FILE__)."/$uniqueFileName.png","w+b");

Istället för att kunna skriva över filen. Alternativt, radera filen med unlink innan du skriver till den. Låter konstigt att den inte kan visas på en gång. Antagligen släpper inte php filen på en gång. Har inget bra svar på det.

Tackar för svaret. Kanske är servern som är seg..