阅读说明：本技术 基于富文本编辑器的图片水印处理方法及装置 (Picture watermarking processing method and device based on rich text editor ) 是由 王珏 严莉 李士龙 顾超 董琳娜 李琰 于 2021-10-11 设计创作，主要内容包括：本发明涉及软件开发技术领域,提供一种基于富文本编辑器的图片水印处理方法及装置。图片水印处理方法包括：获取富文本编辑器的编辑内容,对编辑内容中的所有图片进行本地化存储,生成本地图片地址；响应于水印触发操作,根据本地图片地址在富文本编辑器中生成显示所有图片且每张图片及水印信息可供选择的水印处理界面；根据水印处理界面选中的原始图片和水印添加信息,进行原始图片的水印嵌入处理,在富文本编辑器中生成包含嵌有水印的目标图片的图文内容。本发明能够解决富文本编辑器中图片水印处理功能单一、适应场景有限且操作繁琐、效率低的问题,实现对富文本编辑器中的图片进行可视地、便捷地、灵活地批量水印嵌入和取消处理。(The invention relates to the technical field of software development, and provides a rich text editor-based picture watermarking method and device. The picture watermarking processing method comprises the following steps: acquiring the editing content of a rich text editor, and locally storing all pictures in the editing content to generate a local picture address; responding to watermark triggering operation, and generating a watermark processing interface which displays all pictures and can select each picture and watermark information in a rich text editor according to the local picture address; and according to the original picture selected by the watermarking processing interface and the watermarking information, carrying out watermarking embedding processing on the original picture, and generating image-text content containing the target picture embedded with the watermark in a rich text editor. The invention can solve the problems of single picture watermark processing function, limited adaptive scene, complex operation and low efficiency in the rich text editor, and realizes the visual, convenient and flexible batch watermark embedding and canceling of the pictures in the rich text editor.)

1. A picture watermarking method based on a rich text editor is characterized by comprising the following steps:

acquiring the editing content of a rich text editor, and locally storing all pictures in the editing content to generate a local picture address;

responding to watermark triggering operation, and generating a watermark processing interface which displays all the pictures and can select each picture and watermark information in the rich text editor according to the local picture address;

and according to the original picture and the watermark adding information selected by the watermark processing interface, carrying out watermark embedding processing on the original picture, and generating image-text content containing a target picture embedded with a watermark in the rich text editor.

2. The picture watermarking method according to claim 1, wherein the editing content includes paste content, and the obtaining of the editing content of the rich text editor includes:

the rich text editor monitors a content paste event;

and when the content pasting event is monitored, the rich text editor acquires the pasting content of the content pasting event and submits the pasting content to a server.

3. The picture watermarking method of claim 2, wherein the locally storing all pictures in the edited content and generating a local picture address comprises:

the server analyzes the editing content, identifies a picture tag in the editing content, and acquires a picture address according to the picture tag;

judging whether an external picture address exists in the picture addresses;

if yes, the server side conducts picture capturing and downloading according to the external picture address to generate a local picture address, replaces the external picture address with the local picture address to generate first updating editing content, and returns the first updating editing content to the rich text editor.

4. The picture watermarking method of claim 3, wherein after returning to the rich text editor, further comprising:

the rich text editor extracts all local picture addresses in the first updating editing content based on a regular expression and stores the local picture addresses into an array;

and when responding to the watermark triggering operation, the rich text editor acquires the local picture address by calling the array.

5. The picture watermarking method of claim 1, wherein the rich text editor is configured with a watermarking button added to a toolbar of the rich text editor by modifying a source code or a configuration file of the rich text editor;

and when the watermarking button is triggered, generating the watermarking triggering operation.

6. The method of claim 1, wherein the generating a watermarking interface in the rich text editor for displaying all the pictures and each of the pictures and the watermark information being selectable according to the local picture address comprises:

and the rich text editor acquires the local picture address to render the picture, generates a watermarking processing interface for displaying all the pictures in a list, and is configured with an interactive control for selecting each picture and the watermarking information.

7. The picture watermarking method according to claim 1, wherein the watermarking information includes a watermark position and a watermark picture;

the watermark embedding processing of the original picture is carried out according to the original picture and the watermark adding information selected by the watermark processing interface, and the watermark embedding processing comprises the following steps:

the rich text editor submits the original picture selected by the watermarking processing interface, the watermarking information and the current editing content to a server side;

and the server side embeds the watermark picture into the watermark position of the original picture to generate a target picture embedded with the watermark, replaces the local picture address of the original picture with the local picture address of the target picture to generate second updating editing content, and returns the second updating editing content to the rich text editor.

8. The picture watermarking method of claim 1, further comprising:

and according to the selected target picture and the watermark deletion information of the watermark processing interface, performing watermark cancellation processing on the target picture, and generating image-text content containing the original picture with the watermark cancelled in the rich text editor.

