Heim > Artikel > Backend-Entwicklung > So integrieren Sie Baidu UE (ueditor 1.4.3) unter PHP
So integrieren Sie Baidu UE (ueditor 1.4.3) unter PHP
In letzter Zeit haben mich viele Blogger gefragt, wie man Baidu UE (ueditor 1.4.3) integriert, aber ich kann es wirklich nicht beantworten, deshalb werde ich über die Idee schreiben, Baidu UE zu integrieren. Die neueste Version von UE1. 4.3 wird in diesem Artikel verwendet.
Herunterladen und installieren
1. Gehen Sie zunächst auf die offizielle Website, um die neueste Version von UE1.4.3 herunterzuladen
Offizielle UE-Download-Adresse: http://ueditor.baidu.com/website/download.html#ueditor
Was ich hier heruntergeladen habe, ist die 1.4.3PHP-Version. Laden Sie einfach die Version herunter, die Sie verwenden.
Entpacken Sie die Dateien in Ihr Projekt
2. Bereitstellung. Führen Sie die von UE benötigten JS-Dateien auf der Front-End-HTML-Seite ein und verwenden Sie dann getEditor zum Instanziieren
<span><</span><span>body</span><span>></span> <span><!--</span><span> 加载编辑器的容器 </span><span>--></span> <span><</span><span>script </span><span>id</span><span>="container"</span><span> name</span><span>="content"</span><span> type</span><span>="text/plain"</span><span>></span><span> 这里写你的初始化内容 </span><span></</span><span>script</span><span>></span> <span><!--</span><span> 配置文件 </span><span>--></span> <span><</span><span>script </span><span>type</span><span>="text/javascript"</span><span> src</span><span>="ueditor.config.js"</span><span>></</span><span>script</span><span>></span> <span><!--</span><span> 编辑器源码文件 </span><span>--></span> <span><</span><span>script </span><span>type</span><span>="text/javascript"</span><span> src</span><span>="ueditor.all.js"</span><span>></</span><span>script</span><span>></span> <span><!--</span><span> 实例化编辑器 </span><span>--></span> <span><</span><span>script </span><span>type</span><span>="text/javascript"</span><span>></span> <span>var</span><span> ue </span><span>=</span><span> UE.getEditor(</span><span>'</span><span>container</span><span>'</span><span>); </span><span></</span><span>script</span><span>></span> <span></</span><span>body</span><span>></span>
Durchsuchen Sie Ihre Seite und Sie werden Ueditor sehen. Ist das nicht ganz einfach zu sagen?
Konfigurieren Sie Ueditor
Die Konfigurationselemente von UEditor sind in zwei Kategorien unterteilt: Front-End-Konfigurationselemente und Back-End-Konfigurationselemente.
Das Front-End und die Front-End-Konfigurationen werden im Back-End geschrieben (die PHP-Version der Konfiguration befindet sich in php/config.json). Wenn der Editor instanziiert wird, werden die Back-End-Konfigurationsinformationen asynchron gelesen und in die Frontend-Konfiguration überschrieben.
Vom Backend erhaltene Konfigurationselemente > Instanziieren Sie die eingehenden Konfigurationselemente der Datei ueditor.config.js
Front-End-Konfigurationselemente: Bietet offiziell zwei Konfigurationsmethoden: statische Konfiguration und dynamische Konfiguration.
Statische Konfiguration: Konfigurieren Sie ueditor.config.js im Ueditor-Verzeichnis. Spezifische Konfigurationselemente finden Sie unter http://fex-team.github.io/ueditor/#start-config
Dynamische Konfiguration: Das heißt, bei der Instanziierung des UE werden die Konfigurationsparameter dynamisch übergeben.
<span>var</span> ue = UE.getEditor('container'<span>, { </span><span>//</span><span>这里写你的自定义配置项</span> <span> toolbars: [ [</span>'fullscreen', 'source', 'undo', 'redo', 'bold'<span>] ], autoHeightEnabled: </span><span>true</span><span>, autoFloatEnabled: </span><span>true</span><span> });</span>
Backend-Konfigurationselemente:
Lass uns zuerst über die Anfrage von UE sprechen: Alle Operationen von UE fordern serverUrl auf, den Wert der Aktionsvariablen über die get-Methode für die nächste Operation zu übergeben. Konfiguration abrufen, Bilder hochladen, Bilder abrufen und andere Vorgänge durchführen.
UE ruft die Backend-Konfigurationselemente standardmäßig ab, indem es den serverUrl-Parameter in ueditor.config.js im Verzeichnis liest und dann action=config über die get-Methode übergibt. Die Standardanforderung lautet: serverUrl?action=config, um Konfigurationselemente abzurufen. serverUrl kann dynamisch auf der Frontend-Seite oder statisch in ueditor.config.js konfiguriert werden.
Sie können testen, ob der Pfad ueditor/php/controller.php?action=config unter Ihrer Website den Backend-Konfigurationsinhalt im JSON-Format zurückgibt (andere Formate sind ebenfalls verfügbar, Einzelheiten finden Sie in der offiziellen Dokumentation. Das Format ist ungefähr wie folgt). . Wenn diese Anfrage einen Fehler enthält, z. B. 400, 500 usw., funktionieren die Upload-bezogenen Funktionen des Editors nicht ordnungsgemäß.
<span>{ </span>"imageUrl": "http://localhost/ueditor/php/controller.php?action=uploadimage"<span>, </span>"imagePath": "/ueditor/php/"<span>, </span>"imageFieldName": "upfile"<span>, </span>"imageMaxSize": 2048<span>, </span>"imageAllowFiles": [".png", ".jpg", ".jpeg", ".gif", ".bmp"<span>] </span>"其他配置项...": "其他配置值..."<span> }</span>
Integrieren
Wie bereits erwähnt Bei allen UE-Operationen wird die serverUrl aufgefordert, den Wert der Aktionsvariablen für die nächste Operation über die Get-Methode zu übergeben. Konfiguration abrufen, Bilder hochladen, Bilder abrufen und andere Vorgänge ausführen . Habe das bekommen, für die Integration von PHP. Oder andere Sprachen sind sehr einfach. Den spezifischen Code finden Sie in der offiziellen Demo.
Das Obige stellt vor, wie man Baidu UE (ueditor 1.4.3) unter PHP integriert, einschließlich des Inhalts von Baidu UE. Ich hoffe, es wird für Freunde hilfreich sein, die sich für PHP-Tutorials interessieren.