 | |  |  | 浏览器H5方法小结
- /**
- * 安卓H5与原生交互整合脚本(ES5+Rhino兼容)
- * 用途:H5调用原生API + APP调用H5逻辑
- * 使用:直接在Rhino引擎执行,或拆分H5/APP代码分别部署
- 🍎交流QQ群711841924群一,苹果内测群,528816639
- */
- // ==================================================
- // 一、核心API方法(H5调用原生专用)
- // ==================================================
- // 1. H5执行APP端JS文件
- function runJsFile(file) {
- window.at.runJsFile(file);
- }
- // 2. H5调用APP端指定方法(多参数用JSON字符串)
- function callAppFunction(funname, arg) {
- window.at.callFunction(funname, arg); // 兼容window.at.callFun
- }
- // 3. 获取项目根目录
- function getAppRootPath() {
- var rootPath = window.at.getRootPath();
- printl("项目根目录:" + rootPath);
- return rootPath;
- }
- // 4. 获取项目资源目录
- function getAppResourcesPath() {
- var resPath = window.at.getResourcesPath();
- printl("资源目录:" + resPath);
- return resPath;
- }
- // 5. 存储数据到APP本地文件
- function setAppConfig(path, arg, value) {
- window.at.setConfig(path, arg, value);
- printl("数据存储成功:" + path + "|" + arg);
- }
- // 6. 从APP本地文件读取数据
- function getAppConfig(path, arg, defaultValue) {
- var data = window.at.getConfig(path, arg, defaultValue);
- printl("读取数据:" + data);
- return data;
- }
- // 7. H5向APP传公共变量
- function setAppPublicData(key, value) {
- window.at.publicSet(key, value);
- printl("公共变量设置:" + key + "=" + value);
- }
- // 8. H5从APP读公共变量
- function getAppPublicData(key) {
- var value = window.at.publicGet(key);
- printl("公共变量读取:" + key + "=" + value);
- return value;
- }
- // ==================================================
- // 二、H5示例代码(复制此变量内的字符串,保存为.html文件)
- // ==================================================
- var H5_DEMO_HTML = `
- <!DOCTYPE html>
- <html lang="en">
- <head>
- <meta charset="UTF-8">
- <title>H5-原生交互演示</title>
- <meta name="viewport" content="width=device-width, initial-scale=1.0">
- <style>
- body {background:#222;color:#fff;padding:20px;font-family:Arial;}
- .form-group {margin-bottom:20px;}
- input,select,button {background:#333;color:#fff;border:none;border-radius:5px;padding:10px;margin-right:10px;}
- button {background:#4CAF50;width:60%;font-size:20px;margin-top:20px;cursor:pointer;}
- </style>
- <script language="JavaScript">
- // 调用APP的main方法
- function callAppMain() {
- var inputVal = document.getElementById("input1").value;
- callAppFunction("main", inputVal);
- }
- // 执行APP代码块
- function runAppJs() {
- window.at.runJs(function() {
- printl("H5触发APP执行");
- auto.home();
- }.toString());
- }
- // 执行APP JS文件
- function runAppJsFile() {
- runJsFile("主脚本.js");
- }
- // 测试配置读写
- function testConfig() {
- var resPath = getAppResourcesPath();
- var path = resPath + "test.txt";
- setAppConfig(path, "user", "testUser");
- var user = getAppConfig(path, "user", "default");
- alert("读取用户名:" + user);
- }
- // 测试公共变量
- function testPublicData() {
- setAppPublicData("h5Val", document.getElementById("input1").value);
- var appVal = getAppPublicData("appInfo");
- alert("APP回传:" + appVal);
- }
- </script>
- </head>
- <body>
- <h1>H5-原生交互演示</h1>
- <div class="form-group">
- <label>输入框:</label>
- <input type="text" id="input1" value="测试数据">
- </div>
- <button onclick="callAppMain()">调用APP main</button>
- <button onclick="runAppJs()">执行APP代码</button>
- <button onclick="runAppJsFile()">执行APP JS文件</button>
- <button onclick="testConfig()">测试配置读写</button>
- <button onclick="testPublicData()">测试公共变量</button>
- </body>
- </html>
- `;
- printl("H5代码已生成,提取H5_DEMO_HTML变量内容保存为.html文件");
- // ==================================================
- // 三、APP端调用H5代码(Rhino引擎直接执行)
- // ==================================================
- // 1. 初始化WebView
- function initWebView() {
- var ac = new activity();
- var layout = [
- '<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"',
- ' android:layout_width="match_parent"',
- ' android:layout_height="match_parent"',
- ' android:orientation="vertical">',
- ' <WebView android:id="@+id/web"',
- ' android:layout_width="match_parent"',
- ' android:layout_height="match_parent" />',
- '</LinearLayout>'
- ].join('\n');
- ac.loadXML(layout);
- sleep.millisecond(400);
- var web = ac.findWebViewById("web");
- printl("WebView初始化完成");
- return web;
- }
- // 2. 加载H5页面
- function loadH5(webView, h5Path) {
- webView.url(h5Path);
- printl("加载H5:" + h5Path);
- sleep.millisecond(1000); // 等待加载
- }
- // 3. 向H5注入JS
- function runH5Js(webView, jsCode) {
- var result = webView.runWebJs(jsCode);
- printl("H5 JS执行结果:" + result);
- return result;
- }
- // 4. APP端方法(供H5调用)
- function main(arg) {
- printl("APP收到H5参数:" + arg);
- // 解析多参数(若H5传JSON)
- if (arg.indexOf("{") !== -1) {
- var obj = JSON.parse(arg);
- printl("解析参数:" + obj.name + "," + obj.age);
- }
- // 向H5回传数据
- publicData.set("appInfo", "已收到:" + arg);
- }
- // 5. APP调用H5完整流程
- function appH5Flow() {
- var web = initWebView();
- // 加载H5(需替换为实际保存的.html路径)
- loadH5(web, "/代码/h5Demo.html");
- // 向H5注入JS修改输入框
- runH5Js(web, 'document.getElementById("input1").value = "APP注入值"');
- // 触发H5按钮点击
- runH5Js(web, 'document.querySelector("button[onclick=\'callAppMain()\']").click()');
- }
- // 执行APP-H5交互流程(取消注释即可运行)
- // appH5Flow();
- // ==================================================
- // 四、使用说明
- // ==================================================
- /*
- 1. H5部署:
- - 复制H5_DEMO_HTML变量内的字符串,保存为"h5Demo.html"
- - 将文件放入APP可访问路径(如"/代码/")
- 2. APP执行:
- - 在Rhino引擎中运行此JS文件
- - 取消"appH5Flow();"注释,启动完整交互
- 3. 注意:
- - 确保APP有SD卡读写权限(配置读写需)
- - "主脚本.js"需存在于APP根目录(若执行runAppJsFile)
- - 日志通过printl输出,在Rhino控制台查看
- */
复制代码
| |  | |  |
|