9. The picture watermarking processing method according to claim 8, wherein the performing the watermark cancellation processing of the target picture according to the selected target picture and the watermark deletion information of the watermarking processing interface includes:

the rich text editor submits the target picture selected by the watermark processing interface, the watermark canceling information and the current editing content to a server side;

and the server replaces the local picture address of the target picture with the local picture address of the original picture corresponding to the target picture to generate third updated editing content, and returns the third updated editing content to the rich text editor.

10. A rich text editor-based picture watermarking apparatus, comprising:

the picture local storage module is used for acquiring the editing content of the rich text editor, and locally storing all pictures in the editing content to generate a local picture address;

the visual interface generating module is used for responding to watermark triggering operation and generating a watermark processing interface which displays all the pictures and can select each picture and watermark information in the rich text editor according to the local picture address;

and the image watermarking processing module is used for embedding the watermark of the original image according to the original image and the watermark adding information selected by the watermarking processing interface and generating image-text content containing the target image embedded with the watermark in the rich text editor.

Technical Field

The invention relates to the technical field of software development, in particular to a rich text editor-based picture watermarking method and device.

Background

In the era of rapid production of new media information, information production efficiency and copyright protection are very important. For copyright protection of pictures, a main way is to add watermarks to the pictures.

The traditional picture watermarking method needs to use a professional picture editing tool, and after each picture is watermarked, the picture added with the watermark is uploaded to a manuscript. The method has the problem of low efficiency, so the method for embedding the watermark in the rich text editor to directly add the watermark to the picture while editing the manuscript comes to mind.

However, at present, watermark embedding is performed in a rich text editor, and only by modifying part of source codes of the rich text editor, a user can upload an original image and then a watermark image, and the original image and the watermark image are synthesized by a program and then displayed in the rich text editor. The practical value of the method is low, and the process of setting the watermark every time one image is uploaded is very complicated.

In addition, partial rich text editors can realize watermarking, but due to incomplete functions, code annotations are hidden by developers, and by canceling the annotations, the pictures uploaded by the rich text editors can be automatically watermarked by utilizing a self-contained watermark embedding method of the rich text editors. However, this method can only set watermarks uniformly for all pictures, is not flexible enough, has limited applicable scenes, and can be uniformly watermarked no matter whether there are pictures which do not belong to the own copyright or pictures to which watermarks have been added in the content of the rich text editor.

It can be seen that, in the current rich text editor, either no method for adding watermarks is implemented, or only uniform watermark setting can be implemented, but pictures cannot be flexibly selected according to scene needs to be embedded in a watermark in batch, which is a problem to be solved urgently for optimization and reconstruction of the rich text editor at present.

It is to be noted that the information disclosed in the above background section is only for enhancement of understanding of the background of the invention and therefore may include information that does not constitute prior art that is already known to a person of ordinary skill in the art.

Disclosure of Invention

In view of the above, the present invention provides a method and an apparatus for processing a picture watermark based on a rich text editor, which can solve the problems of single function, limited adaptive scene, complex operation and low efficiency of the picture watermark processing in the rich text editor.

One aspect of the present invention provides a rich text editor-based picture watermarking method, including: acquiring the editing content of a rich text editor, and locally storing all pictures in the editing content to generate a local picture address; responding to watermark triggering operation, and generating a watermark processing interface which displays all the pictures and can select each picture and watermark information in the rich text editor according to the local picture address; and according to the original picture and the watermark adding information selected by the watermark processing interface, carrying out watermark embedding processing on the original picture, and generating image-text content containing a target picture embedded with a watermark in the rich text editor.

In some embodiments, the editing content includes paste content, and the obtaining the editing content of the rich text editor includes: the rich text editor monitors a content paste event; and when the content pasting event is monitored, the rich text editor acquires the pasting content of the content pasting event and submits the pasting content to a server.

In some embodiments, the locally storing all pictures in the edited content and generating a local picture address includes: the server analyzes the editing content, identifies a picture tag in the editing content, and acquires a picture address according to the picture tag; judging whether an external picture address exists in the picture addresses; if yes, the server side conducts picture capturing and downloading according to the external picture address to generate a local picture address, replaces the external picture address with the local picture address to generate first updating editing content, and returns the first updating editing content to the rich text editor.

In some embodiments, after returning to the rich text editor, the method further comprises: the rich text editor extracts all local picture addresses in the first updating editing content based on a regular expression and stores the local picture addresses into an array; and when responding to the watermark triggering operation, the rich text editor acquires the local picture address by calling the array.

In some embodiments, the rich text editor is configured with a watermarking button that is added to the rich text editor's toolbar by modifying the rich text editor's source code or configuration file; and when the watermarking button is triggered, generating the watermarking triggering operation.

