Skip to content

Latest commit

 

History

History
168 lines (149 loc) · 6.9 KB

README.md

File metadata and controls

168 lines (149 loc) · 6.9 KB

language language language

SDBridgeKotlin is here.

If your h5 partner confused about how to deal with iOS and Android. This Demo maybe help.

最常见的问题. WebViewJavascriptBridge is not defined 的处理方案.

是js或者ts在使用的时候,WebViewJavascriptBridge对象还没有挂载到window上 ,让js或者ts自己挂载!!!

具体的js或者ts如何做可以看这个视频.

视频接入教程和常见问题都在这里(遇到问题一定要看哦😯 ).

YouTube video is here.

Usage

JitPack.io

I strongly recommend https://jitpack.io

repositories {
    ...
    maven { url 'https://jitpack.io' }
}
dependencies {
    implementation 'com.github.SDBridge:SDBridgeJava:1.0.4'
}
  1. Instantiate bridge with a WebView in Java:
  private void setupView() {
          WebView webview = findViewById(R.id.webView);
          setAllowUniversalAccessFromFileURLs(webview);
          Button buttonSync = findViewById(R.id.buttonSync);
          Button buttonAsync = findViewById(R.id.buttonAsync);
          buttonSync.setOnClickListener(this);
          buttonAsync.setOnClickListener(this);

          bridge = new WebViewJavascriptBridge(this,webview);
          bridge.consolePipe(string -> {
              System.out.println("333333333");
              System.out.println(string);
          });
          bridge.register("DeviceLoadJavascriptSuccess", (map, callback) -> {
              System.out.println("Next line is javascript data->>>");
              System.out.println(map);
              HashMap<String,String> result = new HashMap<>();
              result.put("result","Android");
              callback.call(result);
          });
          webview.setWebViewClient(new WebViewClient(){
              @Override
              public boolean shouldOverrideUrlLoading(WebView view, String url) {
                  Log.d(TAG,"shouldOverrideUrlLoading");
                  view.loadUrl(url);
                  return true;
              }
              @Override
              public void onPageStarted(WebView view, String url, Bitmap favicon) {
                  Log.d(TAG,"onPageStarted");
                  bridge.injectJavascript();
              }
              @Override
              public void onPageFinished(WebView view, String url) {
                  Log.d(TAG,"onPageFinished");
              }
          });
          // Loading html in local ,This way maybe meet cross domain. So You should not forget to set
          // /*...setAllowUniversalAccessFromFileURLs... */
          // If you loading remote web server,That can be ignored.
          webview.loadUrl("file:///android_asset/Demo.html");
      }
  1. In Java, and call a Javascript Sync/Async function:
 @Override
    public void onClick(View view) {
        if (view.getId() == R.id.button2) {
            HashMap<String, String> data = new HashMap<>();
            data.put("AndroidKey","AndroidValue");
            //Call Javascript Sync function 
            bridge.call("GetToken", data, map -> {
                System.out.println("Next line is javascript data->>>");
                System.out.println(map);
            });
        }else if(view.getId() == R.id.button3){
            HashMap<String, String> data = new HashMap<>();
            data.put("AndroidKey","AndroidValue");
            ///Call Javascript Async function 
            bridge.call("AsyncCall", data, map -> {
                System.out.println("Next line is javascript data->>>");
                System.out.println(map);
            });
        }
    }
  1. In javascript file or typescript and html file like :
<div id="SDBridge"> web content </div>
<script>
    // Give webview 1.5s to load other javascript files.
    setTimeout(()=>{
        console.log("Demo222222222222222222");
        const bridge = window.WebViewJavascriptBridge;
        // JS tries to call the native method to judge whether it has been loaded successfully and let itself know whether its user is in android app or IOS app
        bridge.callHandler('DeviceLoadJavascriptSuccess', {key: 'JSValue'}, function(response) {
            let result = response.result
            if (result === "iOS") {
            console.log("Javascript was loaded by IOS and successfully loaded.");
            document.getElementById("SDBridge").innerText = "Javascript was loaded by IOS and successfully loaded.";
            window.iOSLoadJSSuccess = true;
           } else if (result === "Android") {
            console.log("Javascript was loaded by Android and successfully loaded.");
            document.getElementById("SDBridge").innerText = "Javascript was loaded by Android and successfully loaded.";
            window.AndroidLoadJSSuccess = true;
           }
        });
        // JS register method is called by native
        bridge.registerHandler('GetToken', function(data, responseCallback) {
            console.log(data);
            document.getElementById("SDBridge").innerText = "JS get native data:" + JSON.stringify(data);
            let result = {token: "I am javascript's token"}
            //JS gets the data and returns it to the native
            responseCallback(result)
        });
        bridge.registerHandler('AsyncCall', function(data, responseCallback) {
            console.log(data);
            document.getElementById("SDBridge").innerText = "JS get native data:" + JSON.stringify(data);
            //Call await function must with  (async () => {})();
            (async () => {
            const callback = await generatorLogNumber(1);
            let result = {token: callback};
            responseCallback(result);
            })();
         });
        function generatorLogNumber(n){
            return new Promise(res => {
            setTimeout(() => {
             res("Javascript async/await callback Ok");
                 }, 1000);
            })
       }
},1500);

</script>

History version update ?

v1.0.3

1.Java can get console.log Multi parameter.

v1.0.4

1.Optimized coding.

License

SDBridgeSwift is released under the MIT license. See LICENSE for details.