kostenloser Webspace werbefrei: lima-city


Bilder verkleinern

lima-cityForumProgrammiersprachenPHP, MySQL & .htaccess

  1. Autor dieses Themas

    shufggy

    shufggy hat kostenlosen Webspace.

    Seit Tagen google ich, tippe ich, versuche ich.... verzweifel ich :frown:

    Ich möchte Bilder, die auf dem Server sind, mit PHP auf eine maximale breite von 100 (oder Höhe, je nachdem ob das Bild Hochkant ist oder nicht) verkleinern und die dann ausgeben.

    Ich habe jetzt gegooglet wie bekloppt, alles an "imagecopyresized" über "imagecreatefromjpeg" ausprobiert, aber ohne Erfolg =(


    $file = $nickname."/".$name;
    	
    	
    	if (file_exists($file)) {
    	
    	// Originalformat auslesen
    	
    	$size = getimagesize($file);
    	$width_old = $size[0];
    	$height_old = $size[1];
    	
    	
    	// Bild laden
    	$old_picture = imagecreatefromjpeg($file);
    	// Neues Format definieren, dabei Proportionen beibehalten
    	if ($width_old > $height_old) {
    	$width_new = 100;
    	$height_new = intval($height_old * $width_new / $width_old);
    	} else {
    	$height_new = 100;
    	$width_new = intval($width_old * $height_new / $height_old);
    	}
    	// Neues Bild erzeugen
    	$new_picture = imagecreatetruecolor($width_new, $height_new);
    	// Kopiert das Ursprungsbild und formatiert es um + Weichzeichnung.
    	imagecopyresampled($new_picture, $old_picture, 0, 0, 0, 0, $width_new, $height_new, $width_old, $height_old);
    	
    	// Erzeugtes Bild an den Browser ausgeben
    	imagejpeg($new_picture);
    	}


    Der Code ist jetzt von hier. Hatte schon andere ausprobiert, selbst was getippt. Hat alles nichts geholfen.

    Bei der Ausgabe des Bildes bekomm ich dann immer nur dämliche Hex-Zeichen, Das "Gebrochene-Bild-Symbol" oder gar nichts.


    Ich habe übrigens alles in einer Datei.
    Formular zum Hochladen des Bildes, sammeln und ausgeben der Bild-Infos und dann soll das verkleinern und anzeigen des verkleinerten Bildes kommen.

    Habt ihr noch eine Idee?
  2. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

  3. t*****b

    Der Browser weiß nicht, dass es sich um ein Bild handelt, da du

    header('Content-type: image/jpeg');


    vergessen hast.
  4. shufggy schrieb:
    Ich habe übrigens alles in einer Datei.
    Formular zum Hochladen des Bildes, sammeln und ausgeben der Bild-Infos und dann soll das verkleinern und anzeigen des verkleinerten Bildes kommen.

    Habt ihr noch eine Idee?

    ho ;)

    Wie meinst du das... Alles in einer Datei?
    Abgesehen davon, dass man das aus Stil- und vor allem Übersichtsgründen nicht tun sollte, ist es in diesem Fall auch noch knifflig, da du zwei verschiedene Typen der Ausgabe hast.

    Wenn ich dich richtig verstehe, ist deine Seite nun so aufgebaut:
    Teil 1:
    Erklärungstext, Formular zum Bild Hochladen, usw... und ein Abschicken Button.
    Teil 2: (nach dem Abschicken)
    Es ist nur das Bild als Thumbnail (also verkleinert) zu sehen. (Aber sonst nichts, also keine Überschrift, und gar nichts außer dem Bild.)

    Wenn das so ist, dann musst du in deinem Code nur darauf achten, dass du den Content Type richtig gesetzt hast. (Der Code von der Homepage, den du gepostet hast, sieht gut aus.)
    Das bedeutet, dass du vor der Ausgabe des Bildes den Content Type auf image/jpeg setzen musst. Und da du viel anderes Zeug in der Datei stehen hast, kannst du das auch direkt vor der Ausgabe machen: (Sieht zwar nicht schön aus, sollte aber funktionieren.)
    header('Content-type: image/jpeg');
    // Erzeugtes Bild an den Browser ausgeben
    imagejpeg($new_picture);

    Wirklich wichtig ist hierbei nur, dass du wirklich keine anderen Ausgaben auf dieser Seite (also dem 2. Teil) hast. (Kein echo, kein print, kein Text außerhalb von <?php ?>)

    Hier noch ein kleines Beispiel zum besseren Verständnis:
    <?php
    if(!isset($_POST['pictureUpload'])) {
      // Hier ist dein Content (Teil 1) mit dem Formular...
      echo 'Bitte lade ein Bild hoch.';
    }
    else {
      // Hier ist dein Bildbearbeitungs-PHP Code, also Teil 2 (vergiss nicht auf den Content-Type).
      // Abgesehen von "imagejpeg($new_picture);" darf es hier keine Ausgabe geben.
    }
    ?>


    Alles klar?

    lg
    Sincer

    PS: Falls du bei der 2. Ansicht (Teil 2) doch eine Überschrift, oder noch anderen Content posten willst, kann ich dir versprechen, dass du garantiert nicht mit einer einzelnen PHP File auskommen wirst. (Genaueres dazu erkläre ich dir gerne, falls du es brauchst.)
  5. Autor dieses Themas

    shufggy

    shufggy hat kostenlosen Webspace.

    Den Content-Teil hab ich auch ausprobiert hinzusetzen. Da ich weiß, dass der vor der ersten Ausgabe sein muss, habe ich den schon an allen möglichen Stellen hingesetzt, sogar als Meta-Tag -.- Aber es funktioniert auch nicht.

    Kann sein, dass der Code nicht schön anzusehen ist, aber ich komm soweit klar :D Außer das genannte Problem....
    Ich habe auch schon versucht es über mehrere Dateien zu teilen, aber leider auch erfolglos =(


    Unten mal der komplette code...
    Habe jetzt absichtlich den Content-Code weggelassen, damit ihr mir sagen könnt, wie ich den wo am besten hinmachen sollte, da ich den wie gesagt schon überall mal hatte

    <html>
    <head>
    	<title>Bilder-Verkleinern</title>
    </head>
    <body>
    <form action="<?php echo $_SERVER['PHP_SELF'] ?>" method="POST" enctype="multipart/form-data">
    <table class="foren">
            <tr>
                <td class="text"><b>Nickname: </b></td>
                <td><input name="nickname" class="feld" type="text" /></td>
            </tr>
            <tr>
                <td class="text"><b>Bild: </b></td>
                <td><input name="datei" class="feld" type="file" /></td>
            </tr>
            <tr>
                <td colspan="2" align="center"><input type="submit" name="senden" class="button" value="Hochladen" /></td>
            </tr>
    </table>
    </form>  
    
    <?php
    
    //Daten einlesen + Bild hochladen
    
    $nickname = $_POST['nickname'];
    if(isset($_POST['senden']))
    {
    	if(!empty($nickname))
    	{
    	$dateityp = getimagesize($_FILES['datei']['tmp_name']);
    	
    	//INFOS UEBER DAS BILD
    	$tempname        =    $_FILES["datei"]["tmp_name"];
    	$name        =    $_FILES["datei"]["name"];
    	$size            =    $_FILES["datei"]["size"];
    	$type            =    $_FILES["datei"]["type"];
    	
    	$size = $size / 1024 / 1024;
    	$size = substr($size, 0, 4);
    	
    	echo "Hier ein paar Infos &uuml;ber das von Dir hochgeladene Bild: <br>";
    	echo "<b>Name:</b> ".$name."<br>";
    	echo "<b>Gr&ouml;&szlig;e:</b> ".$size." MB<br>";
    	echo "<b>Dateityp:</b> ".$type."<br>";
    	
    	
    			if($dateityp[2] == 0)
    			{
    				echo "Bitte nur Bilder im Gif bzw. jpg Format hochladen";
    			}
    			else
    			  {
    			  mkdir($nickname);
    			  move_uploaded_file($_FILES['datei']['tmp_name'], $nickname."/".$_FILES['datei']['name']);
    			  echo "Das Bild wurde Erfolgreich hochgeladen";
    			  }
    			  
    			  
    			  
    			  
    	//Bildgroesse aendern...
    	$file = $nickname."/".$name;
    	
    	
    	if (file_exists($file)) {
    	
    	// Originalformat auslesen
    	
    	$size = getimagesize($file);
    	$width_old = $size[0];
    	$height_old = $size[1];
    	
    	
    	// Bild laden
    	$old_picture = imagecreatefromjpeg($file);
    	// Neues Format definieren, dabei Proportionen beibehalten
    	if ($width_old > $height_old) {
    	$width_new = 100;
    	$height_new = intval($height_old * $width_new / $width_old);
    	} else {
    	$height_new = 100;
    	$width_new = intval($width_old * $height_new / $height_old);
    	}
    	// Neues Bild erzeugen
    	$new_picture = imagecreatetruecolor($width_new, $height_new);
    	// Kopiert das Ursprungsbild und formatiert es um + Weichzeichnung.
    	imagecopyresampled($new_picture, $old_picture, 0, 0, 0, 0, $width_new, $height_new, $width_old, $height_old);
    	
    	// Erzeugtes Bild an den Browser ausgeben
    	imagejpeg($new_picture);
    	}
    
    	}
    	
    }
    
    ?>
    </body>
    </html>
  6. Den Dateityp musst du in dem Script, das dein Bild erstellt (also dem aus aus dem Eröffnungsbeitrag), angeben. Wo genau das angegeben wird, ist ziemlich egal, aber es muss auf jeden Fall vor imagejpeg() angegeben werden. Du kannst den Code also z.B. in der Zeile über imagejpeg() oder auch gleich in der Zeile nach <?php einfügen. Ihn über dem HTML-Dokument an zu geben, wäre jedoch falsch. Damit würdest du den Browser glauben lassen, dass das HTML-Dokument ein Bild sei. Das ist es natürlich nicht, somit könnte nichts angezeigt werden.

    Beitrag zuletzt geändert: 30.1.2011 21:14:34 von drafed-map
  7. ho shufggy ;)

    So wie du es angehst, kann es nicht funktionieren. (Das hat was mit dem HTTP Protokoll Header zu tun, der festlegt, was da über die Leitung an den Browser gesendet wird, damit der Browser weiß, was da jetzt auf ihn zukommt.)

    Kurze Erklärung damit du das Problem verstehst: Sobald du die erste Ausgabe machst. (Die passiert bei dir in der 1. Zeile mit "<html>") schickt der Server (Lima-City) an den Client (Browser) eine Nachricht, in der steht, dass der Browser nun ein HTML (bzw. Text) Dokument anzeigen soll, und alles, was jetzt kommt, auch HTML sein wird...
    Jetzt willst du dem Browser ein Bild schicken, der glaubt aber, dass er ein HTML Dokument bekommt, interpretiert also die Bits vom Bild z.B. als UTF8 (und nicht als JPG Bild-Datei) und was du siehst, sind komische Zeichen...

    Wenn man dieses Problem kennt (und das tust du jetzt ;) ) kann man es ganz einfach beheben.
    Ich habe es bereits erwähnt: Keine Ausgabe außer dem Bild. Kein echo, kein print, und keine andere Ausgabe, auch nicht außerhalb des <?php ?> Teils.
    In deiner 1. Zeile steht allerdings etwas außerhalb der PHP-Tags (nämlich <html>) und somit schickst du an den Browser schon die Information, dass nun kein Bild mehr folgt.

    Was du also tun musst, ist folgendes (Ich habe es in meinem Beispielcode schon angedeutet):
    Du öffnest in den ersten Zeile den PHP Teil ("<?php") und machst ihn in der letzten Zeile zu ("?>"). Dazwischen wird er nicht angerührt.
    Gleich in der 2. Zeile machst du ein if(), dass dir überprüft, ob du das Bild nun hochgeladen / vom Client gesendet wurde, oder nicht.
    Innerhalb dieser if-Bedingung legst du deinen gesamten HTML-Code behutsam in ein (oder auch gerne mehrere) echo' ';
    Nach der Bedingung folgt ein else, in welches du deinen gesamten Bild-PHP Code legst.
    Nach dem else flogt nur mehr der schließende PHP Tag, sprich, die Datei ist damit zu Ende.

    Kannst du das nachvollziehen? Probier's mal aus ;)

    Noch ein kleiner Hinweis zum echo...
    Ich empfehle dir echo mit einfachen Anführungszeichen ( ' ' ) zu verwenden. (Die doppelten ( " " ) sind zwar praktisch, aber wenn man sich nicht auskennt, können sie auch verwirrend sein.)
    Auf Probleme könntest du dann in deiner 6. Zeile stoßen. Die sieht dann so aus:
    echo '<form action="'.$_SERVER['PHP_SELF'].'" method="POST" enctype="multipart/form-data">';


    Ich hoffe du verstehst, worauf ich hinaus will ;)

    lg
    Sincer

    PS: Du könntest vom dem Ergebnis allerdings etwas enttäuscht sein. Es handelt sich nicht um eine Seite, in die ein kleineres Bild eingehüllt ist, sondern nur um das kleine Bild, als würdest du es in einem Bildbetrachtungsprogramm öffnen.


    PPS: Ich war mal so frei, und habe dir dein Script umgebastelt:

    Ich bin schon etwas eingerostet, was PHP angeht xD
    Zur Erklärung: Ich habe das Prinzip umgesetzt, dass ich dir in diesem (und auch im vorherigen) Post erklärt habe.
    Dieses Script speichert das gesendete Bild nun im Ordner "img" ab. (Dieser Ordner muss schon existieren. Interessanterweise ging mkdir() nicht. Ich bekam einen Error, dass damit auch Daten an den Host gesendet werden, und damit das Bild nicht mehr angezeigt werden kann... Das wundert mich etwas. Habe aber jetzt nicht die Zeit, mich länger damit zu beschäftigen.)
    Das Bild wird also jetzt im Ordner "img" in Originalgröße und als Thumbnail gespeichert. Dem User wird nur das Thumbnail geschickt.
    Der Code ist soweit kommentiert. Du solltest also keine Probleme haben es zu verstehen, und an deine Bedürfnisse anzupassen.

    <?php
    if(!isset($_POST['senden'])) {
    	echo '
    	<html>
    	<head>
    		<title>Bilder-Verkleinern</title>
    	</head>
    	<body>
    
    	<form action="'.$_SERVER['PHP_SELF'].'" method="POST" enctype="multipart/form-data">
    	<table class="foren">
    		<tr>
    			<td class="text"><b>Nickname: </b></td>
    			<td><input name="nickname" class="feld" type="text" /></td>
    		</tr>
    		<tr>
    			<td class="text"><b>Bild: </b></td>
    			<td><input name="datei" class="feld" type="file" /></td>
    		</tr>
    		<tr>
    			<td colspan="2" align="center"><input type="submit" name="senden" class="button" value="Hochladen" /></td>
    		</tr>
    	</table>
    	</form>  
    
    	</body>
    	</html>
    	';
    }
    
    //Daten einlesen + Bild hochladen
    else {
    	$nickname = $_POST['nickname'];
    	
    	if(!empty($nickname)) {
    		$dateityp = getimagesize($_FILES['datei']['tmp_name']);
    		$ordner = "img";
    		
    		if($dateityp[2] == 0)
    		{
    			echo '
    			<html>
    			<head>
    				<title>Error</title>
    			</head>
    			<body>
    				Bitte nur Bilder im Gif bzw. jpg Format hochladen... (Hier könnte man einen Zurück-Link einbauen...)
    			</body>
    			</html>
    			';
    		}
    		else {
    			// mkdir sendet scheinbar eine Message an den Client (wusste ich selbst nicht, und wundert mich ein wenig...)
    			// Deswegen scheint das nicht zu gehen. (Vil. irre ich mich, aber bei mir ging es jedenfalls nicht...)
    			// mkdir($nickname);
    					  
    			//Bildgroesse aendern...
    			$file = $_FILES['datei']['tmp_name'];
    			
    			// if (file_exists($file)) {
    			// Originalformat auslesen
    			$size = getimagesize($file);
    			$width_old = $size[0];
    			$height_old = $size[1];
    			
    			// Bild laden
    			$old_picture = imagecreatefromjpeg($file);
    			
    			// Original abspeichern:
    			imagejpeg($old_picture, $ordner.'/'.$nickname.'_big.jpg', 100);
    			
    			// Neues Format definieren, dabei Proportionen beibehalten
    			if ($width_old > $height_old) {
    				$width_new = 100;
    				$height_new = intval($height_old * $width_new / $width_old);
    			} else {
    				$height_new = 100;
    				$width_new = intval($width_old * $height_new / $height_old);
    			}
    			// Neues Bild erzeugen
    			$new_picture = imagecreatetruecolor($width_new, $height_new);
    			// Kopiert das Ursprungsbild und formatiert es um + Weichzeichnung.
    			imagecopyresampled($new_picture, $old_picture, 0, 0, 0, 0, $width_new, $height_new, $width_old, $height_old);
    			
    			// Browser darauf vorbereiten, dass er ein Bild empfängt:
    			header('Content-type: image/jpeg');
    			
    			// Thumbnail speichern:
    			imagejpeg($new_picture, $ordner.'/'.$nickname.'_small.jpg', 100);
    			
    			// Erzeugtes Bild an den Browser ausgeben:
    			imagejpeg($new_picture, NULL, 100);
    		}
    	}
    }
    ?>


    HF ;)

    Beitrag zuletzt geändert: 30.1.2011 23:59:42 von sincer
  8. Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!

    lima-city: Gratis werbefreier Webspace für deine eigene Homepage

Dir gefällt dieses Thema?

Über lima-city

Login zum Webhosting ohne Werbung!