In some embodiments, the generating, in the rich text editor, a watermark processing interface that displays all the pictures and each of the pictures and watermark information is selectable according to the local picture address includes: and the rich text editor acquires the local picture address to render the picture, generates a watermarking processing interface for displaying all the pictures in a list, and is configured with an interactive control for selecting each picture and the watermarking information.

In some embodiments, the watermarking information includes a watermark location and a watermark picture; the watermark embedding processing of the original picture is carried out according to the original picture and the watermark adding information selected by the watermark processing interface, and the watermark embedding processing comprises the following steps: the rich text editor submits the original picture selected by the watermarking processing interface, the watermarking information and the current editing content to a server side; and the server side embeds the watermark picture into the watermark position of the original picture to generate a target picture embedded with the watermark, replaces the local picture address of the original picture with the local picture address of the target picture to generate second updating editing content, and returns the second updating editing content to the rich text editor.

In some embodiments, the picture watermarking method further includes: and according to the selected target picture and the watermark deletion information of the watermark processing interface, performing watermark cancellation processing on the target picture, and generating image-text content of the original picture containing the cancelled watermark in the rich text editor.

In some embodiments, the performing watermark cancellation processing on the target picture according to the selected target picture and the watermark deletion information of the watermark processing interface includes: the rich text editor submits the target picture selected by the watermark processing interface, the watermark canceling information and the current editing content to a server side; and the server replaces the local picture address of the target picture with the local picture address of the original picture corresponding to the target picture to generate third updated editing content, and returns the third updated editing content to the rich text editor.

Another aspect of the present invention provides a rich text editor-based picture watermarking apparatus, including: the picture local storage module is used for acquiring the editing content of the rich text editor, and locally storing all pictures in the editing content to generate a local picture address; the visual interface generating module is used for responding to watermark triggering operation and generating a watermark processing interface which displays all the pictures and can select each picture and watermark information in the rich text editor according to the local picture address; and the image watermarking processing module is used for embedding the watermark of the original image according to the original image and the watermark adding information selected by the watermarking processing interface and generating image-text content containing the target image embedded with the watermark in the rich text editor.

Compared with the prior art, the invention has the beneficial effects that:

all pictures in the edited content of the rich text editor are locally stored, so that the pictures of an outstation are automatically captured and downloaded to a local server to prepare for batch embedding of the watermarks of the pictures; the process of capturing and downloading the picture in advance can be synchronously carried out with other operations of the user, so that the user has no perception, the time before the user triggers the watermark operation is fully utilized, and the user experience is improved;

when a user triggers the watermark operation, a watermark processing interface which displays all pictures and can be selected by each picture and watermark information is generated according to the address of the captured and downloaded local picture, so that the user can flexibly select the pictures needing to be added with the watermark, the watermark adding position and other information according to the scene requirement through the watermark processing interface and submit the information to a background in batches, and the operation process is visual, convenient, flexible and controllable; the user can also cancel/replace the added watermark conveniently through the watermark processing interface;

according to the pictures and the watermark information selected by the user, the picture watermark embedding processing can be carried out in batch, the image-text content containing the target pictures added with the watermarks is generated and displayed in the rich text editor, the processing work of different watermark embedding requirements in a complex environment is completed in one step, the picture watermark embedding efficiency is effectively improved, and the practicability of the picture watermark processing function of the rich text editor is improved.

It is to be understood that both the foregoing general description and the following detailed description are exemplary and explanatory only and are not restrictive of the invention, as claimed.

Drawings

The accompanying drawings, which are incorporated in and constitute a part of this specification, illustrate embodiments consistent with the invention and together with the description, serve to explain the principles of the invention. It is obvious that the drawings described below are only some embodiments of the invention, and that for a person skilled in the art, other drawings can be derived from them without inventive effort.

FIG. 1 is a diagram illustrating steps of a rich text editor-based picture watermarking method according to an embodiment of the present invention;

FIG. 2 is a schematic diagram of a rich text editor configured with a watermarking button in one embodiment of the invention;

FIG. 3 is a diagram illustrating a rich text editor generate watermarking interface in accordance with an embodiment of the invention;

FIG. 4 shows a schematic diagram of a watermark embedding operation interface of a prior rich text editor;

FIG. 5 is a flowchart illustrating a rich text editor-based picture watermarking method according to an embodiment of the present invention;

FIG. 6 is a system block diagram illustrating a rich text editor-based picture watermarking method according to an embodiment of the present invention;

FIG. 7 is a schematic diagram of data flow of a rich text editor-based picture watermarking method according to an embodiment of the present invention;

fig. 8 is a block diagram of a picture watermarking apparatus based on a rich text editor according to an embodiment of the present invention.

Detailed Description

Example embodiments will now be described more fully with reference to the accompanying drawings. Example embodiments may, however, be embodied in many different forms and should not be construed as limited to the embodiments set forth herein. Rather, these embodiments are provided so that this disclosure will be thorough and complete, and will fully convey the concept of example embodiments to those skilled in the art.

