js-ds-sdk v1.0.4

一 web端使用方法

1、引入sdk

<script src="https://res.ds.cn/open/app/js/jds-sdk.js"></script>

或者

npm i js-ds-sdk

import jDsSdk from 'js-ds-sdk';

2、使用

对sdk进行配置

例子

jDsSdk.config({
	debug: true
});

jDsSdk.config({
  debug: true,
  setting: {
    showNavBar: true,
    title: "大圣科技",
    fitsStatusBar: false,
    autoReolad: true,
    shareWeb: {
      url: 'https://www.baidu.com',
      title: "baidu",
      thumb: "https://www.baidu.com/img/pc_cc75653cd975aea6d4ba1f59b3697455.png",
      desc: "分享测试",
      channels: ['WEIXIN'],
      extra: {
        id: 1,
        xx: "123456"
      },
    },
  }
});

网页setting参数，可以根据自己需求定义（以下为参考）

方法调用

回调函数返回说明

例子

jDsSdk.invoke('plugin.method', {
  age: 10086,
  name: 'gukeming'
}, function(result) {
  console.log("页面调用结果", JSON.stringify(result));
});

获取app版本号

jDsSdk.getAppVersion();

说明：通过在原生userAgent中的增加DSApp/1.0.0来传递app版本号，如果版本号不存在就不是在app内嵌的webview中

获取app刘海高度

jDsSdk.getStatusBarHeight();

说明：通过在原生userAgent中的增加StatusBarHeight/xx来传递

获取app胡子高度

jDsSdk.getBottomBarHeight();

说明：通过在原生userAgent中的增加BottomBarHeight/xx来传递

获取App注入参数

app注入参数包括

jDsSdk.getAppParam('token');

说明：必须在页面加载完成后才能获取

获取单个url参数

jDsSdk.getQueryParam('name');

获取全部url全部参数

jDsSdk.getQueryParams()

请求拦截

jDsSdk.setReqInterceptor(function(req) {
  console.log('请求拦截', JSON.stringify(req));
  return req;
});

返回拦截

jDsSdk.setResInterceptor(function(res, req) {
  console.log('返回拦截拦截', JSON.stringify(res), JSON.stringify(req));
  alert('拦截结果'  + JSON.stringify(res));
  return res;
});

说明： 如果返回拦截无返回值，那么将不会再继续回调到业务层

webview页面加载完成

jDsSdk.onReady(function(){
  alert('jDsServiceReady');
})

webview页面返回后切换到前台

jDsSdk.onResume(function(){
  alert('onResume');
})

原生返回键

jDsSdk.addOnBack(function(){
  alert('onBack');
})

android webview扩展

1、原生支持打电话

<a href="tel:18819272037">打电话</a>

2、邮件支持

<a href="mailto:gukeming@ds.cn">发送邮件</a>

3、文件和图片选择

<p>
  <img class="img" width="100" height="100" id="previewimg">
</p>
<input class="select" type="file" accept="image/*" id="picfile" name="选择图片">

//图片选择
<script>
  document.querySelector('.select').addEventListener('change', function(e){
    var URL = window.URL || window.webkitURL;
    document.getElementById('previewimg').src = URL.createObjectURL(this.files[0]);
  });
</script>

说明：图片选择支持从拍照和相机选择，必须设置为image/*，如果不设置。将默认选择文件

原生调用js方法并返回

在web中定义method方法

jDsSdk.addNativeCallback("plugin.method", function(params)  {
  alert("原生调用js 参数" + params);
  return "js返回数据" + params;
});

JSCallbackContext.callJSMethod(String method, String params, final JsValueCallback jsValueCallback)

使用例子：

callbackContext.callJSMethod("plugin.method");

callbackContext.callJSMethod("plugin.method", new JSCallbackContext.JsValueCallback() {
@Override
public void onValue(String value) {

}
});

callbackContext.callJSMethod("plugin.method", "123", new JSCallbackContext.JsValueCallback() {
@Override
public void onValue(String value) {

}
});

3、android业务插件开发

日志打印

JSService.setLogLevel(JSLog.DEBUG);

业务插件开发

public class DeviceInfoPlugin extends JSPlugin {
    private static final String TAG = "DeviceInfoPlugin";

    public static final String TEST_METHOD = "testMethod";
    
    @Override
    protected void onInitialize() {
        super.onInitialize();
    }

    @Override
    public boolean execute(String method, JSParams args, JSCallbackContext callbackContext) throws JSONException {
        Log.d("JSPlugin", "method==" + method);
        Log.d("JSPlugin", "args==" + args.jsonParamForkey("name"));

        if(TEST_METHOD.equals(method)) {
            JSONObject json = new JSONObject();
            json.put("method",method);
            json.put("name",args.jsonParamForkey("name"));

            //返回js调用处
            callbackContext.success(json);

            return true;
        }

        return false;
    }

    @Override
    public void onDestroy() {
        super.onDestroy();
    }
}

JSCallbackContext 使用说明

插件注册

JSService.registerPlugin(String pluginName, Class<? extends JSPlugin> clazz);

例子

JSService.registerPlugin("device", DeviceInfoPlugin.class);

4、 iOS业务插件开发