H5 Real-Time Communication

In order to help customers quickly migrate H5 existing services to the Luffa Cloud mini program platformweb-view Components embed H5 to realize business release. In addition, we support H5 throughJSSDK The ability to call the mini program's API and the real-time communication function between H5 and the mini program are not only technological innovations, but also the key to optimizing user experience:

• Data sharing: By establishing an effective communication mechanism, the user's operations 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 the consistency of users between different pages, allowing users to complete tasks more easily.

• Function extension: By supporting communication, the functions of the mini program can be combined with the H5 page to expand the functions of the application. For example, the mini program can call a specific function in the H5 page, or pass the data in the H5 page to the mini program for processing.

• Improve development efficiency: Developers can use existing H5 page resources without repeatedly developing the same functions. Through the communication mechanism, the mini program and H5 page can be better integrated to reduce the cost of migration development and maintenance.

• Adapt to diverse needs: Different users may have different usage habits and needs. Supporting communication allows developers to flexibly adjust the interaction mode between the mini program and the H5 page according to user feedback and needs.

  In summary, supporting communication between the mini program and the H5 page embedded in the web-view component can provide users with a better experience, while also bringing more flexibility and convenience to developers.

sendWebviewEvent

• Functional description: The mini program sends a message event to the H5 page embedded in the web-view component.
• Sample code: For detailed instructions on real-time communication, please refer to the Communication interface section in the JSSDK description.

The mini program sends a message event to the H12

JAVASCRIPT

wx.sendWebviewEvent({
  message: "I'm Miniprogram, I received"
})

H5 JAVASCRIPT

function onEvent(e) {
  console.log(e.message) // I'm Miniprogram, I received
}
// Register a listener
wx.miniProgram.onWebviewEvent(onEvent)
// Remove the listener
wx.miniProgram.offWebviewEvent(onEvent)