wangEditor subir palabra de imagen

Debido a las necesidades del trabajo, el contenido del documento de Word debe pegarse en el editor para su uso.

Pero descubrí que la imagen de la palabra se convirtió en file: ///xxxx.jpg después de pegarla. Si otras personas no pueden acceder a ella después de cargarla en el servidor, encontré muchos editores en línea y descubrí que ninguno de ellos puede resolver este problema directamente.

Teniendo en cuenta que básicamente no uso Windows excepto para trabajar, planeo usar nodejs para resolver este problema.

Descubrí que no importa qué editor se convierta la imagen a base64, se puede usar directamente (IE8 y los siguientes pueden no ser compatibles). Dado que la función de documento de Word agregada en el editor es solo para su propio uso, puede ignorar este navegador.

Después de buscar durante mucho tiempo, probé muchos editores y descubrí que solo la función de ckeditor todavía satisface mis necesidades (admite atributos HTML personalizados)

Luego escribí una operación para monitorear el evento de pegado para obtener la ruta del archivo: ///xxxx.jpg después de pegar

<script>

    var service = {

http: require ('http'),

url: require ('url'),

querystring: require ('querystring'),

fs: require ('fs'),

config: {

    tiempo de espera: 60000,

    juego de caracteres: 'utf8',

    puerto: 10101,

    anfitrión: '127.0.0.1'

},

enrutador: {

    índice: función (res, consulta) {

        res.end ('¡El servidor se está ejecutando!');

    },

    comprobar: función (res, consulta) {

        var result = {status: 1, info: 'success'};

        resultado = JSON.stringify (resultado);

        if (typeof query.callback == 'string') {

            resultado = consulta.callback + '(' + resultado + ')';

        }

        res.end (resultado);

    },

    palabra: función (res, consulta) {

        var _this = servicio;

        var result = {status: 0, info: 'error'};

        if (typeof query.file == 'string') {

            var img = query.file.match (/ archivo: \ / \ / + (localhost)? (\ S + \. (png | jpg | jpeg | gif | bmp)) / i);

            console.log (img);

            si (img) {

                var base64 = _this.base64_encode (img [2]);

                result.status = 1;

                result.info = 'datos: imagen /' + img [3] + '; base64,' + base64;

            }

        }

        resultado = JSON.stringify (resultado);

        if (typeof query.callback == 'string') {

            resultado = consulta.callback + '(' + resultado + ')';

        }

        res.end (resultado);

    }

},

inicio: función () {

    var _this = esto;

    var Server = _this.http.createServer (function (req, res) {

        var URL = _this.url.parse (req.url);

        var recibir = [];

        var enrutador = nulo;

        switch (URL.pathname) {

            caso '/ palabra':

                router = _this.router.word;

                descanso;

            caso '/ comprobar':

                router = _this.router.check;

                descanso;

            defecto:

                router = _this.router.index;

        }

        req.setEncoding (_this.config.charset);

        req.addListener ('datos', función (datos) {

            recibir.push (datos);

        });

        res.writeHead (200, {'Tipo de contenido': 'texto / sin formato'});

        res.on ("cerrar", función () {

            console.log ("res cerrada");

        });

        req.on ("cerrar", función () {

            console.log ("req cerrado");

        });

        req.addListener ('end', function () {

            enrutador (res, _this.querystring.parse (URL.query));

        });

    });

    Server.listen (_this.config.port, _this.config.host, 1024);

    Server.setTimeout (_this.config.timeout, function (cli) {

        cli.end ('tiempo de espera \ n');

    });

    console.log ('Servidor ejecutándose en http: //' + _this.config.host + ':' + _this.config.port);

},

// base64

base64_encode: function (archivo) {

    var bitmap = this.fs.readFileSync (archivo);

    return new Buffer (bitmap) .toString ('base64');

}

};

service.start ();

</script>

Guarde el código anterior como un archivo word.js

Luego ejecute el nodo word.js para crear automáticamente un servicio http

En este momento, usamos jsonp en el editor para obtener los datos de la imagen procesada y reemplazar el archivo original: ///xxxxxx.jpg ruta.

Código para procesar la carga por lotes de imágenes de texto

Otros códigos de parámetros de lógica empresarial

Por supuesto, el código anterior también se puede empaquetar en un archivo ejecutable local para que lo utilicen personas que no entienden las computadoras (no hablaré sobre el método específico aquí)

El código al que hace referencia el primer plano

El siguiente es el efecto después de la implementación, puede cargar automáticamente todas las imágenes en Word y hay una pantalla de barra de progreso

Todas las imágenes se pueden guardar en el servidor y admiten el almacenamiento distribuido de imágenes

Las direcciones de imagen en el editor se han reemplazado por las direcciones de imagen del servidor, y otros usuarios también pueden acceder normalmente

Para obtener más información, consulte este artículo: http://blog.ncmem.com/wordpress/2019/07/30/ckeditor%e7%b2%98%e8%b4%b4word/

 

Grupo de discusión: 223813913

Supongo que te gusta

Origin blog.csdn.net/weixin_45525177/article/details/108486703
Recomendado
Clasificación