Webpage interface development internationalization method, device, equipment, storage medium and program product

Abstract

The application relates to a webpage interface internationalization development method and device, computer equipment, a computer readable storage medium and a computer program product, relates to the technical field of software development, and can improve the development efficiency of webpage interface internationalization development. The method comprises the following steps: in response to a selection operation on a target webpage text element, displaying a language translation component; the target webpage element is a webpage element with text content containing an internationalization key; in response to a triggering operation on the language translation component, obtaining first translation content corresponding to the text content according to the internationalization key; obtaining second translation content corresponding to part or all of the text content obtained through an auxiliary translation interface; and obtaining target translation content corresponding to the text content according to the first translation content and the second translation content.

Description

TECHNICAL FIELD

[0001] The present application relates to the technical field of software development, and particularly relates to a webpage interface development internationalization method and device, computer equipment, computer readable storage medium and computer program product. BACKGROUND

[0002] With the acceleration of globalization, the software development technical field introduces internationalization technology, which aims to support multiple languages and multicultural environments to provide consistent experiences for global users. Its core lies in multilingual support, character encoding processing and localization adaptation, enabling application programs to flexibly adjust according to the needs of different regions. The current internationalization method mainly relies on saving internationalization content as multiple standard local language file formats to store translation content, and defining translation content in the form of key-value pairs in advance.

[0003] In the traditional method, developers usually maintain independent translation files for each language and load these files during compilation to provide multilingual support. Although this approach can meet basic internationalization needs, it is time-consuming and laborious when dealing with dynamic content and context-dependent translations, resulting in low development efficiency for internationalization. SUMMARY

[0004] Therefore, it is necessary to provide a webpage interface development internationalization method, device, computer equipment, computer readable storage medium and computer program product capable of improving the development efficiency of internationalization in view of the above technical problems.

[0005] In a first aspect, the present application provides a webpage interface development internationalization method, comprising:

[0006] In response to a selection operation on a target webpage text element, a language translation component is displayed; the target webpage element is a webpage element with text content containing an internationalization key;

[0007] In response to a triggering operation on the language translation component, a first translation content corresponding to the text content is obtained according to the internationalization key;

[0008] Part or all of the second translation content corresponding to the text content obtained through an auxiliary translation interface is obtained;

[0009] According to the first translation content and the second translation content, a target translation content corresponding to the text content is obtained.

[0010] In one of the embodiments, before the displaying the language translation component in response to the selection operation on the target webpage text element, further comprises: determining that the selection operation is received if a mouse-over event on the target webpage text element is monitored.

[0011] In one of the embodiments, the obtaining the first translation content corresponding to the text content according to the internationalization key in response to the triggering operation on the language translation component, comprises: displaying a translation window in response to the triggering operation on the language translation component, and requesting the server for the candidate first translation content corresponding to the text content according to the internationalization key; the translation window displays a language translation form corresponding to the internationalization key; the language translation form displays preset first translation content; the first translation content is displayed in the language translation form according to the candidate first translation content and the preset first translation content.

[0012] In one of the embodiments, the displaying the first translation content in the language translation form according to the candidate first translation content and the preset first translation content, comprises: if the candidate first translation content is empty, displaying the preset first translation content as the first translation content in the language translation form; if the candidate first translation content is not empty, displaying the candidate first translation content as the first translation content in the language translation form.

[0013] In one of the embodiments, the translation window further displays a language input box; before the obtaining the second translation content corresponding to part or all of the text content through the auxiliary translation interface, further comprises: after the language translation form displays the first translation content, obtaining part or all of the text content input into the language input box; sending part or all of the text content to the server, so that the server obtains the second translation content corresponding to part or all of the text content through the auxiliary translation interface; after the obtaining the second translation content corresponding to part or all of the text content through the auxiliary translation interface, further comprises: displaying the second translation content in the language translation form.

[0014] In one of the embodiments, after the obtaining the target translation content corresponding to the text content according to the first translation content and the second translation content, further comprises: displaying the target translation content in the language translation form; submitting the language translation form to the server, so that the server replaces the text content of the target webpage text element with the target translation content.

[0015] In a second aspect, the present application provides a webpage interface development internationalization device, comprising:

[0016] a language translation component display module configured to display a language translation component in response to a selection operation on a target webpage text element; the target webpage element is a webpage element having text content containing an internationalization key;

[0017] a first translation content acquisition module configured to acquire first translation content corresponding to the text content according to the internationalization key in response to a triggering operation on the language translation component;

[0018] a second translation content acquisition module configured to acquire second translation content corresponding to part or all of the text content obtained through an auxiliary translation interface;

[0019] a translation integration module configured to obtain target translation content corresponding to the text content according to the first translation content and the second translation content.

[0020] In a third aspect, the present application further provides a computer device comprising a memory and a processor, wherein the memory stores a computer program, and the processor implements the following steps when executing the computer program:

[0021] display a language translation component in response to a selection operation on a target webpage text element; the target webpage element is a webpage element having text content containing an internationalization key; acquire first translation content corresponding to the text content according to the internationalization key in response to a triggering operation on the language translation component; acquire second translation content corresponding to part or all of the text content obtained through an auxiliary translation interface; and obtain target translation content corresponding to the text content according to the first translation content and the second translation content.

