CN111726282B - Communication method and device of web application, electronic equipment and storage medium - Google Patents

Communication method and device of web application, electronic equipment and storage medium Download PDF

Info

Publication number
CN111726282B
CN111726282B CN202010563715.3A CN202010563715A CN111726282B CN 111726282 B CN111726282 B CN 111726282B CN 202010563715 A CN202010563715 A CN 202010563715A CN 111726282 B CN111726282 B CN 111726282B
Authority
CN
China
Prior art keywords
communication
web application
video stream
display interface
server
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Active
Application number
CN202010563715.3A
Other languages
Chinese (zh)
Other versions
CN111726282A (en
Inventor
龚大立
王培松
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Jingying Digital Technology Co Ltd
Original Assignee
Jingying Digital Technology Co Ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Jingying Digital Technology Co Ltd filed Critical Jingying Digital Technology Co Ltd
Priority to CN202010563715.3A priority Critical patent/CN111726282B/en
Publication of CN111726282A publication Critical patent/CN111726282A/en
Application granted granted Critical
Publication of CN111726282B publication Critical patent/CN111726282B/en
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Images

Classifications

    • HELECTRICITY
    • H04ELECTRIC COMMUNICATION TECHNIQUE
    • H04LTRANSMISSION OF DIGITAL INFORMATION, e.g. TELEGRAPHIC COMMUNICATION
    • H04L51/00User-to-user messaging in packet-switching networks, transmitted according to store-and-forward or real-time protocols, e.g. e-mail
    • H04L51/04Real-time or near real-time messaging, e.g. instant messaging [IM]
    • H04L51/046Interoperability with other network applications or services
    • GPHYSICS
    • G06COMPUTING; CALCULATING OR COUNTING
    • G06FELECTRIC DIGITAL DATA PROCESSING
    • G06F9/00Arrangements for program control, e.g. control units
    • G06F9/06Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
    • G06F9/44Arrangements for executing specific programs
    • G06F9/451Execution arrangements for user interfaces
    • HELECTRICITY
    • H04ELECTRIC COMMUNICATION TECHNIQUE
    • H04LTRANSMISSION OF DIGITAL INFORMATION, e.g. TELEGRAPHIC COMMUNICATION
    • H04L51/00User-to-user messaging in packet-switching networks, transmitted according to store-and-forward or real-time protocols, e.g. e-mail
    • H04L51/07User-to-user messaging in packet-switching networks, transmitted according to store-and-forward or real-time protocols, e.g. e-mail characterised by the inclusion of specific contents
    • H04L51/10Multimedia information
    • HELECTRICITY
    • H04ELECTRIC COMMUNICATION TECHNIQUE
    • H04LTRANSMISSION OF DIGITAL INFORMATION, e.g. TELEGRAPHIC COMMUNICATION
    • H04L51/00User-to-user messaging in packet-switching networks, transmitted according to store-and-forward or real-time protocols, e.g. e-mail
    • H04L51/52User-to-user messaging in packet-switching networks, transmitted according to store-and-forward or real-time protocols, e.g. e-mail for supporting social networking services
    • HELECTRICITY
    • H04ELECTRIC COMMUNICATION TECHNIQUE
    • H04LTRANSMISSION OF DIGITAL INFORMATION, e.g. TELEGRAPHIC COMMUNICATION
    • H04L67/00Network arrangements or protocols for supporting network services or applications
    • H04L67/01Protocols
    • H04L67/02Protocols based on web technology, e.g. hypertext transfer protocol [HTTP]

Abstract

The application relates to a communication method and device of a web application, an electronic device and a storage medium. The method is applied to a communication component at the front end of the web application, the communication component is loaded when logging in the web application, and the communication method is triggered by successful logging in the web application to obtain the logging information of the web application; the login information at least comprises user information; obtaining address book data which is stored by a server of the communication assembly and matched with the user information; determining a communication mode and a communication object in the address book data; and establishing communication data connection with the communication object through the server according to the communication mode. According to the scheme provided by the application, a communication page does not need to be independently developed for each service system, the communication component only needs to be loaded when the web application is logged in, communication with other users is quickly realized after the web application is successfully logged in, and all service systems can be adapted.

Description

Communication method and device of web application, electronic equipment and storage medium
Technical Field
The present application relates to the field of internet technologies, and in particular, to a communication method and apparatus for web applications, an electronic device, and a storage medium.
Background
In the related art, the communication function may be implemented by using a CS architecture, such as WeChat, nailing, etc., but this approach requires development and deployment of clients.
If the communication function is directly realized in the web application of the service system without developing and deploying the client, a specific communication page needs to be specially customized for the front end of the web application.
It can be seen that, in the related art, if a communication function of a web application is to be implemented, there is a technical problem of poor adaptability.
Disclosure of Invention
In order to overcome the problems in the related art, the application provides a communication method, a communication device, an electronic device and a storage medium for web applications, wherein the communication method can be adapted to all business systems.
The first aspect of the present application provides a communication method for a web application, which is applied to a communication component at a front end of the web application, where the communication component is loaded when logging in the web application, and the communication method includes:
acquiring login information of the web application by taking successful login of the web application as a trigger; the login information at least comprises user information;
obtaining address book data which is stored by a server of the communication assembly and matched with the user information;
determining a communication mode and a communication object in the address book data;
and establishing communication data connection with the communication object through the server according to the communication mode.
Optionally, when the communication component is loaded, the first display interface of the communication component is suspended on the display page of the web application for display.
Optionally, the obtaining address book data, which is stored by the server of the communication component and matches with the user information, includes:
receiving an operation instruction of a user on the first display interface;
switching the first display interface into a second display interface according to the operation instruction; the second display interface is used for displaying a communication mode and address book data matched with the user information in the communication mode.
The determining the communication mode and the communication object in the address book data comprises:
receiving a first selected operation of a user on a tab in the second display interface;
according to the first selected operation, determining a communication mode corresponding to the selected tab of the first selected operation;
receiving a second selected operation of the user on the address book data in the second display interface;
and according to the second selected operation, determining the communication object selected by the second selected operation.
Optionally, if the communication mode is a video call, the establishing, by the server, a communication data connection with the communication object includes:
displaying a third display interface;
acquiring a first audio/video stream of a local audio/video acquisition device, and displaying the first video stream in the first audio/video stream in a first display area of a third display interface;
transmitting the first audio and video stream to the server side, so that the server side sends the first audio and video stream to the communication object;
and receiving a second audio/video stream transmitted by the server and sent to the server by the communication object, displaying a second video stream in the second audio/video stream in a second display area of the third interface, and simultaneously playing audio data in the second audio/video stream.
Optionally, if the communication mode is a video conference, the establishing of the communication data connection with the communication object through the server includes:
displaying a fourth display interface;
calling a third audio and video stream of the local audio and video acquisition device;
transmitting the third audio and video stream to the server, so that the server performs mixing on the third video stream in the third audio and video stream and a fourth video stream transmitted by the communication object to obtain a mixed video stream;
and receiving the mixed video stream transmitted by the server, and displaying the mixed video stream on the fourth display interface.
Optionally, after the communication mode and the communication object in the address book data are determined, before the communication data connection with the communication object is established through the server according to the communication mode, the method further includes:
receiving a call establishment operation instruction for operating a call establishment operation button in a second display interface by a user;
displaying a call waiting interface according to the call establishing operation instruction; the call waiting interface includes a hang-up button for hanging up the communication session and call waiting information characterizing the call.
The second aspect of the present application provides a communication apparatus for a web application, which is applied to a communication component at a front end of the web application, where the communication component is loaded when logging in the web application, and the communication apparatus includes:
the login module is used for acquiring login information of the web application by taking successful login of the web application as a trigger; the login information at least comprises user information;
the address book data acquisition module is used for acquiring address book data which is stored by the server side of the communication assembly and matched with the user information;
the determining module is used for determining a communication mode and a communication object in the address book data;
and the communication module is used for establishing communication data connection with the communication object through the server according to the communication mode.
A third aspect of the present application provides an electronic device comprising:
a processor; and
a memory having executable code stored thereon, which when executed by the processor, causes the processor to perform a communication method of a web application as described above.
A fourth aspect of the present application provides a non-transitory machine-readable storage medium having stored thereon executable code, which when executed by a processor of an electronic device, causes the processor to perform a communication method of a web application as described above.
The technical scheme provided by the application can comprise the following beneficial effects:
according to the technical scheme, communication pages do not need to be developed independently for each service system, the communication components only need to be loaded when the web application is logged in, communication with other users is quickly achieved after the web application is successfully logged in, and all service systems can be adapted.
According to the technical scheme, the communication with other users can be carried out quickly and conveniently on the premise that the display content of the current web page does not need to be switched, operation steps are reduced, and the communication efficiency is improved.
According to the technical scheme, video call or video conference can be realized only by means of login information of web application on the premise of not changing the functions of a service system, functions of an address book, video communication, conference and the like are realized by means of minimum transmission parameters, and integration, transplantation and maintenance are easy.
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 application.
Drawings
The foregoing and other objects, features and advantages of the application will be apparent from the following more particular descriptions of exemplary embodiments of the application, as illustrated in the accompanying drawings wherein like reference numbers generally represent like parts throughout the exemplary embodiments of the application.
Fig. 1 is a flowchart illustrating a communication method of a web application according to an embodiment of the present application;
FIG. 2 is a schematic diagram illustrating an arrangement of a first display interface of a communication assembly according to an embodiment of the present application;
FIG. 3 is a schematic diagram illustrating an arrangement of a second display interface of the communication assembly according to an embodiment of the application;
FIG. 4 is a schematic diagram illustrating another arrangement of a second display interface of a communication assembly according to an embodiment of the present application;
fig. 5 is a flowchart illustrating a specific implementation of determining a communication mode and a communication object in address book data in a communication method for a web application according to an embodiment of the present application;
FIG. 6 is a schematic interface diagram of a video call according to an embodiment of the present application;
FIG. 7 is a schematic interface diagram of a video conference shown in an embodiment of the present application;
FIG. 8 is a schematic diagram of an interface of a call waiting state according to an embodiment of the present application;
FIG. 9 is an interface diagram of an incoming call waiting interface according to an embodiment of the present application;
fig. 10 is a schematic structural diagram of a communication device of a web application according to an embodiment of the present application;
fig. 11 is a schematic structural diagram of an electronic device shown in an embodiment of the present application.
Detailed Description
Preferred embodiments of the present application will be described in more detail below with reference to the accompanying drawings. While the preferred embodiments of the present application are shown in the drawings, it should be understood that the present application may be embodied in various forms and should not be 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 scope of the disclosure to those skilled in the art.
The terminology used herein is for the purpose of describing particular embodiments only and is not intended to be limiting of the application. As used in this application and the appended claims, the singular forms "a", "an", and "the" are intended to include the plural forms as well, unless the context clearly indicates otherwise. It should also be understood that the term "and/or" as used herein refers to and encompasses any and all possible combinations of one or more of the associated listed items.
It should be understood that although the terms "first," "second," "third," etc. may be used herein to describe various information, these information should not be limited to these terms. These terms are only used to distinguish one type of information from another. For example, first information may also be referred to as second information, and similarly, second information may also be referred to as first information, without departing from the scope of the present application. Thus, a feature defined as "first" or "second" may explicitly or implicitly include one or more of that feature. In the description of the present application, "a plurality" means two or more unless specifically limited otherwise.
The embodiment of the application discloses a communication method and device of a web application, electronic equipment and a storage medium.
The core idea of the application is to integrate visual communication functions in web applications.
In the related art, there are cases where multiple business systems are used simultaneously, for example, a downhole exploration system and an office system, and when a user uses the downhole exploration system or uses the office system simultaneously, if a communication function is to be implemented, a communication component needs to be developed separately for a web application of each system to implement the function of communicating with other users. By the method, a large amount of manpower and material resources are wasted, and each business system needs to learn again, so that the learning cost is increased. When each service system communicates, the corresponding communication page is required to be operated first, then login and other operations are executed, and finally voice and other communication with other users can be realized.
In view of the above problems, embodiments of the present application provide a communication method for web applications, which can adapt to all service systems, provide communication and conference services for the service systems, and meet fast and convenient communication requirements.
The technical solutions of the embodiments of the present application are described in detail below with reference to the accompanying drawings.
Fig. 1 is a flowchart illustrating a communication method of a web application according to an embodiment of the present application.
Referring to fig. 1, the communication method of the web application provided by the present application is applied to a communication component at the front end of the web application, and the communication component is loaded when logging in the web application.
In the technical solution of the present application, a communication component is provided, and the communication component is a front end of a web application and is preferably implemented by using an vue framework. Since the vue framework belongs to the front-end framework and is developed by using the JS language, when deploying the communication function to the web application, the communication function only needs to be packaged as the vue component of the web application. When the web application logs in, the communication component is loaded.
Therefore, the communication component in the technical scheme of the application can be adapted to all business systems, only the communication component needs to be loaded when the communication component logs in, and complex operations such as redundant code setting, page layout and the like are not needed.
Based on this, the communication method of the present application includes:
s100, obtaining login information of the web application by taking successful login of the web application as a trigger; the login information at least comprises user information;
in the embodiment of the application, when the web application of the service system loaded with the communication component is successfully logged in, the login information of the logged-in web application is transmitted to the communication component, so that the communication component authenticates the login information.
In the embodiment of the application, the corresponding communication component is provided with a server side. The server is provided with an address book. Preferably, the address book table field created in the server is id, user name, number, unit name unit id, superior unit name, superior unit id, and is used for storing the address book content. In addition, the server is also provided with an authentication database consistent with the service system and used for authenticating the transmitted user information, so that a first display interface of the communication component is displayed on a page of the web application in a suspension mode. If a certain service system is not expected to use the communication function of the communication component, the authentication database corresponding to the service system can be directly shielded.
It can be understood that the communication component has preset therein a connection mode with the server and a login mode, such as parameters of a port number, an address, and the like. When the port or the address of the server side changes, only corresponding parameters in the communication assembly need to be replaced. The content of the communication assembly is updated only once, the service system is not required to be changed, the normal use of the service system is not influenced, the user side does not feel, and the user does not need to memorize and input parameters such as redundant network addresses or port numbers.
In the embodiment of the application, the user does not need to memorize any information about the communication assembly, and only needs to input the user information, such as a user name and a password, of the service system which the user needs to log in when logging in the service system, such as a coal mine underground early warning system, a fusion platform and the like, so that the authentication operation of the communication assembly can be realized. An imperceptible communication-enabled function is realized for the user.
In the embodiment of the present application, after the authentication is passed, step S200 is executed, otherwise, an interface representing the authentication failure is popped up to prompt the user that the authentication fails and the communication function cannot be normally used.
S200, address book data which are stored by a server side of the communication assembly and matched with the user information are obtained;
in step S200, address book data stored in the server is obtained.
It will be appreciated that only address book data matching the login information will be obtained. The address book data may include information such as user name, unit, etc.
S300, determining a communication mode and a communication object in address book data;
in the embodiment of the application, the communication modes may include a video call and a video conference, and certainly, the communication modes may be realized without involving a visual communication mode.
In the embodiment of the application, the user can select a communication mode, such as a video conference.
It can be understood that, in the embodiments of the present application, the corresponding communication object display modes in each communication mode are different, and are specifically described in detail later.
In the embodiment of the application, the user can select the communication object to be communicated. For example, when the communication method is determined to be a video conference, the user 1 and the user 2 are selected as communication targets.
And S400, establishing communication data connection with a communication object through the server according to the communication mode.
In the embodiment of the application, after the communication mode and the communication object are determined, the communication data connection with the communication object can be directly established through the server. The communication data comprises video streams for realizing multi-play visual video conferences.
In the embodiment of the application, the front end of the web application is adopted to realize the communication functions of different communication modes, and the business system does not need to be changed in a large scale or a new communication page is not developed.
It can be understood that in the embodiment of the present application, an SIP protocol is used to implement audio and video communication between the front ends.
It can be understood that, in the embodiment of the present application, each display interface in the communication component may be developed by using vue.
It can be understood that, in the embodiment of the present application, when the web application loading the communication component logs out or the business system is closed, the communication component also logs out or is closed. Of course, the first display interface of the communication component is not displayed any more, or is displayed as an identifier of an offline state.
It can be seen from the above embodiments that, in the technical solution of the present application, it is not necessary to separately develop a communication page for each service system, and it is only necessary to load a communication component when logging in a web application, and after successfully logging in the web application, communication with other users is quickly implemented, and all service systems can be adapted.
In the foregoing embodiments, a first display interface is described that hovers a communication component on a page of a web application.
In the embodiment of the application, when the communication component is loaded, the first display interface of the communication component is suspended on the display page of the web application for display.
Referring to fig. 2, fig. 2 is a schematic layout diagram of a first display interface of a communication component according to an embodiment of the present application.
In the embodiment of the present application, the communication component 200 may be suspended on the display page of the web application, and does not affect the viewing and operation of the user on the current display page.
For example, in an underground early warning system, if a current page displays certain alarm information and related parameters, a user wants to communicate with other communication objects and communicate the content of the alarm information, in the related art, the user needs to jump to a related page of communication, then logs in to a corresponding communication server, and then performs operations such as conversation, and at this time, the current page of the user is already switched to a conversation page, and the user cannot see the related content needing to communicate with other communication objects. In the embodiment of the present application, the first display interface of the communication component may be represented by a floating icon, such as the first display interface 200 in fig. 2, which is a floating icon of a telephone. Therefore, the viewing of the display content of the current page, such as the alarm information, is not affected, while the communication function is realized.
In the embodiment of the present application, it is preferable to generate the first display interface of the floating communication component by using vue. The method can be loaded by any web page, is directly displayed on the web page in a floating mode, and can perform dragging movement. When a user performs a specific operation on the display screen, for example, double-click, long-time click, or the like, the first display interface is switched to the second display interface. Of course, the specific operation is only required to trigger the execution interface switching, and the embodiment of the present application is not particularly limited.
It is understood that the process of switching the first display interface to the second display interface is performed when the authentication is passed and address book data matching the user information is obtained.
In the embodiment of the present application, obtaining address book data, which is stored by a server of a communication component and matches with user information, includes:
receiving an operation instruction of a user on a first display interface;
switching the first display interface into a second display interface according to the operation instruction; the second display interface is used for displaying the communication mode and address book data matched with the user information in the communication mode.
Referring to fig. 3 and 4, fig. 3 is a schematic layout diagram of a second display interface of a communication assembly according to an embodiment of the present application. Fig. 4 is a schematic diagram illustrating another arrangement of a second display interface of a communication component according to an embodiment of the present application.
In the embodiment of the application, different tabs are arranged in the second display interface corresponding to different communication modes, each tab corresponds to one communication mode, and displayed contents are different under each tab. Of course, more communication modes can be set, and only a plurality of tabs need to be set correspondingly, and the buttons in the tabs are laid out, which is not described in detail in the embodiments of the present application.
It is understood that address book data matching the user information may be displayed in the second display interface. Also, in each communication mode, a button arranged for the communication mode may be displayed for realizing communication with a communication object. For example, the set up video call action button 301 is characterized in fig. 3, or the set up video conference action button 401 is characterized in fig. 4.
Referring to fig. 5, fig. 5 is a flowchart illustrating a specific implementation of determining a communication method and a communication object in address book data in a communication method of a web application according to an embodiment of the present application.
In the embodiment of the application, the determination of the communication mode and the communication object in the address book data is realized through the following steps.
Determining the communication mode and the communication object in the address book data comprises:
s501, receiving a first selection operation of a user on a tab in a second display interface;
s502, according to the first selection operation, determining a communication mode corresponding to the selected tab of the first selection operation;
the user can determine the communication mode, e.g., video call or video conference, by selecting a tab. The first selected operation may be a single click operation, a double click operation, or the like. Or the specific operation performed by the user can be directly related to the content displayed by the second display interface when the first display interface is used. For example, when the first display interface is clicked and switched to the second display interface, the second display interface displays the video call tab, and when the first display interface is double-clicked and switched to the second display interface, the second display interface displays the video conference tab. This way, the time for determining the communication mode can be greatly shortened.
S503, receiving a second selected operation of the user on the address book data in the second display interface;
s504, according to the second selection operation, the communication object selected by the second selection operation is determined.
When the user selects the communication mode, the communication object needing to be communicated is determined. For example, user 1 in fig. 3, or user 1 and user 3 in fig. 4.
It should be noted that, in fig. 4, a plurality of communication objects may be determined by multiple selections. The unit corresponding to the user can be screened through a pull-down menu. For example, the user in unit 1 is screened directly.
The foregoing embodiments describe that the communication means may be a video call or a video conference. The implementation of these two communication modes at the front end is described in detail below.
Referring to fig. 6, fig. 6 is an interface schematic diagram of a video call according to an embodiment of the present application.
In this embodiment, if the communication mode is a video call, establishing a communication data connection with a communication object through the server includes:
displaying a third display interface;
acquiring a first audio/video stream of a local audio/video acquisition device, and displaying the first video stream in the first audio/video stream in a first display area of a third display interface;
transmitting the first audio and video stream to a server side, so that the server side sends the first audio and video stream to a communication object;
and receiving a second audio/video stream sent to the server by the communication object transmitted by the server, displaying a second video stream in the second audio/video stream in a second display area of a third interface, and simultaneously playing audio data in the second audio/video stream.
In this embodiment, the third interface 600 is an interface for executing a video call, and the third interface includes a first audio/video stream of the local audio/video acquisition device and a second audio/video stream of the communication object. The third display interface may be presented in the form of a communication window.
It can be understood that, when a communication data connection with a communication object needs to be established, in the embodiment of the present application, a local audio/video acquisition device may be directly invoked to acquire a local video stream. The local audio/video acquisition device can be equipment capable of acquiring audio/video such as a video camera, a microphone, a sound pick-up and the like.
When the communication data connection with the communication object is established, the server side can forward the audio and video stream sent by the opposite side. So that the web front end has communication functionality.
It is understood that in a specific implementation, the point-to-point communication module communication can be written and constructed by js, so that the front end of the web application can have a communication function of a video call.
The first display area 601 and the second display area 602 of the third display interface are used for displaying video streams. Preferably, the first display area 601 displays the second video stream of the communication object, and the second display area 602 displays the first video stream captured locally.
Referring to fig. 7, fig. 7 is a schematic interface diagram of a video conference shown in the embodiment of the present application.
If the communication mode is a video conference, establishing a communication data connection with a communication object through the server includes:
displaying a fourth display interface;
calling a third audio and video stream of the local audio and video acquisition device;
transmitting the third audio-video stream to the server, so that the server performs mixing on the third video stream in the third audio-video stream and a fourth video stream transmitted by the communication object to obtain a mixed video stream;
and receiving the mixed video stream transmitted by the server, and displaying the mixed video stream on a fourth display interface.
In the embodiment of the application, when the video conference is executed, the server side not only executes the forwarding of the audio and video stream, but also needs to mix the video stream, so that multiple video streams are mixed into a single video stream to be displayed. The fourth display interface 700 may be presented in the form of a communication window.
It can be understood that, in a specific implementation, the conference communication module meeting can be written and constructed by js, so that the web application front end can implement a communication function with a video conference.
In the embodiment of the application, the played mixed video stream is the mixed video stream through mixing instead of a plurality of single video streams, so that the data volume of transmission and the network flow consumption are reduced, the network resources are saved, the video stream seen by a user is smooth, no pause feeling is generated, and the user experience is improved.
In the embodiment of the present application, before establishing a communication data connection with the communication object, a call waiting interface is further provided.
See fig. 8.
Fig. 8 is a schematic interface diagram of call waiting shown in the embodiment of the present application.
After the communication mode and the communication object in the address book data are determined, before the communication data connection with the communication object is established through the server side according to the communication mode, the method further comprises the following steps:
receiving a call establishment operation instruction for operating a call establishment operation button in a second display interface by a user;
displaying a call waiting interface 800 according to the call establishing operation instruction; the on-hold interface includes a hang-up button for hanging up the communication session and on-hold information characterizing the on-hold call.
In the embodiment of the present application, after the call establishment operation button is clicked, for example, the video call establishment operation button 301 in fig. 3 or the video conference establishment operation button 401 in fig. 4 is switched to the call waiting interface shown in fig. 8. The call waiting interface includes a hang-up button 801 that can perform a shutdown. When the user clicks on this button, the call can be ended.
Referring to fig. 9, fig. 9 is an interface schematic diagram of an incoming call waiting interface according to an embodiment of the present application.
In the embodiment of the application, if the subsequent operation is not executed under the first display interface, the first display interface is always kept. At this time, if another user in the address book makes a call, the user switches to the incoming call waiting interface 900 shown in fig. 9, which includes information related to the caller and a button 901 for accepting the response or a button 902 for rejecting the response, to perform an answering operation or a hang-up operation.
It can be seen that in the embodiment of the application, the communication function can be realized by adopting the front end without installing a client, the video call or the video conference can be realized only by depending on the login information of the web application on the premise of not changing the function of the service system, the functions of the address book, the video communication, the conference and the like are realized by adopting the minimum transmission parameters, and the integration, the transplantation and the maintenance are easy.
Corresponding to the embodiment of the application function implementation method, the application also provides a communication device and electronic equipment of the web application and corresponding embodiments.
Referring to fig. 10, fig. 10 is a schematic structural diagram of a communication device of a web application according to an embodiment of the present application.
A communication component applied to a front end of a web application, the communication component loaded upon logging into the web application, the communication device comprising:
the login module 1 is used for acquiring login information of the web application by taking successful login of the web application as a trigger; the login information at least comprises user information;
the address book data acquisition module 2 is used for acquiring address book data which is stored by the server of the communication component and is matched with the user information;
the determining module 3 is used for determining a communication mode and a communication object in the address book data;
and the communication module 4 is used for establishing communication data connection with the communication object through the server according to the communication mode.
It is to be understood that, with regard to the apparatus in the above-described embodiment, the specific manner in which the respective modules perform operations has been described in detail in the embodiment related to the method, and will not be elaborated upon here.
The communication device provided by the application can have the following beneficial effects:
in the communication device, a communication page does not need to be developed independently for each service system, the communication component only needs to be loaded when the web application is logged in, communication with other users is quickly realized after the web application is successfully logged in, and all service systems can be adapted.
The communication device can also be used for rapidly and conveniently communicating with other users on the premise of not switching the display content of the current web page, so that the operation steps are reduced, and the communication efficiency is improved.
The communication device can realize video call or video conference only by depending on the login information of the web application on the premise of not changing the function of a service system, realizes the functions of an address book, video communication, conference and the like by adopting the minimum transmission parameters, and is easy to integrate, transplant and maintain.
Fig. 11 is a schematic structural diagram of an electronic device shown in an embodiment of the present application.
Referring to fig. 11, the electronic device 1000 includes a memory 1010 and a processor 1020.
The Processor 1020 may be a Central Processing Unit (CPU), other general purpose Processor, a Digital Signal Processor (DSP), an Application Specific Integrated Circuit (ASIC), a Field Programmable Gate Array (FPGA) or other Programmable logic device, discrete Gate or transistor logic, discrete hardware components, etc. A general purpose processor may be a microprocessor or the processor may be any conventional processor or the like.
The memory 1010 may include various types of storage units, such as system memory, Read Only Memory (ROM), and permanent storage. Wherein the ROM may store static data or instructions that are needed by the processor 1020 or other modules of the computer. The persistent storage device may be a read-write storage device. The persistent storage may be a non-volatile storage device that does not lose stored instructions and data even after the computer is powered off. In some embodiments, the persistent storage device employs a mass storage device (e.g., magnetic or optical disk, flash memory) as the persistent storage device. In other embodiments, the permanent storage may be a removable storage device (e.g., floppy disk, optical drive). The system memory may be a read-write memory device or a volatile read-write memory device, such as a dynamic random access memory. The system memory may store instructions and data that some or all of the processors require at runtime. Further, the memory 1010 may include any combination of computer-readable storage media, including various types of semiconductor memory chips (DRAM, SRAM, SDRAM, flash memory, programmable read-only memory), magnetic and/or optical disks, among others. In some embodiments, memory 1010 may include a removable storage device that is readable and/or writable, such as a Compact Disc (CD), a read-only digital versatile disc (e.g., DVD-ROM, dual layer DVD-ROM), a read-only Blu-ray disc, an ultra-density optical disc, a flash memory card (e.g., SD card, min SD card, Micro-SD card, etc.), a magnetic floppy disc, or the like. Computer-readable storage media do not contain carrier waves or transitory electronic signals transmitted by wireless or wired means.
The memory 1010 has stored thereon executable code that, when processed by the processor 1020, may cause the processor 1020 to perform some or all of the methods described above.
The aspects of the present application have been described in detail hereinabove with reference to the accompanying drawings. In the above embodiments, the descriptions of the respective embodiments have respective emphasis, and for parts that are not described in detail in a certain embodiment, reference may be made to related descriptions of other embodiments. Those skilled in the art should also appreciate that the acts and modules referred to in the specification are not necessarily required in the present application. In addition, it can be understood that the steps in the method of the embodiment of the present application may be sequentially adjusted, combined, and deleted according to actual needs, and the modules in the device of the embodiment of the present application may be combined, divided, and deleted according to actual needs.
Furthermore, the method according to the present application may also be implemented as a computer program or computer program product comprising computer program code instructions for performing some or all of the steps of the above-described method of the present application.
Alternatively, the present application may also be embodied as a non-transitory machine-readable storage medium (or computer-readable storage medium, or machine-readable storage medium) having stored thereon executable code (or a computer program, or computer instruction code) which, when executed by a processor of an electronic device (or electronic device, server, etc.), causes the processor to perform part or all of the various steps of the above-described method according to the present application.
Those of skill would further appreciate that the various illustrative logical blocks, modules, circuits, and algorithm steps described in connection with the applications disclosed herein may be implemented as electronic hardware, computer software, or combinations of both.
The flowchart and block diagrams in the figures illustrate the architecture, functionality, and operation of possible implementations of systems and methods according to various embodiments of the present application. In this regard, each block in the flowchart or block diagrams may represent a module, segment, or portion of code, which comprises one or more executable instructions for implementing the specified logical function(s). It should also be noted that, in some alternative implementations, the functions noted in the block may occur out of the order noted in the figures. For example, two blocks shown in succession may, in fact, be executed substantially concurrently, or the blocks may sometimes be executed in the reverse order, depending upon the functionality involved. It will also be noted that each block of the block diagrams and/or flowchart illustration, and combinations of blocks in the block diagrams and/or flowchart illustration, can be implemented by special purpose hardware-based systems which perform the specified functions or acts, or combinations of special purpose hardware and computer instructions.
Having described embodiments of the present application, the foregoing description is intended to be exemplary, not exhaustive, and not limited to the disclosed embodiments. Many modifications and variations will be apparent to those of ordinary skill in the art without departing from the scope and spirit of the described embodiments. The terminology used herein is chosen in order to best explain the principles of the embodiments, the practical application, or improvements made to the technology in the marketplace, or to enable others of ordinary skill in the art to understand the embodiments disclosed herein.

Claims (9)

1. A communication method of a web application, wherein the communication component is applied to a front end of the web application, the communication component is loaded when logging in the web application, the communication component is implemented by a VUE framework, and the communication method comprises the following steps:
acquiring login information of the web application by taking successful login of the web application as a trigger; the login information at least comprises user information; the login information is user information of a service system;
obtaining address book data which is stored by a server of the communication assembly and matched with the user information;
determining a communication mode and a communication object in the address book data;
establishing communication data connection with the communication object through the server according to the communication mode;
when the business system loaded with the communication component logs out, the communication component logs out;
when the communication component is loaded, the first display interface of the communication component is suspended on the display page of the web application for display.
2. The communication method according to claim 1, wherein the obtaining address book data matching the user information and stored by the server of the communication component comprises:
receiving an operation instruction of a user on the first display interface;
switching the first display interface into a second display interface according to the operation instruction; the second display interface is used for displaying a communication mode and address book data matched with the user information in the communication mode.
3. The communication method according to claim 2, wherein the determining the communication method and the communication object in the address book data comprises:
receiving a first selected operation of a user on a tab in the second display interface;
according to the first selected operation, determining a communication mode corresponding to the selected tab of the first selected operation;
receiving a second selected operation of the user on the address book data in the second display interface;
and according to the second selected operation, determining the communication object selected by the second selected operation.
4. The method according to claim 3, wherein if the communication mode is a video call, the establishing of the communication data connection with the communication object through the server comprises:
displaying a third display interface;
acquiring a first audio/video stream of a local audio/video acquisition device, and displaying the first video stream in the first audio/video stream in a first display area of a third display interface;
transmitting the first audio and video stream to the server side, so that the server side sends the first audio and video stream to the communication object;
and receiving a second audio/video stream transmitted by the server and sent to the server by the communication object, displaying a second video stream in the second audio/video stream in a second display area of the third display interface, and simultaneously playing audio data in the second audio/video stream.
5. The method according to claim 3, wherein if the communication mode is a video conference, the establishing of the communication data connection with the communication object through the server side comprises:
displaying a fourth display interface;
calling a third audio and video stream of the local audio and video acquisition device;
transmitting the third audio and video stream to the server, so that the server performs mixing on the third video stream in the third audio and video stream and a fourth video stream transmitted by the communication object to obtain a mixed video stream;
and receiving the mixed video stream transmitted by the server, and displaying the mixed video stream on the fourth display interface.
6. The method according to claim 3, wherein after the communication method and the communication object in the address book data are determined, before the communication data connection with the communication object is established through the server according to the communication method, the method further comprises:
receiving a call establishment operation instruction for operating a call establishment operation button in a second display interface by a user;
displaying a call waiting interface according to the call establishing operation instruction; the call waiting interface includes a hang-up button for hanging up the communication session and call waiting information characterizing the call.
7. A communication apparatus for a web application, wherein the communication component is applied to a front end of the web application, and the communication component is loaded when logging in the web application, and the communication component is implemented by using a VUE framework, and the communication apparatus comprises:
the login module is used for acquiring login information of the web application by taking successful login of the web application as a trigger; the login information at least comprises user information; the login information is user information of a service system;
the address book data acquisition module is used for acquiring address book data which is stored by the server side of the communication assembly and matched with the user information;
the determining module is used for determining a communication mode and a communication object in the address book data;
the communication module is used for establishing communication data connection with the communication object through the server according to the communication mode;
when the business system loaded with the communication component logs out, the communication component logs out;
when the communication component is loaded, the first display interface of the communication component is suspended on the display page of the web application for display.
8. An electronic device, comprising:
a processor; and
a memory having executable code stored thereon, which when executed by the processor, causes the processor to perform the method of any one of claims 1-6.
9. A non-transitory machine-readable storage medium having stored thereon executable code, which when executed by a processor of an electronic device, causes the processor to perform the method of any one of claims 1-6.
CN202010563715.3A 2020-06-19 2020-06-19 Communication method and device of web application, electronic equipment and storage medium Active CN111726282B (en)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN202010563715.3A CN111726282B (en) 2020-06-19 2020-06-19 Communication method and device of web application, electronic equipment and storage medium

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN202010563715.3A CN111726282B (en) 2020-06-19 2020-06-19 Communication method and device of web application, electronic equipment and storage medium

Publications (2)

Publication Number Publication Date
CN111726282A CN111726282A (en) 2020-09-29
CN111726282B true CN111726282B (en) 2021-06-04

Family

ID=72567657

Family Applications (1)

Application Number Title Priority Date Filing Date
CN202010563715.3A Active CN111726282B (en) 2020-06-19 2020-06-19 Communication method and device of web application, electronic equipment and storage medium

Country Status (1)

Country Link
CN (1) CN111726282B (en)

Citations (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN102158429A (en) * 2011-04-25 2011-08-17 苏州阔地网络科技有限公司 Community platform based group communication method and system
EP2899946A1 (en) * 2010-10-12 2015-07-29 Skype Integrating communications
CN107426233A (en) * 2017-08-08 2017-12-01 深圳先进技术研究院 Data communication system, method, Web server and monitoring system based on B/S frameworks
CN110445773A (en) * 2019-07-24 2019-11-12 江苏智赢信息科技有限公司 Fire-fighting command regulator control system based on Internet of Things
CN110443010A (en) * 2019-07-22 2019-11-12 安徽智恒信科技股份有限公司 One kind permission visual configuration control method, device, terminal and storage medium in information system

Family Cites Families (2)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN101436148B (en) * 2007-11-14 2011-11-02 华为技术有限公司 Integrated client end and method for performing interaction of desktop application and network WEB application
US10848498B2 (en) * 2018-08-13 2020-11-24 Capital One Services, Llc Systems and methods for dynamic granular access permissions

Patent Citations (5)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
EP2899946A1 (en) * 2010-10-12 2015-07-29 Skype Integrating communications
CN102158429A (en) * 2011-04-25 2011-08-17 苏州阔地网络科技有限公司 Community platform based group communication method and system
CN107426233A (en) * 2017-08-08 2017-12-01 深圳先进技术研究院 Data communication system, method, Web server and monitoring system based on B/S frameworks
CN110443010A (en) * 2019-07-22 2019-11-12 安徽智恒信科技股份有限公司 One kind permission visual configuration control method, device, terminal and storage medium in information system
CN110445773A (en) * 2019-07-24 2019-11-12 江苏智赢信息科技有限公司 Fire-fighting command regulator control system based on Internet of Things

Also Published As

Publication number Publication date
CN111726282A (en) 2020-09-29

Similar Documents

Publication Publication Date Title
US11349890B2 (en) Systems and methods for multimedia multipoint real-time conferencing allowing real-time bandwidth management and prioritized media distribution
US6151619A (en) Method and apparatus for maintaining configuration information of a teleconference and identification of endpoint during teleconference
US8751572B1 (en) Multi-user chat search and access to chat archive
EP1689155B1 (en) Method and system to process video effects
US20060199570A1 (en) Providing caller-selected information to a receiving device
US20090092234A1 (en) Answering video chat requests
KR20170051445A (en) Real-time sharing during a phone call
KR20060099394A (en) System and methods for providing a system level user interface in a multimedia console
WO2007103626A2 (en) Recording and reproducing trading communications
US20070136449A1 (en) Update notification for peer views in a composite services delivery environment
US10402056B2 (en) Selecting and managing devices to use for video conferencing
US8516143B2 (en) Transmitting data within remote application
KR20110082512A (en) Pre-determined responses for wireless devices
JP2007159142A (en) Method, call center and computer program for visually navigating voice view of call center service
GB2484200A (en) Establishing a global conference using plural conference bridges
Singh et al. Developing WebRTC-based team apps with a cross-platform mobile framework
CN111726282B (en) Communication method and device of web application, electronic equipment and storage medium
CN107038201A (en) Display methods, device, terminal and the server of personal homepage
US11637877B1 (en) Interactive videoconferencing system
CN112968826B (en) Voice interaction method and device and electronic equipment
US8832587B2 (en) Video window with integrated content
CA3224322A1 (en) Video playing method and apparatus, and storage medium
WO2022007618A1 (en) Video call method and display device
CN113973103A (en) Audio processing method and device, electronic equipment and storage medium
JP2021056840A (en) Program, communication method, communication terminal and communication system

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination
GR01 Patent grant
GR01 Patent grant