✔ Bildpfad auslesen aus HTML Code! Oder: FckEditor Hack!

mille

mille

Erfahrenes Mitglied
Hallo!

Ich habe folgendes vor:
Mit Hilfe des FCK Editors habe ich ein kleines CMS (wenn man es so nennen will) gebastelt. Hierbei bietet der FCK editor auch die Möglichkeit den Server nach Bilddateien zu durchsuchen und anzuzeigen. Das klappt auch (vorerst) soweit. Wenn der gute nichtsahnende Administrator (Der ja keine Ahnung hat - wir gehen von einem DAU aus) ein Foto hochläd, hat dies mit hoher Wahrscheinlcihkeit exorbitante Ausmaße (Wie man es von den gängigen Digitakameras mit 4MPixel und mehr Pixel gewohnt ist).
Solche großen bilder können vom admin mit Hilfe der Einstellung "width" und "height" skaliert werden.
Allerdings werden die bilder nur kleiner angezeigt, werden aber dennoch in den großen Ausmaßen vom Server geladen, da die Skalieriung ja nur aufm Client (beim PArsen des HTML Codes) geschieht.

Daher nun 2 Lösungsvorschläge, wobei ich mich bisher schon für einen entschieden hab, mich aber gerne umstimmen lasse.
1. Möglichkeit:
Der FCKEditor gibt ja HTML quellcode zurück. Diesen könnte man ja mittels preg_match auslesen. Genauer: die width, height und src angaben im image tag. Dann hab ich den Pfad zum Bild und die bevorzugte Größe des Bildes (dieses kann dann mittels php direkt skaliert werden - was sich ja auf die Speicherplatzgröße auswirkt).

Hier ein Beispielquellcode ausm FCK:
PHP: 
<img width="300" height="225" src="/Image/kunden-domain/J4100031.JPG" alt="" /> Hier haben wir nun ein Bild mitten auf einer Seite, welches viel zu gro&szlig; ist.<br />Dieses soll ausglesen werden (Aus dem quelltext).<br />Hier nochn ein bisschen, text, d<sub>as d</sub>en quellcode verkompliziert. n<sup><strike><u><em>och ne tabelle und so<br /></em></u></strike></sup>
<ul>
    <li><sup><strike><u><em>{&yuml;</em></u></strike></sup></li>
</ul>
<table width="200" cellspacing="1" cellpadding="1" border="1" align="" summary="">
    <tbody>
        <tr>
            <td bgcolor="#ff3333">&nbsp;</td>
            <td bgcolor="#ff3333">&nbsp;</td>
        </tr>
        <tr>
            <td bgcolor="#ff3333">&nbsp;</td>
            <td bgcolor="#ff3333">&nbsp;</td>
        </tr>
        <tr>
            <td bgcolor="#ff3333">&nbsp;</td>
            <td bgcolor="#ff3333">&nbsp;</td>
        </tr>
    </tbody>
</table>

Ich würde mich freuen, könnte mir jmd, den entsprechenden regulären Ausdruck posten :)

2. Möglichkeit
Beim Auslesen der Bilder vom Server und der eingabe der Width und Height Werte im entsprechenden Dialog (des FCK) könnte ein kleiner Hack eingebaut werden. Dann spart man sich das auslesen des HTML Codes, da das Bild simultan bei der Bearbeitung skaliert wird.
Hierbei ist aber das Problem, ersteinmal im FCKEditor Quelltext wirr-warr durchzusehen, was ja voraussetzung für ein angemessenen Hack ist.

Wenn hier jemand weiss, an welcher Stelle eine entsprechende PHP Funktion resize($bildname, $neue_width, $neue_height) eingebaut werden kann, wäre das auch hilfreich.

Persönlich vermute ich aber, das die 1. Möglichkeit die bessere Lösung ist.
Auf die Effizienz muss nich geachtet werden, da es vergleichsweise selten vorkommt, das ein Bild skaliert werden muss. Und der Admin kann gerne mal 0,3 Sekunden warten, bis der Quelltext geparst und gespeichert wurde - sofern danach alles prima :).

MfG
Basti
Danke für eure Anteilnahme
 
