LamboJsBridge 示例

介绍

LamboJsBridge 是一个js 适配sdk 用于处理H5应用和运行时环境的能力调用。支持微信、钉钉等环境。目前已适配微信（WechatAdapter）和企业微信（WeComAdapter）

Vue 全局引入

/**
 * Vue main.js 中加入如下代码
 */
console.log("------ 初始化 LamboJsBridge -------")
import LamboJsBridge from "@lambo-design-mobile/lambo-js-bridge";
Vue.use(LamboJsBridge);

调用

// 直接调用扫码功能
// Vue方法中
this.$lamboJsBridge.scanCode()

//其他Js界面
Vue.prototype.$lamboJsBridge.scanCode();
/**
 * 也可以自己封装一层工具类 
 * 扫描二维码并返回结果。(需要在APP环境下测试)
 * 此函数通过调用 Flutter scanCode.startScan 方法来启动二维码扫描。
 * 扫描成功后返回扫描结果，若扫描失败则返回错误信息。
 *
 * @returns {Promise<String>} - 返回一个 Promise，当扫描成功时 resolve，返回扫描的结果字符串；如果失败，reject 返回错误信息。
 * @example
 * flutterUtil.scanCode()
 *   .then(result => {
 *     console.log('扫描结果:', result.msg);
 *   })
 *   .catch(error => {
 *     console.error('扫描失败:', error.msg);
 *   });
 */
flutterUtil.scanCode = function() {
    return Vue.prototype.$lamboJsBridge.scanCode();
};

引入

import Vue from 'vue';
import LamboJsBridge from '@lambo-design-mobile/lambo-js-bridge';

代码演示

初始化

  async created() {
    const options = {
      // 初始化参数，根据需要填写
      wechatId:this.wechatId,
      weComId:this.weComId,
      dingTalkId:this.dingTalkId,
    };
    this.$lamboJsBridge = new LamboJsBridge(options);
    await this.getPlatform();
  },
  
   methods: {
    async getPlatform() {
      try {
        const info = await this.$lamboJsBridge.getPlatform(); // 获取初始化信息
        this.initInfo = JSON.stringify(info, null, 2); // 美化输出
        console.log('Init Info:', info);
      } catch (error) {
        console.error('Error getting init info:', error);
      }
    },
    }

参数说明

params: Object

| 属性 | 类型 | 默认值 | 必填 | 支持平台 | 说明 | |------------|--------|--------|------|----------|------------| | wechatId | string | | 是 | 微信 | 微信公众号appId | | weComId | string | | 是 | 企业微信 | 企业微信corpId | | dingTalkId | string | | 是 | 钉钉 | 钉钉id |

返回说明

params: Object

| 属性 | 类型 | 默认值 | 必填 | 支持平台 | 说明 | |----------|--------|--------|------|----------|---------| | appId | string | | 是 | 微信、企业微信、钉钉 | 对应平台的id | | platform | string | | 是 | 微信、企业微信、钉钉 | 当前浏览器平台 |

获取地理位置接口（getLocation）

获取用户当前的地理位置信息。

    async getLocation() {
      try {
        const options ={
          // 初始化参数，根据需要填写
        };
        const location = await this.$lamboJsBridge.getLocation(options);
        console.log("location",location)
        this.location += `${JSON.stringify(location)}\n`; // 追加新数据
        this.latitude = location.latitude; // 存储纬度
        this.longitude = location.longitude; // 存储经度
        console.log('Location:', location);
      } catch (error) {
        console.error('Error getting location:', error);
      }
    },

参数说明

params: Object

| 属性 | 类型 | 默认值 | 必填 | 支持平台 | 说明 | |------------------|----------|--------|------|-------|-----------------------------------------------------------------------------------------------| | type | string | gcj02 | 否 | 微信、企业微信、钉钉 | 默认为gcj02的gps坐标，如果要使用标准坐标则传入wgs84 | | targetAccuracy | string | | 否 | 钉钉 | 期望定位精度半径(单位米)，定位结果尽量满足该参数要求，但是不一定能保证小于该误差，开发者需要读取返回结果的 accuracy 字段校验坐标精度。建议按照业务需求设置定位精度，推荐采用200m，可获得较好的精度和较短的响应时长。 | | cacheTimeout | number | 30 | 否 | 钉钉 | 缓存过期时间，单位为秒。未过期的缓存数据会直接返回（速度快），缓存过期会重新定位（速度慢）。 | | useCache | boolean | true | 否 | 钉钉 | 是否缓存地理位置信息。若为true，客户端会对定位的地理位置信息缓存，在缓存期内 (2分钟) 再次定位会返回旧的定位。 | | withReGeocode | boolean | true | 否 | 钉钉 | 是否需要带有逆地理编码信息。该功能需要网络请求，请根据自己的业务场景使用。 | | formattedAdress | number | 1 | 否 | 钉钉 | 获取经纬度和详细到区县级别的逆地理编码数据 |

返回说明

Promise<Object>

| 属性 | 类型 | 默认值 | 必填 | 支持平台 | 说明 | |------------|--------|--------|------|----------|------------------------| | latitude | number | | 是 | 微信、企业微信、钉钉 | 纬度，浮点数，范围为 90 ~ -90 | | longitude | number | | 是 | 微信、企业微信、钉钉 | 经度，浮点数，范围为 180 ~ -180 | | accuracy | number | | 是 | 微信、企业微信、钉钉 | 位置精度 | | address | string | | 否 | 钉钉 | 格式化地址，type>0生效。 | | province | string | | 否 | 钉钉 | 省份，type>0生效。 | | city | string | | 否 | 钉钉 | 城市，type>0生效。 |

