@lambo-design-mobile/lambo-js-bridge v1.0.0-beta.31

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,
      pluginConfig:["localAuthPlugin","amapPlugin","tabBarPlugin","scanCodePlugin","filePreviewPlugin"],

    };
    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

返回说明

params: Object

高德地图初始化key（initKey）

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

    async initKey() {
      try {
        const options ={
          androidKey:"41c4c1f35d8d14f5bf1907c173924147",
          iosKey:"465abf5da8c8d62e3caa63952a0957a5"
        }; 
        const reslut = await this.$lamboJsBridge.initKey(options);
        this.initKeyMessage = `initKey result: ${result}`;
      } catch (error) {
        console.error('Error initKey:', error);
      }
    },

参数说明

params: Object

返回说明

获取地理位置接口（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

返回说明

Promise<Object>

调起扫一扫接口（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

返回说明

Promise<Object>

拍照或从手机相册中选图接口（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

返回说明

Promise<Array>

使用内置地图查看位置（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,
            type:"amap"
          };
          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

返回说明

无

录音（仅在Flutter环境下可用）

此接口提供音频录制功能，可以开始录音、停止录音以及自动录音。自动录音指检测不到声音后自动停止。

data() {
    return {
      audioUrl: null, // 用于存储录音文件的 URL
      recordingStatus: "not started", // 用于记录当前录音状态
    };
  },
method:{
// 开始手动录音
    async startRecording() {
      // 清空之前的录音数据
      this.audioUrl = null;
      this.recordingStatus = 'recording';
      try {
        // 传入 { auto: false } 表示手动录音
        const result = await this.$lamboJsBridge.startRecording({ auto: false });
        console.log("录音开始成功：", result);
      } catch (error) {
        console.error("录音开始失败：", error);
        this.recordingStatus = 'failed';
      }
    },

    // 开始自动录音
    async startAutoRecording() {
      // 清空之前的录音数据
      this.audioUrl = null;
      this.recordingStatus = 'recording';
      try {
        // 传入 { auto: true } 表示启用自动录音
        const result = await this.$lamboJsBridge.startRecording({ auto: true , silenceDelay: 1, silenceStopSeconds: 2, volumeThreshold: 60});
        console.log("自动录音开始成功：", result);
      } catch (error) {
        console.error("自动录音开始失败：", error);
        this.recordingStatus = 'failed';
      }
    },

    // 停止录音
    async stopRecording() {
      try {
        const result = await this.$lamboJsBridge.stopRecording();
        console.log("录音停止成功：", result);
        this.recordingStatus = 'stopped';
        // 更新录音文件信息
        this.audioUrl = result.fileUrl || result.msg;
        // 如果你非要用全局函数更新，也可以调用它
        this.updateAudioDisplay(result);
      } catch (error) {
        console.error("录音停止失败：", error);
        this.recordingStatus = 'failed';
      }
    },

    // 如果你希望借助类似全局函数的形式更新页面，可以这样定义：
    updateAudioDisplay(data) {
      // 更新组件中的数据，页面会自动响应
      this.recordingStatus = 'stopped';
      this.audioUrl = data.fileUrl;
      this.audioPath = data.filePath;
      this.audioData = data.fileData;
    },
},
mounted() {
  window.updateAudioDisplay = this.updateAudioDisplay;
},

参数说明

recordingOptions: Object

返回说明

Promise<Object>

录音状态 recording：录音进行中。 not started：录音未开始。 stopped：录音已停止。 failed：录音失败。

下载文件（downloadFile）

调用文件下载功能，通过指定文件 URL 下载文件，并自动触发下载行为。

async downloadFile() {
  try {
    const fileUrl = 'http://10.110.34.27/yc_scrm.apk'; // 需要下载的文件 URL
    const fileName = '下载文件'; // 文件保存名称
    await this.$lamboJsBridge.downloadFile({ fileUrl, fileName });
    console.log('Download initiated');
  } catch (error) {
    console.error('Download failed:', error);
  }
}

参数说明

params: Object

返回说明

Promise<Object>

生物认证

提供本地生物特征认证能力，支持指纹/面容识别验证，支持查询设备可用生物特征类型。

    async localAuth() {
      try {
        const options = {
          localizedReason: 'A1',
          biometricHint: 'A2',
          cancelButton: 'A3',
          signInTitle: 'A4'
        }
        const result = await this.$lamboJsBridge.localAuthPlugin(options)
        this.localAuthResult = JSON.stringify(result, null, 2)
        console.log('localAuthResult:', result);
        this.availableBiometrics = '' // 清空另一个结果
      } catch (error) {
        // 结构化错误处理
        const errorMessage = error.msg || error.message || '未知错误';
        const authId = error.authId || '未知设备';

        this.localAuthResult = `认证失败：${errorMessage}，authId：${authId}`;
        console.error('完整错误信息:', error);
      }
    },
    async getAvailableBiometrics() {
      try {
        const result = await this.$lamboJsBridge.getAvailableBiometrics()
        this.availableBiometrics = JSON.stringify(result, null, 2)
        this.localAuthResult = '' // 清空另一个结果
      } catch (error) {
        this.availableBiometrics = `获取失败: ${error.message}`
      }
    },

参数说明

localAuthPlugin params: Object

getAvailableBiometrics: 无需参数

返回说明

localAuthPlugin: Promise<Object>

getAvailableBiometrics: Promise<Object>