cordova-plugin-ths-webviewpage v1.3.1

cordova-plugin-ths-webviewpage

自定义webView，运行在独立进程中。

依赖aar包源码地址：http://x.x.x.x:xxxx/svn/Products/环保移动平台/工程/代码/移动门户/ThsWebView

支持平台

Android

安装插件

# 通过npm 安装插件
cordova plugin add cordova-plugin-ths-webviewpage
# 通过github安装
cordova plugin add https://github.com/THS-FE/cordova-plugin-ths-webviewpage
# 通过本地文件路径安装
cordova plugin add 文件路径

说明： ionic 项目命令前加上ionic，即ionic cordova plugin xxxxx

使用方法

启动网页页面(startWebViewPage 方法已废弃，新项目请使用showWebViewPage 方法)

cordova.plugin.thswebviewpage.startWebViewPage(url,title,(success) => {
      console.log(success);
    }, (error) => {
      console.log(error);
});

启动网页页面（新增isLandscapeScreen 参数，控制是否横屏,默认false，如果打开网页需要强制横屏传递true）

cordova.plugin.thswebviewpage.showWebViewPage(url,title,isLandscapeScreen,(success) => {
      console.log(success);
    }, (error) => {
      console.log(error);
});

启动网页页面（新增关闭页面时弹窗参数设置，closePageAlertTitle 关闭弹窗标题，closePageAlertMsg 关闭弹窗内容，isShowPageAlert 是否显示关闭弹窗，默认false）  

cordova.plugin.thswebviewpage.showWebViewPageV2(url, title, isLandscapeScreen,closePageAlertTitle, closePageAlertMsg,isShowPageAlert,(success) => { console.log(success); }, (error) => { console.log(error); });

启动网页页面（相比V2版本，新增设置屏幕方向landscapeScreenFlag,比如要横屏参数设置成0,SCREEN_ORIENTATION_UNSET (-2): 未设置屏幕方向，系统将使用默认方向。
SCREEN_ORIENTATION_UNSPECIFIED (-1): 未指定屏幕方向，系统将根据当前的配置选择方向。
SCREEN_ORIENTATION_LANDSCAPE (0): 横屏模式。
SCREEN_ORIENTATION_PORTRAIT (1): 竖屏模式。
SCREEN_ORIENTATION_USER (2): 用户当前选择的方向。
SCREEN_ORIENTATION_BEHIND (3): 与当前Activity之后的Activity的方向相同。
SCREEN_ORIENTATION_SENSOR (4): 根据传感器自动选择横屏或竖屏。
SCREEN_ORIENTATION_NOSENSOR (5): 忽略传感器，使用设备默认方向。
SCREEN_ORIENTATION_SENSOR_LANDSCAPE (6): 根据传感器自动选择横屏。
SCREEN_ORIENTATION_SENSOR_PORTRAIT (7): 根据传感器自动选择竖屏。
SCREEN_ORIENTATION_REVERSE_LANDSCAPE (8): 反向横屏。
SCREEN_ORIENTATION_REVERSE_PORTRAIT (9): 反向竖屏。
SCREEN_ORIENTATION_FULL_SENSOR (10): 全传感器模式，根据四个方向的传感器自动选择。
SCREEN_ORIENTATION_USER_LANDSCAPE (11): 用户选择的横屏模式。
SCREEN_ORIENTATION_USER_PORTRAIT (12): 用户选择的竖屏模式。
SCREEN_ORIENTATION_FULL_USER (13): 用户选择的全方向模式。
SCREEN_ORIENTATION_LOCKED (14): 锁定当前方向，不随传感器变化。）  

cordova.plugin.thswebviewpage.showWebViewPageV3(url, title, isLandscapeScreen,closePageAlertTitle, closePageAlertMsg,isShowPageAlert,landscapeScreenFlag,(success) => { console.log(success); }, (error) => { console.log(error); });

发送信息给加载的H5页面

cordova.plugin.thswebviewpage.sendMessageToH5Page(data, (success) => {
console.log(success);
}, (error) => { console.log(error); });

监听事件-收到页面中JS的事件-更新数据并关闭页面事件
```java
document.addEventListener('thswebviewpage.updateDataAndClose', data => {
      console.log(data);
      alert(JSON.stringify(data));
}, false);

监听事件-收到页面中JS的事件-更新数据事件

document.addEventListener('thswebviewpage.updateData', data => {
      console.log(data);
      alert(JSON.stringify(data));
}, false);

收到页面中JS的事件-关闭页面事件

document.addEventListener('thswebviewpage.closePage', data => {
      console.log(data);
      alert(JSON.stringify(data));
}, false);

收到来自H5页面的消息事件，比如嵌入的页面要定位

document.addEventListener('thswebviewpage.toMainAppMsg', data => {
      console.log(data);
      alert(JSON.stringify(data));
}, false);

嵌入的 Html 页面中，接收主应用消息的回调方法 receiveMainAppMsg,与cordova.plugin.thswebviewpage.sendMessageToH5Page 配合使用，可以实现H5页面与主应用的通信。

 function receiveMainAppMsg(message) {
           console.log('receiveMainAppMsg', message);
           alert('receiveMainAppMsg:'+ message);
  }

嵌入的 Html 页面中，发送消息给主应用的方法 thsJsBridge.toMainAppMsg,与cordova.plugin.thswebviewpage.sendMessageToH5Page 配合使用，可以实现H5页面与主应用的通信。

 function sendMessageToNative(message) {
     thsJsBridge.toMainAppMsg(message);
  }

说明：使用ts 进行开发时，需要在文件上变声明下declare const cordova，不然会报错;

import { Component, OnInit, Input } from '@angular/core';
import { WebIntent } from '@ionic-native/web-intent/ngx';
declare let cordova;
@Component({
  selector: 'app-explore-container',
  templateUrl: './explore-container.component.html',
  styleUrls: ['./explore-container.component.scss'],
})

常见错误

闪退提示找不到webview并且能看到以下内容

java.lang.RuntimeException Using WebView from more than one process at once with the same data directory is not supported

1. 在包名根目录下，新建java文件

public class MyApplication extends Application {

    @Override
    public void onCreate() {
        super.onCreate();
        // 修復WebView的多進程加載的bug
        initWebView();
    }

    private void initWebView() {
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.P) {
            String processName = getProcessName();
            WebView.setDataDirectorySuffix(processName);
        }
    }
}

2. 将 MyApplication 注册到清单文件中

<application
        android:name=".MyApplication" //添加这一行
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:usesCleartextTraffic="true"
        android:theme="@style/AppTheme">