调起扫一扫接口（scanCode）

调用扫一扫功能。

    async scanCode() {
      try {
        const options ={
          // 初始化参数，根据需要填写
        };
        const result = await this.$lamboJsBridge.scanCode(options);
        this.scanResult += `${JSON.stringify(result)}\n`; // 追加新数据
        console.log('Scan result:', result);
      } catch (error) {
        console.error('Error scanning code:', error);
      }
    },

参数说明

params: Object

| 属性 | 类型 | 默认值 | 必填 | 支持平台 | 说明 | |-----------|----------|--------|------|----------|----------------------------------------------------------------------------------------------| | scanType | string[] | qr | 否 | 微信、企业微信、钉钉 | 扫码样式。qr：二维码扫码框，bar：条形码扫码框 | | needResult| boolean | true | 否 | 微信、企业微信 | 扫描结果是否由微信或企业微信处理。为 false 时直接返回扫描结果 |

返回说明

Promise<Object>

| 属性 | 类型 | 默认值 | 必填 | 支持平台 | 说明 | |------------|--------|--------|------|----------|-------------| | resultStr | string | | 否 | 微信、企业微信、钉钉 | 扫码结果 |

拍照或从手机相册中选图接口（takePhoto）

拍照或从本地相册选择图片。

    async takePhoto() {
      try {
        const options = {
          //初始化参数，根据需要填写、修改
          outputType: ['oss','info','data'], // 根据需要包含 'info', 'data', 'oss'
          ossServerContext: this.ossServerContext,
          ossImgPutUrl: this.ossImgPutUrl,
          ossImgGetUrl: this.ossImgGetUrl
        };
        const photo = await this.$lamboJsBridge.takePhoto(options);
        this.photoResult += `${JSON.stringify(photo)}\n`; // 追加新数据
        console.log('Photo result:', photo);
      } catch (error) {
        console.error('Error taking photo:', error);
      }
    },

参数说明

params: Object

| 属性 | 类型 | 默认值 | 必填 | 支持平台 | 说明 | |-------------------|---------|-------------------------|-----|----------|------------------------------------------------------------------| | count | number | 1 | 否 | 微信、企业微信、钉钉 | 选择图片数量 | | sizeType | string[] | ['camera', 'album'] | 否 | 微信、企业微信、钉钉 | 相册选取或者拍照。album：相册，camera：相机 | | outputType | string[] | ['info', 'data', 'oss'] | 否 | 微信、企业微信、钉钉 | 图像输出格式。info 选定图像的本地信息，data 选定图像的base64数据，oss为上传oss-server | | method | string | 'file'或'blob' | 否 | 微信、企业微信、钉钉 | 上传oss方法，默认为blob | | defaultCameraMode | string | | 否 | 企业微信 | 进入拍照界面的默认模式。normal 单拍，batch 连拍，front 前置摄像头单拍，batch_front 前置摄像头连拍 | | isSaveToAlbum | boolean | true | 否 | 企业微信 | 拍照时是否保存到系统相册 | | position | string | back | 否 | 钉钉 | 相机拍照使用的摄像头：front：前置摄像头，back：后置摄像头 | | ossServerContext | string | | 是 | 微信、企业微信、钉钉 | 上传oss-server服务器地址 | | ossImgPutUrl | string | | 是 | 微信、企业微信、钉钉 | 上传oss-server图片接口地址 | | ossImgGetUrl | string | | 是 | 微信、企业微信、钉钉 | 下载oss-server图片接口地址 |

返回说明

Promise<Array>

| 属性 | 类型 | 默认值 | 必填 | 支持平台 | 说明 | |-----------|-----------|--------|------|----------|---------------| | imageInfo | string[] | | 否 | 微信、企业微信、钉钉 | 选定图像的本地信息 | | imageData | string[] | | 否 | 微信、企业微信、钉钉 | 选定图像的base64数据 | | imageOss | string[] | | 否 | 微信、企业微信、钉钉 | 选定图像的oss返回数据 |

使用内置地图查看位置（openLocation）

使用内置地图查看位置。

async openLocation() {
      try {
        if (this.latitude !== null && this.longitude !== null) {
          const options = {
          //初始化参数，根据需要修改
            latitude: this.latitude,
            longitude: this.longitude,
            name: this.name,
            address: this.address,
            scale: this.scale
          };
          await this.$lamboJsBridge.openLocation(options);
          this.openLocationResult = '位置已成功打开'; // 成功打开位置时存储信息
          console.log('Location opened successfully');
        } else {
          this.openLocationResult = '没有可用的位置信息，请先获取定位。'; // 没有位置信息时存储错误信息
          console.error('No location data available. Please get the location first.');
        }
      } catch (error) {
        this.openLocationResult = `打开位置时出错: ${error.message}`; // 存储错误信息
        console.error('Error opening location:', error);
      }
    }

参数说明

params: Object

| 属性 | 类型 | 默认值 | 必填 | 支持平台 | 说明 | |-----------|--|-----|-----|----------|------------------------------------------------------------------| | latitude | number | | 是 | 微信、企业微信、钉钉 | 纬度，范围为-90~90，负数表示南纬。使用 gcj02 国测局坐标系 | | longitude | number | | 是 | 微信、企业微信、钉钉 | 经度，范围为-180~180，负数表示西经。使用 gcj02 国测局坐标系 | | name | string | | 钉钉 | 微信、企业微信、钉钉 | 位置名称 | | address | string | | 钉钉 | 微信、企业微信、钉钉 | 详细位置 | | scale | number | | 否 | 微信、企业微信 | 缩放比例，范围5~18 |

返回说明

无