[0022] In a fourth aspect, the present application further provides a computer readable storage medium having a computer program stored thereon, wherein the computer program is executed by a processor to implement the following steps:

[0023] display a language translation component in response to a selection operation on a target webpage text element; the target webpage element is a webpage element having text content containing an internationalization key; acquire first translation content corresponding to the text content according to the internationalization key in response to a triggering operation on the language translation component; acquire second translation content corresponding to part or all of the text content obtained through an auxiliary translation interface; and obtain target translation content corresponding to the text content according to the first translation content and the second translation content.

[0024] In a fifth aspect, the present application further provides a computer program product comprising a computer program, wherein the computer program is executed by a processor to implement the following steps:

[0025] In response to the selection operation on the target webpage text element, display a language translation component; the target webpage element is a webpage element having text content containing an internationalization key; in response to a triggering operation on the language translation component, obtain first translation content corresponding to the text content according to the internationalization key; obtain second translation content corresponding to part or all of the text content obtained through an auxiliary translation interface; and obtain target translation content corresponding to the text content according to the first translation content and the second translation content.

[0026] The webpage interface development internationalization method, device, computer equipment, computer readable storage medium and computer program product can directly enter a translation mode by forming a language translation component through a friendly interaction mode, support other non-developers to participate in the development and maintenance of internationalization, quickly retrieve the translation entry of the currently selected webpage element through the internationalization key, ensure the consistency of the translation content, reduce the possibility of misoperation, generate real-time dynamic translation results when needed through the auxiliary translation interface, guarantee the context accuracy of the translation and the real-time performance of the translation, combine the first translation content and the second translation content to generate the target translation content, make the translation management more flexible and personalized, and thus improve the development efficiency of the webpage interface internationalization development. BRIEF DESCRIPTION OF DRAWINGS

[0027] In order to more clearly illustrate the technical solutions in the embodiments of the present application or the related art, the drawings needed to be used in the description of the embodiments of the present application or the related art will be briefly introduced. Obviously, the drawings in the following description are only some embodiments of the present application, and for those skilled in the art, other related drawings can also be obtained without creative labor on the basis of these drawings.

[0028] Figure 1 FIG. 1 is a flowchart of a webpage interface development internationalization method in one embodiment;

[0029] Figure 2 FIG. 2 is a flowchart of a webpage interface development internationalization method based on a debugging version in one embodiment;

[0030] Figure 3A flowchart of a webpage interface development internationalization method in another embodiment;

[0031] Figure 4 A structural block diagram of a webpage interface development internationalization device in an embodiment;

[0032] Figure 5 An internal structure diagram of a computer device in an embodiment. DETAILED DESCRIPTION

[0033] In order to make the purposes, technical solutions and advantages of the present application clearer, the present application will be further described in detail below with reference to the drawings and embodiments. It should be understood that the specific embodiments described herein are only used to explain the present application and not to limit the present application.

[0034] In order to make those skilled in the art better understand the present application, the related art will be introduced first.

[0035] Multilingual support refers to allowing an application to provide the same functionality and user experience in different language environments. This involves designing and implementing an application to dynamically adapt to different languages without affecting functionality or usability. Developers can achieve this goal by using various programming languages and frameworks, such as Java, JavaScript, and Vue.js.

[0036] Character encoding refers to the use of different character sets and encoding schemes in different languages. In order to ensure that an application can correctly process and display characters in multiple languages, developers need to be familiar with various character encoding standards, such as UTF-8 or UTF-16, and use appropriate encoding methods in the code. Especially when dealing with non-Latin alphabets, character representation can be more complex.

[0037] Localization refers to the process of adapting an application to different cultural environments, ensuring that not only the content is translated, but also the format is adjusted to conform to regional customs, such as date format, currency symbol, time format, and number system. To simplify localization work, developers often rely on localization libraries and tools, such as moment.js, ReactIntl, etc., which provide functions to format content according to user-specific regional settings.

[0038] In one embodiment, as shown in Figure 1 A webpage interface development internationalization method is provided, and the present embodiment takes the method applied to a terminal as an example, which includes the following steps:

[0039] Step S102, in response to the selection operation of the target webpage text element, display the language translation component. The target webpage element is a webpage element with text content containing internationalization keys.

[0040] Among them, the target web page text element belongs to the management staff web page element with text content, and its form can be, for example, a button, a title, a menu item, or paragraph text, etc. The target web page text element is integrated with the internationalization mechanism of the system, and its text content can contain internationalization keys related to specific languages of internationalization.

[0041] Among them, the internationalization key can be used as an identifier for associating the web page text element with multilingual translation content, and can be embedded into an attribute in HyperText Markup Language (HTML), such as "Product Name". The internationalization key data-i18n-key can be used to identify specific language text and associate it with the corresponding translation content, data-i18n-value is the value corresponding to the internationalization key data-i18n-key, and div refers to a block element in HTML.

[0042] Among them, the selection operation can be an operation in which the management staff selects a specific text element when interacting with the web page. This operation can be achieved by means such as touch and keyboard navigation.

[0043] Among them, the language translation component is used to display the translation result of the text content corresponding to the target web page text element, and it can be set to be displayed on the web page due to certain operations being triggered in the web page. <00​​​​​​​​​Exemplarily, the manager triggers the translation retrieval process by clicking the language translation component. The terminal locates the corresponding translation language file through the internationalization key of the target webpage text element, points to the translation database of the server, and obtains the first translation content corresponding to the text content obtained by the internationalization key.

[0048] Optionally, the terminal can also retrieve the translation content corresponding to the key from the local cache to improve retrieval efficiency and avoid accessing the remote server every time. If there is no corresponding translation entry in the local cache, the terminal automatically initiates a server request to retrieve the first translation content in the remote database.

[0049] Step S106, obtaining the second translation content corresponding to part or all of the text content obtained through the auxiliary translation interface.

[0050] The auxiliary translation interface can be an external translation service or tool for generating real-time translation. The auxiliary translation interface can connect to an online translation service, such as machine translation or a language model, to assist in providing translation content corresponding to the text content of the internationalization key. Unlike the preset translation in the system, the translation content generated by the auxiliary translation interface can be real-time translation based on the latest data.

[0051] The second translation content is the translation result generated by the auxiliary translation interface. When real-time translation is required or the first translation content cannot be obtained, the second translation content can be used to replace or supplement the first translation content. The second translation content can be a partial translation result of the selected text content, or a complete translation result of the complete selected text content.

[0052] Exemplarily, the terminal checks whether the first translation content of the selected text content already exists or meets the requirements of the current language environment. If there is no suitable first translation content, the terminal calls the auxiliary translation interface. The terminal allows the manager to request the auxiliary translation interface to process only part of the text content, or to process the entire text content. Through the auxiliary translation interface, after receiving the translation result, the second translation content is generated and returned to the terminal.

[0053] Step S108, obtaining the target translation content corresponding to the text content according to the first translation content and the second translation content.

[0054] The target translation content is the translation result for final display to the manager, which can be obtained by comparing, selecting, or combining the first translation content and the second translation content. The terminal can automatically or manually determine the target translation content according to the logic or the manager input, to ensure its accuracy, suitability, and compliance with the requirements of the current language environment.

[0055] Exemplarily, the terminal automatically selects the first translation content or the second translation content as the target translation content according to a preset logical rule. For example, when the first translation content exists and has a high quality, the terminal can select the first translation content as the target translation content finally displayed. When the first translation content is missing, has a low quality, or the management personnel explicitly requires to use the dynamically generated translation, the terminal can use the second translation content.

[0056] Optionally, the terminal allows the management personnel to manually select the target translation content, and the management personnel determines the target translation content finally applied to the webpage display by comparing the first translation content and the second translation content.

[0057] In the webpage interface development internationalization method, the language translation component is displayed in response to the selection operation on the target webpage text element; the target webpage element is a webpage element having text content containing an internationalization key; the first translation content corresponding to the text content is obtained according to the internationalization key in response to the triggering operation on the language translation component; the second translation content corresponding to part or all of the text content obtained through the auxiliary translation interface is obtained; and the target translation content corresponding to the text content is obtained according to the first translation content and the second translation content. In this embodiment, the language translation component is formed through a friendly interaction mode, and the translation mode can be directly entered, so that other non-development personnel can participate in the development and maintenance of internationalization; through the internationalization key, the translation entry of the currently selected webpage element can be quickly retrieved, which not only ensures the consistency of the translation content, but also reduces the possibility of misoperation; meanwhile, through the auxiliary translation interface, real-time dynamic translation results can be generated when needed, the context accuracy of translation and the real-time performance of translation are ensured, the target translation content is generated by combining the first translation content and the second translation content, the translation management is more flexible and personalized, and therefore the development efficiency of webpage interface internationalization development is improved.

[0058] In an exemplary embodiment, before the language translation component is displayed in response to the selection operation on the target webpage text element, the method further includes: if a mouse-over event of the target webpage text element is monitored, it is determined that the selection operation is received; and the language translation component is displayed by displaying the language translation component according to the position of the target webpage text element or the position of the mouse.

[0059] Exemplarily, the terminal first determines the selection operation of the management personnel through the mouse-over event. Before the management personnel performs the operation, the mouse event listener is set to capture the preliminary interaction behavior of the management personnel and the target webpage text element. When the terminal detects that the mouse of the management personnel is hovering over a certain target webpage text element, the terminal can determine that the element is “selected”, and the language translation component (editing icon button) will be displayed after the operation of the management personnel is further confirmed.

[0060] Specifically, the terminal globally monitors all DOM (Document Object Model) elements with the internationalization key (data-i18n-key) attribute through a document object when a webpage is loaded. By monitoring mouseover and mouseout events, it can be detected whether the mouse of the administrator is moved over the target webpage text element.

[0061] When the mouseover event is triggered, the terminal will determine whether the administrator has hovered over the target webpage text element for a long time. If the mouse of the administrator moves out of the element within a short time, the edit icon button will not be displayed to avoid misoperation. If the mouse stays over the element for more than a preset time, the terminal determines that the target webpage text element has been selected, and then calls the showEditButton function to display the edit icon button. In this process, the showEditButton function adjusts the position of the edit icon button according to the position information of the current DOM element or the position of the mouse pointer.

[0062] When the administrator moves the mouse out of the target webpage text element, the terminal automatically hides the edit icon button through the mouseout event to prevent too many interactive elements on the page from interfering with the administrator's operation. The hideEditButton function is responsible for detecting the mouseout event of the administrator and removing the edit icon button to ensure the interface is clean.

[0063] In this embodiment, through the global monitoring mechanism, real-time monitoring and intelligent response to the target webpage text element are realized. When the mouse of the administrator passes through the DOM element containing the internationalization key, the interactive intention of the administrator can be accurately captured and the edit icon button is displayed. This mechanism provides a simple translation editing entry without disturbing the administrator, greatly improving the translation management efficiency of the multilingual webpage.

[0064] In one example embodiment, in response to a triggering operation of a language translation component, a first translation content corresponding to text content is obtained according to an internationalization key, including: in response to the triggering operation of the language translation component, displaying a translation window, and requesting candidate first translation content corresponding to the text content from a server according to the internationalization key; the translation window displays a language translation form corresponding to the internationalization key; the language translation form displays preset first translation content; and the first translation content is displayed on the language translation form according to the candidate first translation content and the preset first translation content.

[0065] The preset first translation content can be defined in advance and used to show the default translation result to the administrator when the webpage is initially loaded. The preset first translation content provides a basic translation for the multilingual text in the webpage and is displayed in the translation form for the administrator to confirm or modify.

[0066] The candidate first translation content is the translation candidate content related to the internationalization key requested from the server side by the system through a Representational State Transfer (RESTful) interface. The candidate first translation content can be dynamically updated from the server or associated with the translation record of the current page and can include multiple language options to help the administrator select or refer to the translation content.

[0067] The translation window can be a modal window that pops up after the administrator clicks the language translation component and is used to display the translation form.

[0068] The language translation form is part of the translation window and is used to display the translation content corresponding to the currently selected target webpage text. The language translation form includes but is not limited to the internationalization key, the preset first translation content, and the candidate first translation content related to the key. The administrator can edit, select, and submit the translation content in the language translation form to finally determine the target translation content displayed on the page.

[0069] Specifically, when the administrator clicks the language translation component in the page, the terminal triggers the operation of displaying the modal window.

[0070] After displaying the translation window, the terminal can obtain the multilingual translation content stored on the server side through a RESTful interface request (GET). The data returned by the server includes the candidate first translation content, which can be the update result of the system or other options in the multilingual version. After receiving the candidate first translation, the terminal fills the candidate first translation content into the translation form. The administrator can select or edit the preset first translation content and the candidate first translation content in the translation window. The terminal allows the administrator to manually modify the text in the translation form based on the candidate first translation content and finally confirm and save the translation.

[0071] In this embodiment, the candidate translation content of the server is requested through the RESTful interface, which can provide the administrator with translation options in the multilingual version and display the preset first translation content and the candidate translation content in the translation form, ensuring that the final translation text is more consistent with the language environment and context requirements. At the same time, the display of the candidate translation content provides more references for the administrator, ensuring the consistency and accuracy of the multilingual webpage content and improving the efficiency of internationalization development of the webpage.

[0072] In an exemplary embodiment, the first translation content is displayed on the language translation form according to the candidate first translation content and the preset first translation content, including: if the candidate first translation content is empty, the preset first translation content is displayed as the first translation content in the language translation form; if the candidate first translation content is not empty, the candidate first translation content is displayed as the first translation content in the language translation form.

[0073] Specifically, when the administrator clicks the language translation component and triggers the translation editing window, the terminal can request the server for the candidate first translation content corresponding to the internationalization key (data-i18n-key) through the RESTful interface. The RESTful interface / api / locale_values obtains the candidate first translation content of the key in each language according to the provided data-i18n-key, and returns in JSON format. If some languages have not been translated, the translation content returned by the server will be empty.

[0074] When the terminal receives the candidate first translation content from the server, when rendering the language translation form, the terminal selects to display the candidate first translation content or the preset first translation content according to different conditions. If the candidate first translation content is empty, the terminal displays the preset first translation content in the language translation form. The preset first translation content can be the default translation defined when the terminal is online, which is used to ensure the integrity and consistency of the translation content. If the candidate first translation content is not empty, the terminal preferentially displays the candidate first translation content returned by the server, indicating that the text has been updated or revised on the server side, and the administrator can view and confirm the candidate translation in the translation form.

[0075] In this embodiment, the final first translation content can be intelligently selected and displayed according to different situations of the candidate first translation content and the preset first translation content. For the language that has been translated, the candidate translation content is preferentially displayed; for the language that has not been translated, the preset first translation content is displayed, ensuring the real-time and accuracy of translation. This way greatly improves the flexibility and efficiency of internationalization development, avoiding the problem of incomplete or incorrect translation due to the absence of candidate translation.

[0076] In an example embodiment, the translation window further displays a language input box; before obtaining the second translation content corresponding to the partial or entire text content obtained through the auxiliary translation interface, further comprising: after the language translation form displays the first translation content, obtaining the partial or entire text content input into the language input box; sending the partial or entire text content to the server, so that the server obtains the second translation content corresponding to the partial or entire text content through the auxiliary translation interface; after obtaining the second translation content corresponding to the partial or entire text content through the auxiliary translation interface, further comprising: displaying the second translation content in the language translation form.

[0077] The language input box can be an interactive element in the translation window, used to receive text content manually input or modified by the administrator. The language input box allows the administrator to further adjust the existing translation content and provides a direct input operation interface. The administrator can edit the translation content of the currently displayed translation form through the language input box, and the system can call the auxiliary translation interface to generate the corresponding translation result according to the input content of the administrator.

[0078] Specifically, when the administrator clicks the language translation component, the terminal pops up a translation window. The translation window contains a language input box for the administrator to input or modify partial or entire text content. The administrator manually inputs new translation text in the language input box, or uses the content provided by the language input box for auxiliary translation. After the administrator inputs partial or entire text content, the terminal sends the input text content to the server. After receiving the request, the server calls an external auxiliary translation interface to generate corresponding second translation content. The second translation content is returned to the front end in JSON format. After the terminal receives the translation result, it is rendered to the language translation form and displayed in the web interface.

[0079] In this embodiment, by displaying the language input box, the administrator can manually input partial or entire text content and flexibly control the translation text. With the help of the auxiliary translation interface, the terminal can generate second translation content in real time, improving the translation management capability of the multilingual web page, especially suitable for complex web page environments that require frequent updates of translation content. By introducing automated translation means, the burden of manual translation is effectively reduced.

[0080] In an example embodiment, after obtaining the target translation content corresponding to the text content according to the first translation content and the second translation content, further comprising: displaying the target translation content in the language translation form; submitting the language translation form to the server, so that the server replaces the text content of the target web page text element with the target translation content.

[0081] Specifically, after generating the target translation content, the terminal displays it dynamically in the language translation form in the translation window. The target translation content can be the first translation content, the second translation content generated through the auxiliary translation interface, or a combination of the two. The translation form not only displays the preset translation content, but also performs typesetting checks on the translated sentences to ensure that the text presentation in different languages meets expectations. After confirming the target translation content, the terminal listens for the administrator's operation of submitting the translation form and submits the confirmed target translation content to the server through the RESTful interface. After the server receives the target translation content, it updates the target translation content to the corresponding language file (such as locales / zh-CN / translations.json and locales / en-US / translations.json) so that the terminal can subsequently load new translation content. After the server successfully receives and saves the target translation content, the terminal automatically updates the corresponding text elements on the webpage according to the translation results returned by the server. Through this operation, the administrator can immediately see the presentation effect of the latest translation text on the page, ensuring the accuracy of the translation content and the consistency of the context.

[0082] After updating the target webpage text elements, the terminal provides a checking and verification mechanism to ensure that the submitted target translation content is correctly displayed on the page. The administrator can check whether the translated sentences are accurate through specific application scenarios and contexts, and adjust details such as text typesetting and alignment to ensure the adaptability of the translation content in a multilingual environment.

[0083] After confirming the accuracy of the target translation content, the translation file is synchronized to the development environment and submitted to the version control system. The administrator can further review and optimize these translation files in the project.

[0084] In this embodiment, through the RESTful interface, the system can dynamically upload the user-confirmed translation content to the server and update the corresponding language file, allowing the webpage to load the latest translation text and present it immediately. This process ensures the accuracy of the translation content, the consistency of the context, and the rationality of the page layout, further improving the efficiency of webpage interface internationalization development and maintenance capabilities.

[0085] In an exemplary embodiment, the version control system has two product-based version types, including release and debug. The release version is a formal release version that has been strictly tested and optimized, and does not contain code and functions related to webpage development internationalization. The debug version contains code and functions related to webpage interface development internationalization.

[0086] In one specific embodiment, the administrator debugs the process of the debug version as shown in Figure 2

[0087] In the initial stage, the administrator needs to install or deploy the debug type product corresponding to the version. After installation is complete, the administrator opens the web interface and enters the debugging environment of the terminal. In the debug environment, the developer can edit and update the translated content in real time to ensure the correctness of multilingual support.

[0088] When the administrator moves the mouse on the web page and passes through the target web page text element that needs to be translated, the terminal automatically detects the target web page text element and displays an edit icon button. When the administrator hovers the mouse over the element, the terminal captures the administrator's interactive operation through an event listener and displays an editable button. When the administrator clicks the edit icon button, the terminal pops up a language translation window (Modal modal window).

[0089] In the Modal modal window, the administrator can see the first translation content corresponding to the internationalization key corresponding to the current target web page text element through the language translation form. In addition, the Modal modal window can contain a language input box for displaying the translated version of the text in different languages, allowing the administrator to edit.