The drawings are merely schematic illustrations of the invention and are not necessarily drawn to scale. The same reference numerals in the drawings denote the same or similar parts, and thus their repetitive description will be omitted. Some of the block diagrams shown in the figures are functional entities and do not necessarily correspond to physically or logically separate entities. These functional entities may be implemented in the form of software, or in one or more hardware modules or integrated circuits, or in different networks and/or processor devices and/or microcontroller devices.

In addition, the flow shown in the drawings is only an exemplary illustration, and not necessarily includes all the steps. For example, some steps may be divided, some steps may be combined or partially combined, and the actual execution sequence may be changed according to the actual situation. The use of "first," "second," and similar terms in the detailed description is not intended to imply any order, quantity, or importance, but rather is used to distinguish one element from another. It should be noted that features of the embodiments of the invention and of the different embodiments may be combined with each other without conflict.

A Rich Text Editor (RTE for short) can be embedded in the browser to implement editing processing of characters, pictures and other contents. The image watermarking processing method based on the rich text editor is combined with the rich text editor and a server side thereof, namely a system background of a browser, so that the image in the rich text editor can be visually, conveniently and flexibly subjected to batch watermarking embedding/cancelling processing in a batch mode.

Fig. 1 shows the main steps of a rich text editor-based picture watermarking method in an embodiment, and referring to fig. 1, the picture watermarking method of the embodiment includes the following steps.

Step S110, acquiring the editing content of the rich text editor, and locally storing all pictures in the editing content to generate a local picture address.

The rich text editor may be any available rich text editor, such as a CKeditor, Ueditor, 135 editor, Ximi editor, and the like. The editing content may include paste content (i.e., HTML (Hyper Text Markup Language) content), and the editing content of the rich Text editor is obtained, which specifically includes: monitoring a content pasting event by a rich text editor; and when the content pasting event is monitored, the rich text editor acquires the pasting content of the content pasting event and submits the pasting content to the server.

The traditional rich text editor only supports watermark embedding processing on uploaded pictures, and the method realizes that the outstation pictures in the copied and pasted contents in the rich text editor are automatically captured and downloaded to the local by monitoring the content pasting event without manually downloading the uploaded pictures by a user, so that the picture watermark processing method also takes effect on the directly pasted contents.

Locally storing all pictures in the edited content to generate a local picture address, which specifically comprises: the server analyzes the editing content, identifies a picture tag (namely an < IMG > tag) in the editing content, and acquires a picture address according to the picture tag (namely acquiring a URL path from an SCR attribute of the < IMG > tag); and judging whether an external picture address exists in the picture address (namely judging whether an absolute URL path exists in the URL path). If so, the server side carries out picture capturing and downloading according to the external picture address to generate a local picture address, replaces the external picture address with the local picture address (a new access address of a picture to be downloaded is replaced into a corresponding SCR attribute of the edited content), generates first updated edited content, and returns the first updated edited content to the rich text editor.

In the editing content of the rich text editor, some pictures are copied from other webpages, the picture addresses are external links, the pictures are stored on a third-party server, and the pictures can be processed only by downloading the pictures to a local server; and the manual downloading efficiency is low, so the invention automatically captures and downloads the pictures of the outstations to the local server to prepare for the batch embedding work of the picture watermarks.

After all the outer-link pictures are captured and the addresses are replaced, the server returns newly generated HTML content, namely first updated editing content to the rich text editor, and the rich text editor further calls an editor content setting method to refresh the editor content.

The method comprises the steps that all pictures in the edited content of a rich text editor are locally stored, so that the pictures of an outstation are automatically captured and downloaded to a local server, and preparation is made for batch embedding of the watermarks of the pictures; and the process of capturing and downloading the picture in advance can be synchronously carried out with other operations of the user, so that the user has no perception, the time before the watermark operation is triggered by the user is fully utilized, and the user experience is improved.

Further, if the user is allowed to select the desired picture, all picture addresses in the HTML source of the rich text editor need to be extracted for use. Therefore, after receiving the first updated editing content, the rich text editor further includes: extracting all local picture addresses in the first updating editing content based on the regular expression, and storing the local picture addresses in the array for later use; subsequently, when the rich text editor receives the watermark triggering operation, the local picture address in the HTML content can be quickly acquired by calling the array.

And step S120, responding to the watermark triggering operation, and generating a watermark processing interface which displays all pictures and can select each picture and watermark information in the rich text editor according to the local picture address.

The rich text editor is provided with a watermarking button, and the watermarking button can be added to a toolbar of the rich text editor in a mode of modifying a source code or a configuration file of the rich text editor; when the watermarking button is triggered, for example, the user clicks the watermarking button, a watermark trigger operation is generated.