Ich sag mal nein.
Aber es würde ja ersteinmal reichen, wenn ich aus dem HTML code ein Array auslesen kann, das erstmal nur ALLE img Tags (vollständig) beinhaltet
Sprich so hier:
PHP: 
$htmlcode = "<html> ..... <img ....> usw. ....</html>";

$alle_img_tags = get_img_tags($htmlcode);

var_dump($alle_img_tags);
/**
* gibt sowas aus wie:
* [0] = "<img src="...." height="...." ....>
* [1] = "<img height="..." src="..."....>
* usw. 
*/

Das hab ich bisher (leider noch nicht ganz funktionstüchtig, da es nur das erste IMG-Tag liefert.
PHP: 
function get_img_tags($pattern, &$string, $limit=-1, $flag=-1){
    
    $arr = ($limit==-1&&$flag==-1)?preg_split($pattern, &$string):preg_split($pattern, &$string, $limit, $flag);
    $img_arr = array();
    
    foreach($arr as $line){
        
        $pruefling = substr($line, 0, 4);
        
        if($pruefling == "<img"){
            $img_arr = $line;
        }// end if
    }// end if
    
    return $img_arr;
}// end get_img_tags

$pattern = "/(.*?)(\<img(.*?)\>)(.*?)/i";
$arr = get_img_tags($pattern, $string, -1, PREG_SPLIT_DELIM_CAPTURE);
var_dump($arr);


PS: aus den img Tags dann später die relevanten Daten auszulesen ist ja nicht mehr so schwer, das lässt sich ja notfalls auch mit explode("leerzeichen") und ein paar vergleichen machen, da ein IMG tag ja nur n paar wenige attribte hat.
 
das ist alles.
krass.
Danke, ich schau mal ob ich das ganze nun weiterverarbeiten kann oder ob ich hilfe brauch.

Danke Sven :)
 
Hallo!

Ich habs jetzt seit 2 Tagen versucht.
Leider bekomme ich die Height, Width und Src angaben nicht so extrahiert wie ich mir das vorstelle. Zwar gäbe es da für mich Möglichkeiten, das wäre mir aber zu unsauber programmiert.

Könnt ihr mir vielleicht entsprechend helfen?
so das aus

$imgtag = <IMG src="/images/headerg1x1.gif" width="137" height="155" border="0" alt="php developer community" USEMAP="#headerlogo1_Map">;

folgendes wird:
PHP: 
$arr = lese_aus($imgtag);

var_dump($arr)
/**
* ['width'] = "137"
* ['height'] = "155"
* ['src'] = "/images/header1x1gif"
*/

MfG

\\EDIT:

Bisher hab ich folgenden RegEx
PHP: 
$pattern['width'] = '@width=((\"|[[:space:]]){0,}?)([0-9]{1,4})@Ui';

Dieser gibt folgendes aus (var_dump):
Code: 
array(4) {
  [0]=>
  array(1) {
    [0]=>
    string(8) "width="1"
  }
  [1]=>
  array(1) {
    [0]=>
    string(1) """
  }
  [2]=>
  array(1) {
    [0]=>
    string(1) """
  }
  [3]=>
  array(1) {
    [0]=>
    string(1) "1"
  }
}
 
Zuletzt bearbeitet:
Wenn ich den RegEx Greedy setze (also das U nach dem Delimeter entferne), dann hab ich die Zahl an der 4. Stelle im Array stehen.
Ist das so korrekt, oder mach ich es mir da zu kompliziert?
PHP: 
$pattern['width'] = '@width=((\"|[[:space:]]){0,}?)([0-9]{1,4})@i';
 
Ich ärgere mich derzeit mit selbiger Problemstellung herum. Solltest du mittlerweile vorangeschritten sein, so wäre ich an deinen Ergebnissen in jedem Fall interessiert.

Schematisch sieht es bei mir derzeit wie folgt aus:
PHP: 
preg_match("@<img.*?src\s*=\s*['\"](.*?)['\"].*?>@i", $_ENTRY["content"], $pic);
preg_match("@width\s*=\s*['\"](.*?)['\"]@i", $pic[0], $test);
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück