Android与H5(Vue)混合开发与OneSignal响应推送事件

最新推荐文章于 2026-05-16 16:48:26 发布

原创最新推荐文章于 2026-05-16 16:48:26 发布 · 1.1k 阅读

0 ·

本内容遵循CC 4.0 BY-SA版权协议

标签

#android #vue #app

Vue 专栏收录该内容

7 篇文章

订阅专栏

本文介绍如何在Android混合开发环境中使用OneSignal实现推送消息的处理及与H5页面交互的过程。具体包括集成OneSignal SDK、监测并获取推送数据、通过WebView调用H5方法并传递参数等关键技术点。

Android混合开发与OneSignal推送消息跳转页面

OneSignal官网 https://onesignal.com/

Android点击OneSignal推送的消息后，打开app;

在Android内部监测到Additional Data数据，则将数据传给H5页面并执行H5中的事件，H5事件执行完成则返回状态，让android回调判断状态。

onesignal对于消息推送后，处理并接受消息事件方法：
https://documentation.onesignal.com/docs/links#deep-linking-with-additional-data

功能点：
1.app监测并获取OneSignal数据;；
2.android调用H5中的方法，并携带参数;
3.H5可返回数据至android，回调事件;

前提：
1.android中需要集成 OneSignal SDK;
在这里插入图片描述
H5代码 App.vue文件：

<template>
  <div id="app">
    <keep-alive>
      <router-view>
      </router-view>
    </keep-alive>
  </div>
</template>

<script>
  export default {
    name: "app",
    mounted() {
        window.getOneSignalMessage =this.getOneSignalMessage; //将事件暴露在window原型上，以供android调用
    },
    methods:{
        getOneSignalMessage(value){    //android调用的方法，带参数
            if(value != "null"){
                //操作事件。。。。
            }
            return true;    //只要接受到android传来的事件，则说明H5响应成功，并传递状态;
        },
    }
  }
</script>

Android代码
WebActivity.java文件：

@BindView(R.id.web_view_web)
BridgeWebView mWebViewWeb;
@Override
protected void onCreate(@Nullable Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_bridge_web);

    // Enable verbose OneSignal logging to debug issues if needed.
    OneSignal.setLogLevel(OneSignal.LOG_LEVEL.VERBOSE, OneSignal.LOG_LEVEL.NONE);

    // OneSignal Initialization
    OneSignal.initWithContext(this);
    OneSignal.setAppId(ONESIGNAL_APP_ID);

    ListenOneSignalMessage();//监听OneSignal推送的键值对（传给H5）
}
    private void ListenOneSignalMessage(){ //监听OneSignal推送的键值对（传给H5跳转页面）
        OneSignal.setNotificationOpenedHandler(new OneSignal.OSNotificationOpenedHandler() {
            @Override
            public void notificationOpened(OSNotificationOpenedResult result) {
                ListenOneSignal = result.getNotification().getAdditionalData();
                sendH5(); //传给H5跳转页面数据,并执行事件
            }
        });
    }

    private void sendH5(){ //传给H5跳转页面数据,并执行
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) { //sdk版本匹配则执行带返回参数的事件
            //mWebViewWeb是Android中的WebView控件                
             //evaluateJavascript是可以访问H5中的方法，可以携带参数，可回调事件。 
            mWebViewWeb.evaluateJavascript("getOneSignalMessage('"+ListenOneSignal+"')",       
                new ValueCallback<String>() {
                    @Override
                    public void onReceiveValue(String value) {
                        if (value.equals("true")){ //H5页面接受到数据并执行后，返回状态为true
                            ListenOneSignal = null;
                        }else{ //H5页面未接受到数据，或没找到方法,返回状态为false;则继续执行
                            new Handler().postDelayed(new Runnable() { //每一秒重新执行一次
                                @Override
                                public void run() {
                                    sendH5();   //点击推送的消息后，H5的代码不会立即执行，所以需要等待;H5加载完成后，方可执行事件
                                }
                            }, 1000);
                          }
                        }
                    });
        }else{ //sdk版本不匹配，则执行不带参数的事件
            mWebViewWeb.loadUrl("javascript:getOneSignalMessage('"+ListenOneSignal+"')");
        }
    }