Fig. 2 shows an example of the rich text editor configured with a watermarking button in an embodiment, and referring to fig. 2, a watermarking button 220 can be added to a toolbar 210 of the rich text editor 200 by modifying the source code or configuration file of the editor, and the like. The rich text editor 200 also includes icon buttons for performing other conventional operations, such as font setting buttons, paragraph setting buttons, etc., which are not specifically shown in the tool bar 210.

Generating a watermark processing interface which displays all pictures and can select each picture and watermark information in a rich text editor according to the local picture address, and specifically comprising the following steps: the rich text editor calls an array to acquire a local picture address to perform picture rendering, a watermarking interface for performing list display on all pictures in the current editing content (namely the first updating editing content) is generated, and visual management of a picture list is realized; and an interactive control for selecting each picture and watermark information is configured in the watermark processing interface so as to facilitate the selection operation of a user.

The method can realize picture list display, UI (User Interface) display such as picture selection/deselection, watermark position selection, data submission and the like and data interaction by utilizing a custom component Development SDK (Software Development Kit) of the rich text editor or according to the Development requirement of the rich text editor on the custom component. And in the user-defined component interface code, calling the data in the array to acquire a local picture address and rendering the local picture address to the user-defined component interface.

When configuring the rich text editor, it is necessary to confirm whether the rich text editor employs an automatic caching mechanism, and if so, the automatic caching mechanism of the rich text editor needs to be cancelled. The automatic caching mechanism means that the rich text editor automatically caches the JS codes of the components, and the cache cannot be cleared in a conventional manner. Because all the displayed contents of the custom component of the conventional rich text editor are written by the JS, the displayed picture list obtained for the first time is executed as the JS content, and if the rich text editor adopts an automatic cache mechanism, the picture list information displayed in the component can not change in the valid period of the JS cache, and the picture list obtained when the JS is generated for the first time can only be displayed. Under the automatic cache mechanism, even through the modes of replacing other image-text contents, logging in a system again, rebooting a browser, refreshing a cache by CTRL + F5 and the like, the batch embedding operation of the image watermarks into the new contents cannot be realized.

Therefore, if it is found that the rich text editor employs an automatic cache mechanism, it is necessary to find the information of the dynamic JS file automatically generated by the rich text editor when the custom component is initialized by using a front-end debugging tool such as a browser, retrieve the source code according to the information, find the code for generating the JS file, add "? The implementation disables the automatic caching mechanism of the component, i.e., the code of the current timestamp ".

Fig. 3 shows an illustration of generating a watermarking interface by the rich text editor in an embodiment, and in combination with fig. 2 and fig. 3, when the watermarking button 220 is triggered, the rich text editor 200 uses a custom component to realize arrangement and display of all pictures in the currently edited content, and generates a watermarking interface 310, and the watermarking interface 310 further provides a picture selecting function, a watermarking position selecting function, a watermarking canceling function, and the like. Before triggering the watermarking button 220, the user can perform operations such as character editing, image-text typesetting editing and the like in the rich text editor 200; the watermarking button 220 may then be activated to select the picture to be watermarked and the specific watermarking information using the generated watermarking interface 310. The user may click a "select all" button in the watermarking interface 310 to select all of the pictures 320, or may individually check a corresponding check box for each picture 320 to select a particular picture or pictures 320; the user can select the watermark position, for example, the watermark is added to the lower right corner, and then the selected original picture and the watermark adding information can be submitted to the background of the system by clicking the 'determination'. In addition, the user may also upload the watermark picture, for example, the user may jump out of the watermark picture uploading interface after clicking "ok" here, or may jump out of the watermark picture uploading interface after clicking the watermark processing button 220 before, which is not specifically shown in the figure.

Through the watermarking interface, the following advantages can be obtained in many aspects: in the aspect of processing flow, after the user edits the content, the user uniformly embeds the watermarks in the pictures in the current edited content in batch, can select the corresponding pictures and the way of adding the watermarks according to the needs, completes the watermark embedding work at one time, and is very convenient; in the aspect of visualization, all pictures in the edited content can be extracted and displayed on a watermark processing interface, so that a more intuitive operation mode is realized; in the aspect of automation, background static automatic downloading of the pasted content is realized, a user does not sense the background static automatic downloading, and the user only needs to select a picture to embed a watermark in a watermark processing interface; in the aspect of efficiency, watermarks are embedded into a plurality of pictures at one time, and the efficiency is high.

Fig. 4 shows a watermark embedding operation interface of the existing rich text editor, and referring to fig. 4, a watermark embedding operation interface 410 of the existing rich text editor 400 shows simple text content in the form of a webpage dialog. The processing flow aspect is as follows: users are required to edit contents and add watermarks when editing the contents, and the completion of editing one content requires to switch between text editing, picture uploading and watermark embedding operations repeatedly, which is very tedious; visualization aspect: the uploaded pictures, watermark pictures and the like can only display file paths, and the contents with the pictures cannot be displayed due to a rich text editor cache mechanism; and (3) automation aspect: the pasted content needs to be manually downloaded and uploaded once again, and is added with a watermark, and automatic processing is not needed; in the aspect of efficiency: the processing efficiency of embedding the watermark in a single picture is low each time.

