Umeditor réalise le transfert automatique d'images de mots

Comment télécharger des images de mots par lots dans ueditor?

1. Code de référence frontal

<! DOCTYPE html PUBLIC "- // W3C // DTD XHTML 1.0 Transitional // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns = "http://www.w3.org/1999/xhtml">

<head>

    <meta http-equiv = "Content-Type" content = "text / html; charset = utf-8" />

 

   <title> Exemple de version complète de l'éditeur-1.2.6.0 </title>

    <script type = "text / javascript" src = "ueditor.config.js" charset = "utf-8"> </script>

    <script type = "text / javascript" src = "ueditor.all.js" charset = "utf-8"> </script>

    <link type = "text / css" rel = "Feuille de style" href = "WordPaster / css / WordPaster.css" />

    <link type = "text / css" rel = "Feuille de style" href = "WordPaster / js / skygqbox.css" />

    <script ttype = "text / javascript" src = "WordPaster / js / json2.min.js" charset = "utf-8"> </script>

    <script ttype = "text / javascript" src = "WordPaster / js / jquery-1.4.min.js" charset = "utf-8"> </script>

    <script ttype = "text / javascript" src = "WordPaster / js / WordPaster.js" charset = "utf-8"> </script>

    <script ttype = "text / javascript" src = "WordPaster / js / skygqbox.js" charset = "utf-8"> </script>

</head>

<body>

    <textarea name = "key of background value" id = "myEditor"> écrivez votre contenu initial ici </textarea>

    <script type = "text / javascript">

        var pasterMgr = nouveau WordPasterManager ();

    pasterMgr.Config ["PostUrl"] = "http: // localhost: 81 / WordPaster2 / WordPasterUEditor1x / php / upload.php"

    pasterMgr.Load (); // Contrôle de charge

 

          UE.getEditor ('myEditor', (onready: function () {// Créer une instance d'éditeur

              pasterMgr.SetEditor (ceci);

          }});

    </script>

</body>

</html>

demande

La demande par défaut de téléchargement de fichier est un fichier sous forme de données de formulaire avec un champ «téléchargement».

Réponse: le fichier a été téléchargé avec succès

La réponse JSON lorsque le fichier est téléchargé avec succès:

uploadé - est défini sur 1.

fileName - le nom du fichier téléchargé.

url - L'URL du fichier téléchargé.

Réponse: Le fichier n'a pas pu être téléchargé

uploadé - est défini sur 0.

error.message-Le message d'erreur à afficher à l'utilisateur.

2. Le chemin de l'image dans le mot collé est fill: // D. Je comprends que ce format n'est pas pris en charge par de nombreux navigateurs qui ne sont pas sûrs.

Le projet actuel utilise une méthode flexible:

Commencez par télécharger le mot en arrière-plan, analysez le POI, stockez l'image, convertissez le html, remplacez l'image et affichez-la dans la zone de texte enrichi

(Il y a une fosse dans l'affichage de texte enrichi: aucun moyen d'attribuer directement une valeur au texte enrichi n'est trouvé, l'enregistrement doit d'abord être détruit

succès: fonction (données) {

     $ ('# content'). attr ('value', data.imagePath);

     var editor = CKEDITOR.instances ["content"]; // La valeur de l'attribut "name" de votre éditeur

     if (éditeur) {

       editor.destroy (true); // Détruit l'éditeur

      }    

     CKEDITOR.replace ('content'); // Remplace l'éditeur, editorID est la valeur de l'attribut "id" de ckeditor

     $ ("# content"). val (result); // Attribuer une valeur à l'éditeur

     //CKEDITOR.instances.contentCkeditor.setData ($ ("# content"). Text ());

 }

3. Recevez l'image téléchargée et enregistrez-la sur le serveur

<? php

ob_start ();

// 201201/10

$ timeDir = date ("Ym"). "/". date ("d");

$ uploadDir = dirname (__ FILE __). '/ upload /'.$ timeDir;

$ curDomain = "http: //". $ _ SERVER ["HTTP_HOST"]. "/";

// Chemin relatif http://www.ncmem.com/upload/2012-1-10/

$ relatPath = $ curDomain. "WordPaster2 / WordPasterUEditor1x / php / upload /". $ timeDir. "/";

 

// Crée un répertoire automatiquement. télécharger / 10/01/2012

if (! is_dir ($ uploadDir))

{

mkdir ($ uploadDir, 0777, vrai);

}

 

// Si la page PHP est encodée en UTF-8, veuillez utiliser urldecode pour décoder le nom du fichier

// $ fileName = urldecode ($ _ FILES ['postedFile'] ['name']);

// Si la page PHP est encodée en GB2312, le nom du fichier peut être lu directement

$ fileName = $ _FILES ['fichier'] ['nom'];

$ tmpName = $ _FILES ['file'] ['tmp_name'];

 

// Prend l'extension de fichier jpg, gif, bmp, png

$ path_parts = pathinfo ($ nom_fichier);

$ ext = $ path_parts ["extension"];

$ ext = strtolower ($ ext); // jpg, png, gif, bmp

 

// Autorise uniquement le téléchargement de fichiers de type d'image

si ($ ext == "jpg"

    || $ ext == "jpeg"

    || $ ext == "png"

    || $ ext == "gif"

    || $ ext == "bmp")

{

    // Year_month_day_hour, minute, seconde, milliseconde.jpg

    $ saveFileName = $ fileName;

 

    //xxx/2011_05_05_091250000.jpg

    $ savePath = $ uploadDir. "/". $ saveFileName;

 

    // Enregistrer comme nouveau nom de fichier

    if (! move_uploaded_file ($ tmpName, $ savePath))

    {

exit ('erreur de téléchargement!'. "Nom du fichier:". $ NomFichier. "Chemin d'enregistrement:". $ savePath);

    }

}

 

// Chemin de l'image de sortie

// $ _ SERVER ['HTTP_HOST'] localhost: 81

// $ _ SERVER ['REQUEST_URI'] /FCKEditor2.4.6.1/php/test.php

$ reqPath = str_replace ("upload.php", "", $ _ SERVER ['REQUEST_URI']);

echo $ relatPath. $ saveFileName;

header ('Content-type: text / html; charset = utf-8');

header ('Content-Length:' .ob_get_length ());

?>

Montrer les résultats:

 

Vous devez le configurer avant utilisation, vous pouvez vous référer à cet article que j'ai écrit: http://blog.ncmem.com/wordpress/2019/08/07/umeditor%E7%B2%98%E8%B4%B4word%E5% 9B% BE% E7% 89% 87 /

Groupe de discussion: 223813913

Je suppose que tu aimes

Origine blog.csdn.net/weixin_45525177/article/details/108493887
conseillé
Classement