JsBridge 开源项目教程

最新推荐文章于 2024-09-03 07:14:52 发布

黎纯俪Forest

最新推荐文章于 2024-09-03 07:14:52 发布

阅读量371

点赞数 3

本文链接：https://blog.csdn.net/gitblog_00404/article/details/141150260

版权

JsBridge 开源项目教程

JsBridgeandroid java and javascript bridge, inspired by wechat webview jsbridge项目地址:https://gitcode.com/gh_mirrors/js/JsBridge

1. 项目的目录结构及介绍

JsBridge 项目的目录结构如下：

JsBridge/
├── android/
│   ├── app/
│   │   ├── build.gradle
│   │   └── src/
│   │       └── main/
│   │           ├── java/
│   │           │   └── com/
│   │           │       └── github/
│   │           │           └── lzyzsd/
│   │           │               └── jsbridge/
│   │           │                   ├── BridgeWebView.java
│   │           │                   ├── CallBackFunction.java
│   │           │                   ├── DefaultHandler.java
│   │           │                   ├── Handler.java
│   │           │                   ├── JsCallJava.java
│   │           │                   ├── WebViewJavascriptBridge.java
│   │           │                   └── ...
│   │           └── res/
│   │               └── ...
│   └── build.gradle
├── example/
│   ├── index.html
│   └── ...
├── gradle/
│   └── ...
├── js/
│   └── bridge.js
├── LICENSE
├── README.md
└── settings.gradle

目录结构介绍

android/：包含 Android 项目的所有源代码和资源文件。
- app/：Android 应用的主要模块。
  - build.gradle：应用模块的构建脚本。
  - src/：源代码目录。
    - main/：主源代码目录。
      - java/：Java 源代码目录。
        com/github/lzyzsd/jsbridge/：JsBridge 核心代码目录。
      - res/：资源文件目录。
example/：包含示例 HTML 文件和其他示例资源。
gradle/：Gradle 构建工具的配置文件。
js/：包含 JavaScript 文件，如 bridge.js。
LICENSE：项目许可证文件。
README.md：项目说明文档。
settings.gradle：Gradle 项目设置文件。

2. 项目的启动文件介绍

Android 启动文件

在 Android 项目中，启动文件通常是 MainActivity.java，但在 JsBridge 项目中，启动文件是 BridgeWebView.java。

// BridgeWebView.java
package com.github.lzyzsd.jsbridge;

import android.content.Context;
import android.util.AttributeSet;
import android.webkit.WebView;

public class BridgeWebView extends WebView {
    // 构造函数
    public BridgeWebView(Context context, AttributeSet attrs) {
        super(context, attrs);
        init();
    }

    private void init() {
        // 初始化代码
    }

    // 其他方法
}

JavaScript 启动文件

在 example/index.html 中，引入了 js/bridge.js 文件，这是 JavaScript 端的启动文件。

<!DOCTYPE html>
<html>
<head>
    <title>JsBridge Example</title>
    <script src="../js/bridge.js"></script>
</head>
<body>
    <h1>JsBridge Example</h1>
    <script>
        // JavaScript 代码
    </script>
</body>
</html>

3. 项目的配置文件介绍

Android 配置文件

Android 项目的配置文件主要在 build.gradle 文件中。

// android/app/build.gradle
apply plugin: 'com.android.application'

android {
    compileSdkVersion 30
    defaultConfig {
        applicationId "com.github.lzyzsd.jsbridge"
        minSdkVersion 16
        targetSdkVersion 30
        versionCode 1
        versionName "1.0"
    }
    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
        }
    }
}

dependencies {
    implementation fileTree(dir: 'libs', include: ['*.jar'])
    implementation 'androidx.appcompat:appcompat:1.2.0

JsBridgeandroid java and javascript bridge, inspired by wechat webview jsbridge项目地址:https://gitcode.com/gh_mirrors/js/JsBridge