Therefore, when a user sends out watermark triggering operation, a watermark processing interface which displays all picture contents and can be selected by each picture and watermark information is generated according to the address of the captured and downloaded local picture, so that the user can flexibly select the pictures needing to be added with the watermark, the watermark adding position and other information according to the scene requirement through the watermark processing interface and submit the pictures to the background in batches, and the operation process is visual, convenient, flexible and controllable.

And step S130, according to the original picture selected by the watermarking processing interface and the watermarking information, carrying out watermarking embedding processing on the original picture, and generating image-text content containing the target picture embedded with the watermark in a rich text editor.

The watermark adding information comprises a watermark position and a watermark picture; according to the original picture and the watermark adding information selected by the watermark processing interface, the watermark embedding processing of the original picture is carried out, and the method specifically comprises the following steps: the rich text editor submits the original picture, the watermarking information and the current editing content selected by the watermarking processing interface to a server side; and the server side embeds the watermark picture into the watermark position of the original picture to generate a target picture embedded with the watermark, replaces the local picture address of the original picture with the local picture address of the target picture to generate second updating editing content, and returns the second updating editing content to the rich text editor.

After the server acquires the original pictures, the watermark picture information and the watermark position information, the original pictures needing to be embedded with the watermarks can be embedded in batches in a task queue creating mode. After the watermark of the picture is embedded, the access address of the picture with the watermark is replaced into an HTML (hypertext markup language) primitive text, namely the first updated editing content, and then the new HTML content, namely the second updated editing content, is transmitted back to the rich text editor, and the rich text editor calls a content setting method to reset page content, so that the effect of local refreshing is realized, and the image-text content embedded with the watermark of the picture in batch is displayed.

The server can specifically perform batch embedding of the image watermarks through professional image processing tools such as ImageMagick and the like. The server side provides a watermark processing interface, receives data such as an original picture, a watermark position and an HTML original text selected by a user, calls an ImageMagick tool to traverse the specified position of the specified original picture in which the watermark picture is embedded in batch, and generates a target picture, wherein the original picture can be reserved for the user to use when the user cancels the watermark.

According to the steps, the picture watermark embedding processing can be carried out in batch according to the pictures and the watermark information selected by the user, the image-text content containing the target pictures added with the watermarks is generated and displayed in the rich text editor, the processing work of different watermark embedding requirements in a complex environment is completed in one step, the efficiency of the picture watermark embedding work is effectively improved, and the practicability of the picture watermark processing function of the rich text editor is improved.

Fig. 5 shows the main flow steps of a rich text editor based picture watermarking method in a specific example. The innovation compared with the existing flow is mainly explained in this example, and the features and principles regarding the picture watermarking process that have been described in the above embodiments are not repeated.

S510, the user 500a pastes the content in the rich text editor 500b, and then the rich text editor 500b monitors the paste event and submits the paste content to the back end, i.e. the system background 500 c.

And S520, the system background 500c analyzes the paste content, automatically captures the external domain name picture and downloads the external domain name picture to the local server so as to process the picture subsequently.

S530, the system background 500c replaces the local picture address with the original content, that is, replaces the external picture address in the paste content with the local picture address, and returns the local picture address to the rich text editor 500b to reset the content, that is, the rich text editor 500b refreshes the current editing content.

S540, if the user 500a clicks the watermark embedding button, the rich text editor 500b extracts all locally stored picture addresses to perform picture rendering, and generates a watermarking visualization interface JS.

And S550, rendering and displaying the visual interface by the rich text editor 500 b. The user-defined component of the rich text editor 500b is utilized to realize the arrangement and display of all pictures, and the user can perform operations such as picture selection, deselection, watermark position selection and the like through a visual interface.

S560, the user 500a selects a plurality of pictures and watermark processing modes, including watermark location information, watermark picture information, and the like, and the rich text editor 500b submits the content selected by the user and the currently edited content to the back end for processing.

S570, the system background 500c embeds watermarks in batches using imagemap, and may create a task queue to process the pictures to be embedded with watermarks.

S580, the system background 500c replaces the original content with the watermark picture address, that is, replaces the related picture address in the current editing content with the watermarked picture address, and returns the replaced picture address to the rich text editor 500b to reset the content. Therefore, the image content embedded with the watermark is transmitted back to the front end, so that the rich text editor 500b refreshes the content and displays the image-text content embedded with the watermark image.