[0090] The administrator can view the second translation content generated through an auxiliary translation interface, such as a Generative Pre-trained Transformer (GPT) based on a generative pre-trained transformer model or an online translation API. The terminal automatically generates the second translation content in the corresponding language by calling these translation services and fills in the corresponding input box of the translation form. According to the first translation content and the second translation content, the target translation content corresponding to the target web page text element is obtained.

[0091] After the target translation content is generated, the administrator can check and confirm the target translation content to ensure that the translation result is accurate and consistent with the context of the text. The administrator can also directly translate and modify the translation content through auxiliary tools to ensure the reasonableness of the content and the coherence of the context. This step allows the administrator to check and correct the translation content in different languages one by one.

[0092] In this embodiment, through the debugging of the debug version, the administrator (such as designers, product personnel, and test personnel) other than the developer can participate in internationalization development and maintenance, so that the entire web interface internationalization development is no longer solely dependent on the developer, thereby improving the efficiency of internationalization development.

[0093] ​In order for those skilled in the art to better understand the above steps, the embodiments of the present application are exemplarily illustrated by an example below, but it should be understood that the embodiments of the present application are not limited thereto.

[0094] In an exemplary embodiment, as shown in Figure 3 first, the terminal defines an internationalization key and a corresponding preset translation value for a text element in a target webpage. The internationalization key is a unique identifier for identifying a specific language text element, and the preset value is usually the initial translation content of the terminal, which is used as the default display when the language file does not exist or there is no translation content.

[0095] Next, the terminal checks whether the translation content corresponding to the internationalization key already exists in the language file (locale file). If the language file does not exist or the translation content of the key is missing in the file, the terminal will automatically use the preset translation value.

[0096] After reading the language file, the terminal generates an HTML element in the webpage according to the internationalization key and displays it in the page. At this time, a data-i18n-key attribute is embedded in the HTML element, which binds the internationalization key for subsequent translation management operations.

[0097] The terminal sets an event listener for the DOM element with the data-i18n-key attribute, which is used to capture the mouse event of the administrator. When the user hovers over these elements, the terminal displays an edit button, allowing the user to click to modify the current translation content.

[0098] When the user clicks the edit button, the terminal requests the server through the RESTful interface to obtain a list of all languages supported by the current terminal, and renders the corresponding translation form. The form will show the translation status of the internationalization key in a multi-language environment, allowing the user to edit the translation content for different languages.

[0099] The terminal then obtains the translation content related to the internationalization key through the RESTful interface and fills these contents into the language translation form. The administrator can view or modify these translation contents to ensure that the translation of each language meets the expectations.

[0100] After the administrator modifies the translation content in the translation form, the administrator can submit the form. After the terminal receives the translation content submitted by the administrator, the terminal sends the translation content to the server through a POST request, and the server saves the updated translation content in the corresponding language file. After the administrator submits the translation form, the terminal automatically checks and ensures that all translation content is successfully saved in the language file. The developer can check the correctness of the language file through the version control mechanism of the terminal to ensure that the file content meets the internationalization requirements of the project. After confirming that there is no error, the translation file is synchronized to the code repository for use in the next version release.

[0101] In this embodiment, the terminal can dynamically obtain and update the translation content through the RESTful interface, reducing the complexity of manually managing the language file; the administrator can directly edit the translation content through the translation form and submit the updated translation to the server, reducing the workload of the developer; the terminal automatically checks and updates the language file to ensure the accuracy and consistency of the translation content, and synchronizes the modified file to the code repository through version control, simplifying the process of internationalization development.

[0102] It should be understood that, although each step in the flowchart involved in each embodiment as described above is shown in sequence according to the direction of the arrow, these steps are not necessarily executed in sequence according to the direction of the arrow. Unless otherwise specified herein, the execution of these steps is not strictly limited in sequence, and these steps can be executed in other sequences. Moreover, at least part of the steps in the flowchart involved in each embodiment as described above can include multiple steps or stages, which are not necessarily executed at the same time, but can be executed at different times, and the execution sequence of these steps or stages is not necessarily sequential, but can be executed in rotation or alternation with at least part of other steps or steps or stages in other steps.

[0103] Based on the same inventive concept, the embodiments of the present application also provide a web interface development internationalization device for implementing the above-mentioned web interface development internationalization method. The implementation scheme for solving the problem provided by the device is similar to the implementation scheme described in the above method, so the specific limitations in one or more web interface development internationalization device embodiments provided below can refer to the limitations of the web interface development internationalization method described above, and will not be repeated here.

[0104] In one exemplary embodiment, as shown in Figure 4 A web interface development internationalization device is provided, including: a language translation component display module 410, a first translation content acquisition module 420, a second translation content acquisition module 430, and a translation integration module 440, wherein:

[0105] The language translation component display module 410 is configured to display a language translation component in response to a selection operation on a target webpage text element; the target webpage element is a webpage element having text content containing an internationalization key;

[0106] The first translation content acquisition module 420 is configured to acquire first translation content corresponding to the text content according to the internationalization key in response to a triggering operation on the language translation component;

