Laden Sie das Image auf dem Server hoch und fügen Sie den Dateipfad innerhalb des Image-Tags mit quilljs hinzu

Question

Ich benutze quilljs für meinen Editor. Alle meine Daten werden von MySQL-Datenbank behandelt. Ich verwende Angularjs 1.x und für Backend Cakephp ist meine Rahmenarbeit. Ich versuche zur Zeit ein Forum Art von Seite zu bauen, in dem ich mehrere Bilder zusammen mit Text speichern möchten, die quilljs

<p>sd<img src="data:image/jpeg;base64,iVBORw0KGgoAAAANSUhEUgA....SUVORK5CYII=" alt="i am image"><b>it is image of earth</b></p> 

formatiert wird unter Verwendung Dies ist, was zur Zeit in meiner Datenbank zu speichern. Nun, wenn es mehr großen Bilder kommen in dann Größe des Feldes wird es zu viel hoch ist für I Bild innerhalb severside Ordner hochladen möchte und Bildadresse innerhalb Bildtag drucken wie:

<p>sd<img src="../img/709f2d0be9d13c645037f1b9bb066b00a6d7/image1.jpg" alt="i am image"><b>it is image of earth</b></p> 

So kann ich holen Bild direkt aus gegebenem Ordner.

Answer 1

Ich habe einen kleinen Trick mit quilljs gemacht. Ich habe einige Code in quilljs setzen, das Bild zu meinem PHP-Skript auf Zeilennummer 8663 nach if (typeof value === 'string') diese Aussage i-Skript senden, das Bildwert zu meinem PHP-Skript hinzugefügt haben

var img = { 
       'img' : value 
      } 
      $.ajax({ 
        url: "../Writers/writerCertificateupload", 
        data: img, 
        contentType: undefined, 
        type: 'post' 
      }).success(function(path){ 
       node.setAttribute('src', path); 
      }) 

wo node.setAttribute('src', path); Sätze Weg, die ich von kehre zurück sendet PHP-Skript setzt es auf Bild-Tag dh <img src="../img/709f2d0be9d13c645037f1b9bb066b00a6d7/image1.jpg"> und dann legt es es im Editor und dann können wir diese Daten im Editor speichern. So habe ich dieses Problem gelöst.

meine PHP-Code ist

 public function writerCertificateupload()//pending 
    { 
      $id = $this->Auth->user('id'); 
      $this->autoRender=false; 
      define('UPLOAD_DIR', 'files/post/'); 
      $img = $_POST['img']; 
      $img = str_replace('data:image/jpeg;base64,', '', $img); 
      $img = str_replace(' ', '+', $img); 
      $data = base64_decode($img); 
      $file = UPLOAD_DIR . uniqid() . '.jpg'; 
      $success = file_put_contents($file, $data); 

      $file = "../".$file; 
      print $success ? $file : 'Unable to save the file.'; 
    } 

Answer 2

Sie müssen einen benutzerdefinierten Image-Handler (like here) erstellen und die Länge der Base64-Zeichenkette mit fileReader überprüfen.