Fig. 6 shows the main system modules of a rich text editor-based picture watermarking method in a specific example. The innovation compared with the existing system module is mainly illustrated in this example, and the features and principles regarding the picture watermarking which have been described in the above embodiments are not repeated.

The rich text editor 610 is configured with: a custom component 611, providing a custom "add picture" function, embedded in the toolbar of the rich text editor 600 a; a content paste monitoring module 612, configured to monitor a user paste content event, and submit the editor content to a system background analysis process when triggered; a picture address management module 613, configured to manage and extract all picture addresses, and dynamically generate view content managed by a watermark; the watermark management visualization module 614 is used for providing options such as picture list display, whether each picture is added with a watermark, watermark content, adding position and the like; and the HTML content write-back refreshing module 615 is used for receiving HTML content of which the background replaces the watermark picture address, setting the HTML content into an editor and refreshing and displaying the HTML content locally.

System backend 620 is configured with: the picture capturing and downloading module 621 is configured to determine whether the picture is a picture of the system, and download an external system picture to the system through an external link; the picture processing task module 622 is used for creating and managing a picture capturing and downloading task, an embedded picture watermarking task and a scheduling related task execution module; imagemap image processing tool 623, configured to embed a watermark in the picture; the message queue 624 is used for storing the picture task processing data and ensuring task queuing processing; the file server 625 is used for storing pictures uploaded by users, capturing and downloading the pictures by a system, embedding the newly generated pictures with watermarks and providing picture resource access; and the HTML parsing module 626 is configured to receive HTML content submitted by the rich text editor 610, parse the content to obtain all picture addresses, replace the watermark picture addresses, generate new HTML content, and return the new HTML content. Of course, the arrangement of the system modules is not limited to that shown in fig. 6, different system modules may be combined, or the same system module may be disassembled, as long as the rich text editor-based image can be visually, conveniently and flexibly batch watermark embedding/cancelling process.

Fig. 7 shows the main data flow process of the rich text editor based picture watermarking method in a specific example. The innovation compared with the existing data stream process is mainly illustrated in this example, and the features and principles regarding the picture watermarking which have been described in the above embodiments are not repeated.

Data input step S710: the user 700a inputs the service data to the rich text editor 700 b. This step may be a paste mode, that is, the rich text editor 700b may process the pasted data content, whereas the conventional method may only process the pictures uploaded in an upload mode.

A submission step S720: rich text editor 700b submits the input data to system backend 700 c.

Download capture step S730: the system backend 700c downloads pictures from the third-party website 700 d. The step can realize automatic downloading of the external pictures, and has higher efficiency compared with the traditional manual downloading and uploading mode. Of course, in the present invention, the user 700a may directly upload the picture to the system background 700c, which is not specifically shown in the figure.

Picture storing/calling step S740: the system background 700c saves the downloaded picture to the local file server 700e for subsequent call processing.

Returning step S750: the system backend 700c returns the content with the picture address replaced to the rich text editor 700 b.

Data display step S760: the rich text editor 700b refreshes the currently presented data according to the updated content. Here, the rich text editor 700b can also return to the dynamic watermarking processing interface according to the watermark triggering data input by the user, and display all pictures and related operation elements in the edited content, whereas the traditional method returns to the static interface, and cannot display the picture content.

Continuing, data input step S710': the user inputs watermarking data into rich text editor 700 b.

Submitting step S720': rich text editor 700b submits the input data to system backend 700 c. The invention submits a plurality of watermark embedding business data without uploading picture data, and the traditional method can only submit one watermark embedding business data one by one and upload the picture data at the same time, so that the consumption time is long each time.

Create picture processing task step S770: the system background 700c assigns the image processing task module 700f to perform image watermarking according to the service scene.

Invoke image processing tools step S780: the image processing task module 700f calls the ImageMagic tool 700g to perform batch processing of image watermarks.

Generating an embedded watermark picture and storing step S790: the imagemap tool 700g saves the watermarked picture to the file server 700 e.

Returning step S750': the system backend 700c retrieves the watermarked picture from the file server 700e and returns it to the rich text editor 700 b. The invention returns the full-text HTML content after batch image watermark embedding, and is easier to process compared with the traditional method that only the watermark image address is returned.

Data display step S760': the rich text editor 700b refreshes the content to provide a data presentation to the user.

Compared with the prior art that the watermark can be embedded into one uploaded picture at a time, the picture watermark processing method in each embodiment can not be processed in batch, and the production efficiency of the edited content is seriously influenced; the invention automatically downloads the pictures of the external system, generates the dynamic picture watermark batch embedding view by combining all the pictures in the content of the editor, solves the core problem that the updated content cannot be displayed due to the strong cache mechanism of the editor, provides a visual picture watermark batch embedding mode which is based on a rich text editor and has rich functions for users, and further completes the requirement of embedding various pictures into watermark scenes, thereby improving the working efficiency of watermark processing.