[0107] The second translation content acquisition module 430 is configured to acquire second translation content corresponding to part or all of the text content obtained through an auxiliary translation interface;

[0108] The translation integration module 440 is configured to obtain target translation content corresponding to the text content according to the first translation content and the second translation content.

[0109] In an exemplary embodiment, the language translation component display module 410 is further configured to determine that the selection operation is received if a mouse-over event of the target webpage text element is monitored; and the language translation component display module 410 is configured to display the language translation component according to a position of the target webpage text element or a position of a mouse.

[0110] In an exemplary embodiment, the first translation content acquisition module 420 is further configured to display a translation window in response to the triggering operation of the language translation component, and request candidate first translation content corresponding to the text content from a server according to the internationalization key; the translation window displays a language translation form corresponding to the internationalization key; the language translation form displays preset first translation content; and the first translation content is displayed in the language translation form according to the candidate first translation content and the preset first translation content.

[0111] In an exemplary embodiment, the first translation content acquisition module 420 is further configured to display the preset first translation content in the language translation form as the first translation content if the candidate first translation content is empty; and display the candidate first translation content in the language translation form as the first translation content if the candidate first translation content is not empty.

[0112] In an exemplary embodiment, the first translation content obtaining module 420 is further configured to obtain part or all of the text content input into the language input box after the language translation form displays the first translation content; send part or all of the text content to the server, so that the server obtains the second translation content corresponding to part or all of the text content through the auxiliary translation interface; and the second translation content obtaining module 430 is further configured to display the second translation content in the language translation form.

[0113] In an exemplary embodiment, the translation integration module 440 is further configured to display the target translation content in the language translation form; and submit the language translation form to the server, so that the server replaces the text content of the target webpage text element with the target translation content.

[0114] The above-mentioned various modules in the webpage interface development internationalization apparatus can be realized by software, hardware, or a combination thereof. The above-mentioned various modules can be embedded in or independent of a processor in a computer device in hardware form, or can be stored in a memory in the computer device in software form, so as to be called and executed by the processor to perform the operations corresponding to the above-mentioned various modules.

[0115] In an exemplary embodiment, a computer device is provided, which can be a terminal, and an internal structure diagram of the computer device can be as shown in Figure 5The computer device shown in the figure includes a processor, a memory, an input / output interface, a communication interface, a display unit and an input device. Among them, the processor, the memory and the input / output interface are connected through a system bus, and the communication interface, the display unit and the input device are connected to the system bus through the input / output interface. Among them, the processor of the computer device is used to provide computing and control capability. The memory of the computer device includes a non-volatile storage medium and an internal memory. The non-volatile storage medium stores an operating system and a computer program. The internal memory provides an environment for the operating system and the computer program in the non-volatile storage medium to run. The input / output interface of the computer device is used to exchange information between the processor and external devices. The communication interface of the computer device is used to communicate with external terminals in a wired or wireless manner. The wireless manner can be realized through WIFI, mobile cellular network, near field communication (NFC) or other technologies. The computer program is executed by the processor to realize a web page interface development internationalization method. The display unit of the computer device is used to form a visually visible picture, which can be a display screen, a projection device or a virtual reality imaging device. The display screen can be a liquid crystal display screen or an electronic ink display screen. The input device of the computer device can be a touch layer overlaid on the display screen, or a key, trackball or touchpad arranged on the shell of the computer device, or an external keyboard, touchpad or mouse, etc.

[0116] Those skilled in the art can understand that, Figure 5 The skilled in the art can understand that,

[0117] In one embodiment, a computer device is provided, including a memory and a processor, the memory stores a computer program, and the processor executes the computer program to realize the steps in the above method embodiments.

[0118] In one embodiment, a computer readable storage medium is provided, which stores a computer program, and the computer program is executed by a processor to realize the steps in the above method embodiments.

[0119] In one embodiment, a computer program product is provided, including a computer program, and the computer program is executed by a processor to realize the steps in the above method embodiments.

[0120] It should be noted that the user information (including but not limited to user equipment information, user personal information, etc.) and data (including but not limited to data for analysis, stored data, displayed data, etc.) involved in the present application are all information and data authorized by the user or authorized by all parties, and the collection, use and processing of related data need to comply with relevant regulations.

[0121] It can be understood by those skilled in the art that all or part of the processes in the above-mentioned embodiment methods can be completed by instructing related hardware through a computer program. The computer program can be stored in a non-volatile computer readable storage medium. When the computer program is executed, it can include the processes of the above-mentioned embodiments of each method. In the embodiments provided in the present application, any reference to memory, database or other medium can include at least one of non-volatile memory and volatile memory. Non-volatile memory can include read-only memory (ROM), magnetic tape, floppy disk, flash memory, optical storage, high-density embedded non-volatile memory, resistive random access memory (ReRAM), magnetoresistive random access memory (MRAM), ferroelectric random access memory (FRAM), phase change memory (PCM), graphene memory, etc. Volatile memory can include random access memory (RAM) or external cache memory, etc. As an illustration but not limitation, RAM can be in various forms, such as static random access memory (SRAM) or dynamic random access memory (DRAM), etc. The database involved in the embodiments provided in the present application can include at least one of a relational database and a non-relational database. The non-relational database can include a distributed database based on a block chain, etc., without being limited thereto. The processor involved in the embodiments provided in the present application can be a general-purpose processor, a central processing unit, a graphics processing unit, a digital signal processor, a programmable logic device, a data processing logic device based on quantum computing, an artificial intelligence (AI) processor, etc., without being limited thereto.

