Tencent Cloud Super App as a Service
- Release Notes and Announcements
- Purchasing Guide
- Plan Management
- Branded Configurations
- Introduction to Platform Functions
- Commercialization
- Virtual Payment
- Guidelines for Code Integration
- Android
- Android SDK Description
- Android API
- Mini Program Management APIs
- Custom Mini Program Capabilities
- Custom SDK Capabilities
- iOS
- iOS SDK Description
- iOS API
- Mini Program Management APIs
- Customize Mini Program Capabilities
- Customised SDK Capabilities
- Flutter
- Flutter SDK Description
- Flutter API
- Mini Program Management API
- Mini Program Capabilities Customization
- Plugin Customization
- App Server
- Payment Development Notes
- Mini Program Payment: Parameter Application and Configuration
- Mini Game Payment: Parameter Application and Configuration
- Mini Program Payment: Signature and Verification
- Guildlines for Mini Program Development
- Mini Program Code Composition
- Guidance
- Learn About Mini Programs
- Configuring Mini Program
- Mini Program Framework
- Basic Competencies
- Open Capabilities
- Framework
- Mini Program Configuration
- Framework Interface
- WXML Syntax Reference
- WXS Syntax Reference
- Components
- API
- Interface
- Media
- Device
- JS SDK
- IDE Operation Instructions
- Guildlines for Mini Game Development
- Guide
- Game Engine
- Basic Capability
- Open Capabilities
- API
- Interface
- Rendering
- Device
- Practice Tutorial
- API Documentation
- Making API Requests
- User Management APIs
- Team Management APIs
- Sensitive API-Related APIs
- Role Management APIs
- Platform Management APIs
- Other Console APIs
- Mini Program APIs
- Management-Sensitive APIs
- Global Domain Management APIs
- Application APIs
DocumentationTencent Cloud Super App as a ServiceGuildlines for Mini Program DevelopmentAPIH5 Real-Time Communication
H5 Real-Time Communication
Last updated: 2025-03-20 18:01:56
In order to help customers quickly migrate existing H5 pages, the mini program supports embedding H5 pages within mini programs using the web-view component. Additionally, we support H5 pages to call mini-program APIs using JSSDK and support real-time communication between H5 pages and mini-programs. This is not only a technical innovation, but also a key factor in optimizing the user experience.
Data sharing: By establishing an effective communication mechanism, the user's actions and status in the mini program can be transmitted to the H5 page in real time and vice versa. This instant sharing of data ensures user consistency across pages, making it easier for users to complete tasks.
Capability expansion: The integration of mini-program with H5 pages extends the overall capabilities. For example, a mini-program can call specific functions within an H5 page or process data from an H5 page.
Improve development efficiency: Developers can leverage existing H5 page resources without redeveloping the same features. The communication mechanism enables better integration between mini programs and H5 pages, reducing migration, development, and maintenance costs.
Adapt to diverse needs:Different users may have varying habits and requirements. The communication mechanism allows developers to flexibly adjust interactions between mini programs and H5 pages based on user feedback and needs.
In summary, enabling communication between mini programs and embedded H5 pages via the
web-viewcomponent not only enhances the user experience but also provides developers with greater flexibility and convenience.
sendWebviewEvent
Feature description:The mini program sends message events to the H5 page embedded within the
web-viewcomponent.Example:For more information about the real-time communication, seeCommunication section in JSSDK - API description.
The mini program sends message events to H5 page
wx.sendWebviewEvent({message: "I'm Miniprogram, I received"})
function onEvent(e) {console.log(e.message) // I'm Miniprogram, I received}// Register a listenerwx.miniProgram.onWebviewEvent(onEvent)// Remove the listenerwx.miniProgram.offWebviewEvent(onEvent)
Was this page helpful?
You can also Contact Sales or Submit a Ticket for help.
Yes
No