Further, on the basis of any of the above embodiments, the picture watermarking method further includes: and according to the selected target picture and the watermark deletion information of the watermark processing interface, performing watermark cancellation processing on the target picture, and generating image-text content containing the original picture with the watermark cancelled in the rich text editor. According to the selected target picture and the watermark deletion information of the watermark processing interface, the watermark cancellation processing of the target picture is carried out, and the method specifically comprises the following steps: the rich text editor submits the target picture, the watermark canceling information and the current editing content selected by the watermark processing interface to a server side; and the server replaces the local picture address of the target picture with the local picture address of the original picture corresponding to the target picture to generate third updated editing content, and returns the third updated editing content to the rich text editor.

As shown in fig. 3, when the user selects several target pictures with embedded watermarks in the watermarking interface 310 and selects "cancel watermark" at the "select watermark position or cancel watermark" interaction control, batch watermarking cancel operations on the several target pictures can be implemented. The specific operation principle can be referred to the description of any of the above embodiments, and the description is not repeated here.

In summary, the picture watermarking processing method based on the rich text editor of the invention can complete the watermarking embedding processing of all pictures in the edited content in one step by automatically capturing and adding the self-defined picture watermarking embedding tool and extracting all pictures in the content to dynamically generate the visual watermarking processing interface, thereby enriching the functions of the rich text editor, reducing the operation steps of the user and improving the efficiency of the picture watermarking embedding work. Different from the way of realizing the watermark embedding of pictures by other editors, the method extracts all pictures in the edited content to be displayed in a list way, so that a user can set different watermark embedding schemes for each picture respectively, including whether the watermark is embedded, selecting the watermark content, embedding the position of the watermark and the like, the different watermark embedding schemes are submitted to background processing uniformly after the setting is finished, the final content is returned to the front end for local refreshing display at one time, the work of processing the watermark embedding of the user is extracted as the last step of uniform processing of content editing, the visual interaction capacity is provided, and the processing way is more flexible, humanized and efficient. In addition, all pictures in the content of the editor are listed and displayed one by one and can be processed in a targeted mode, and the pictures embedded with the watermarks can keep the original pictures, so that the method can provide the operation of canceling the watermarks, a user can directly select the pictures added with the watermarks to set the watermarks for canceling the watermarks, the background replaces the pictures with the original pictures according to instructions to achieve the effect of canceling the embedded watermarks, and the users do not need to delete the watermarks and then upload the pictures again like the existing implementation mode.

The embodiment of the invention also provides a picture watermarking processing device which can be used for realizing the picture watermarking processing method described in any embodiment. The features and principles of the picture watermarking method described in any of the above embodiments can be applied to the following picture watermarking apparatus embodiments. In the following embodiments of the picture watermarking apparatus, the features and principles that have been elucidated with respect to the picture watermarking will not be repeated.

Fig. 8 shows the main blocks of a rich text editor-based picture watermarking apparatus in an embodiment, and referring to fig. 8, a rich text editor-based picture watermarking apparatus 800 in this embodiment includes: the picture local storage module 810 is configured to obtain editing contents of the rich text editor, locally store all pictures in the editing contents, and generate a local picture address; a visual interface generating module 820, configured to generate, in response to the watermark triggering operation, a watermark processing interface that displays all the pictures and is selectable for each picture and watermark information in the rich text editor according to the local picture address; the image watermarking processing module 830 is configured to perform watermarking embedding processing on the original image according to the original image and the watermarking information selected by the watermarking processing interface, and generate image-text content including a target image embedded with a watermark in the rich text editor.

Further, the image watermarking apparatus 800 may further include modules for implementing other process steps of the above-described embodiments of the image watermarking method, for example, each system module shown in fig. 6 may be further included, different system modules may be combined, or the same system module may be further disassembled, as long as the rich text editor-based image can be visually, conveniently and flexibly batch watermarking embedding/cancelling processing. The specific principle of each module can refer to the description of each image watermarking method embodiment, and the description is not repeated here.

The image watermark processing device can display all images in the content of the rich text editor to a user, the user can uniformly select the images needing to be embedded with the watermarks and the watermark information needing to be embedded before all image-text editing work such as uploading, pasting, content typesetting and the like is finished and is ready to be submitted and issued, and the background carries out batch watermark embedding processing and then replaces the images and the watermark information into the original text, so that the processing work of different watermark embedding requirements in a complex environment is finished in one step, the use process is more visual, convenient, flexible and controllable, the image watermark processing efficiency is effectively improved, and the practicability of the image watermark processing function of the rich text editor is improved.

The foregoing is a more detailed description of the invention in connection with specific preferred embodiments and it is not intended that the invention be limited to these specific details. For those skilled in the art to which the invention pertains, several simple deductions or substitutions can be made without departing from the spirit of the invention, and all shall be considered as belonging to the protection scope of the invention.