[0122] Any technical features in the above embodiments can be combined, and for the sake of brevity, not all possible combinations are described above, however, any combination of these technical features is deemed to be within the scope of the present application.

[0123] The above embodiments only express several implementation manners of the present application, and the description is relatively specific and detailed, but it should not be understood as a limitation on the patent scope of the present application. It should be pointed out that, for ordinary skilled persons in the art, several modifications and improvements can be made without departing from the concept of the present application, and these all belong to the protection scope of the present application. Therefore, the protection scope of the present application should be subject to the appended claims.

Claims

1. A method for developing internationalization of a web interface in a debug version of a web application, characterized in that, The method comprises: If a mouse-over event of a target webpage text element is monitored, it is determined that a selection operation is received; In response to the selection operation of the target webpage text element, a language translation component is displayed; the target webpage text element is a webpage element with text content containing an internationalization key; wherein the language translation component is displayed according to the position of the target webpage text element or the position of the mouse; In response to a triggering operation of the language translation component, a translation window is displayed, and a candidate first translation content corresponding to the text content is requested from a server through a RESTful interface according to the internationalization key; the translation window displays a language translation form corresponding to the internationalization key; the language translation form is used to display a preset first translation content and perform translation content layout checking; If the candidate first translation content is empty, the preset first translation content is displayed as the first translation content in the language translation form; If the candidate first translation content is not empty, the candidate first translation content is displayed as the first translation content in the language translation form; After the language translation form displays the first translation content, part or all of the text content input into a language input box is obtained; Part or all of the text content is sent to the server, so that the server obtains real-time second translation content corresponding to part or all of the text content through an auxiliary translation interface; the auxiliary translation interface is used to connect an online translation service, and the online translation service is machine translation or a language model; The second translation content is displayed in the language translation form; part or all of the text content is obtained through a language input box of the translation window; According to the first translation content and the second translation content, target translation content corresponding to the text content is obtained, and the target translation content is displayed in the language translation form; In response to a submission operation of the language translation form displaying the target translation content, the target translation content is saved to a language file, and the language file is subjected to correctness checking through a version control mechanism; if the correctness checking result indicates that the language file meets the internationalization requirements of a project, the translation file is submitted to a code repository for use in the next version release, and the target translation content is sent to the server to update the candidate first translation content, and the text content of the target webpage text element containing the internationalization key is replaced with the target translation content.

2. A device for developing internationalized web interfaces in a debug version of a web application, characterized in that, The device comprises: A language translation component display module is configured to determine that a selection operation is received if a mouse-over event of a target webpage text element is monitored; and display a language translation component in response to the selection operation of the target webpage text element; the target webpage text element is a webpage element with text content containing an internationalization key; wherein the language translation component is displayed according to the position of the target webpage text element or the position of the mouse; The first translation content obtaining module is configured to, in response to a triggering operation of the language translation component, display a translation window, and request candidate first translation content corresponding to the text content from a server through a RESTful interface and according to the internationalization key; the translation window displays a language translation form corresponding to the internationalization key; the language translation form is used to display preset first translation content and perform translation content layout inspection; if the candidate first translation content is empty, the preset first translation content is displayed as the first translation content in the language translation form; if the candidate first translation content is not empty, the candidate first translation content is displayed as the first translation content in the language translation form. The second translation content obtaining module is configured to, after the language translation form displays the first translation content, obtain part or all of the text content input into a language input box; send the part or all of the text content to the server, so that the server obtains real-time second translation content corresponding to the part or all of the text content through an auxiliary translation interface; the auxiliary translation interface is used to connect an online translation service, and the online translation service is machine translation or a language model; the language translation form displays the second translation content; and the part or all of the text content is obtained through the language input box of the translation window. The translation integration module is configured to obtain target translation content corresponding to the text content according to the first translation content and the second translation content, and display the target translation content in the language translation form; in response to a submission operation on the language translation form displaying the target translation content, save the target translation content to a language file, and perform correctness inspection on the language file through a version control mechanism; if the correctness inspection result indicates that the language file meets the internationalization requirement of a project, submit the translation file to a code repository for use in the next version release, and send the target translation content to the server, so that the server updates the candidate first translation content, and replaces the text content containing the internationalization key of the target web page text element with the target translation content.

3. A computer device comprising a memory and a processor, the memory storing a computer program, characterized in that, The processor executes the computer program to implement the steps of the method in claim 1.

4. A computer-readable storage medium having stored thereon a computer program, characterized in that, The computer program is executed by the processor to implement the steps of the method in claim 1.

5. A computer program product comprising a computer program, characterized in that, The computer program is executed by the processor to implement the steps of the method in claim 1. The computer program is executed by the processor to implement the steps of the method in claim 1.

Images