当前位置: 首页 > news >正文

Uniapp连接iBeacon设备——实现无线定位与互动体验(实现篇)

export default {
        data() {
            return {
                iBeaconDevices: [], // 存储搜索到的iBeacon设备
                deviceId: [],
                data: [],
                url: getApp().globalData.url,
                innerAudioContext: null,
                num: 0, //秒
                int: null, //定时器
                duration: '111', //总时长
                isSliderDisabled: false,
                status: false,
                audio_status: false,
                type: 2
            }
        },
        // 下拉刷新
        onPullDownRefresh() {
            try {
                this.explain()
                uni.stopPullDownRefresh(); //停止刷新
            } catch (e) {}

        },
        onLoad() {
            this.explain()
        },
        methods: {
            play() {
                if (!this.status) {
                    this.int = setInterval(() => {
                        this.num++
                    }, 1000)
                    this.status = true
                    this.change({
                        detail: {
                            value: this.num
                        }
                    })
                } else {
                    this.status = false
                    clearInterval(this.int)
                    this.innerAudioContext.pause()
                }
            },
            change(e) {
                if (this.status) {
                    this.isSliderDisabled = true;
                    this.num = e.detail.value;
                    this.innerAudioContext.seek(e.detail.value)
                    setTimeout(() => {
                        this.innerAudioContext.play()
                        this.isSliderDisabled = false;
                    }, 500)
                }
            },
            box(deviceid) {
                console.log(deviceid, 99909);
                let that = this
                uni.openBluetoothAdapter({ //蓝牙初始化
                    success(res) {
                        uni.getLocation({
                            success(res) {
                                uni.startBeaconDiscovery({ //搜索蓝牙设备
                                    uuids: deviceid,
                                    success(res) {
                                        console.log(res, 888);
                                        uni.onBeaconUpdate((res) => { //监听蓝牙搜索到的设备
                                            console.log(res, 999);
                                            uni.hideLoading()
                                            that.type = 1
                                        })
                                    },
                                    fail(res) {
                                        console.log('暂未搜索到蓝牙设备', res);
                                        uni.showToast({
                                            title: '暂未搜索到蓝牙设备,请下拉刷新',
                                            icon: 'none'
                                        })
                                    }
                                })
                            },
                            fail(res) {
                                uni.showToast({
                                    title: '请打开位置信息,并下拉刷新',
                                    icon: 'none'
                                })
                            }
                        })
                    },
                    fail(res) {
                        console.log('蓝牙未打开', res);
                        uni.showToast({
                            title: '请打开蓝牙,并下拉刷新',
                            icon: 'none'
                        })
                    }
                })
            },
            async explain() {
                uni.showLoading({
                    title: '加载中...'
                })
                const res = await explain({
                    scenic_id: 3
                })
                this.data = res.data
                if (!this.audio_status) {
                    this.innerAudioContext = uni.createInnerAudioContext()
                    this.innerAudioContext.src = this.url + this.data[0].audio;
                    this.innerAudioContext.onCanplay(() => {
                        // 获取音频总时长,单位为秒
                        this.duration = this.innerAudioContext.duration
                        console.log('音频总时长:', this.innerAudioContext.duration, 9)
                    })
                }
                this.audio_status = true
                this.box([(res.data[0].deviceid)])
            }
        },

相关文章:

  • Django学习日志08
  • 【CHI】Ordering保序
  • Ubuntu20.0中安装Gradle
  • Matplotlib实现Label及Title都在下方的最佳姿势
  • NX二次开发UF_CAM_ask_post_template_name 函数介绍
  • 命令执行无回显的判断方法及dnslog相关例题的讲解
  • 【金融分析】Python:病人预约安排政策 | 金融模拟分析
  • 3.8-镜像的发布
  • Java 12 及Tomcat 部署配置
  • BUUCTF [BJDCTF2020]一叶障目 1
  • vscode设置前进、后退快捷键
  • CISP模拟试题(一)
  • 鸿蒙APP外包开发上线流程
  • GaussDB新特性Ustore存储引擎介绍
  • BUUCTF 菜刀666 1
  • 【React系列】如何构建React应用程序
  • Facebook AccountKit 接入的坑点
  • Java多线程(4):使用线程池执行定时任务
  • js ES6 求数组的交集,并集,还有差集
  • UEditor初始化失败(实例已存在,但视图未渲染出来,单页化)
  • vue+element后台管理系统,从后端获取路由表,并正常渲染
  • 分享一份非常强势的Android面试题
  • 警报:线上事故之CountDownLatch的威力
  • 开年巨制!千人千面回放技术让你“看到”Flutter用户侧问题
  • 悄悄地说一个bug
  • 三分钟教你同步 Visual Studio Code 设置
  • 跳前端坑前,先看看这个!!
  • 新手搭建网站的主要流程
  • 一个JAVA程序员成长之路分享
  • #13 yum、编译安装与sed命令的使用
  • $.extend({},旧的,新的);合并对象,后面的覆盖前面的
  • (0)Nginx 功能特性
  • (done) NLP “bag-of-words“ 方法 (带有二元分类和多元分类两个例子)词袋模型、BoW
  • (PHP)设置修改 Apache 文件根目录 (Document Root)(转帖)
  • (vue)页面文件上传获取:action地址
  • (二)【Jmeter】专栏实战项目靶场drupal部署
  • (中等) HDU 4370 0 or 1,建模+Dijkstra。
  • (转)Oracle 9i 数据库设计指引全集(1)
  • (转)大道至简,职场上做人做事做管理
  • (转)利用PHP的debug_backtrace函数,实现PHP文件权限管理、动态加载 【反射】...
  • (转载)PyTorch代码规范最佳实践和样式指南
  • .net core IResultFilter 的 OnResultExecuted和OnResultExecuting的区别
  • .net core使用ef 6
  • .NET MVC 验证码
  • .Net 中Partitioner static与dynamic的性能对比
  • .NetCore Flurl.Http 升级到4.0后 https 无法建立SSL连接
  • .netcore 如何获取系统中所有session_如何把百度推广中获取的线索(基木鱼,电话,百度商桥等)同步到企业微信或者企业CRM等企业营销系统中...
  • .set 数据导入matlab,设置变量导入选项 - MATLAB setvaropts - MathWorks 中国
  • :如何用SQL脚本保存存储过程返回的结果集
  • @modelattribute注解用postman测试怎么传参_接口测试之问题挖掘
  • @RequestParam详解
  • [ Linux ] Linux信号概述 信号的产生
  • [ MSF使用实例 ] 利用永恒之蓝(MS17-010)漏洞导致windows靶机蓝屏并获取靶机权限
  • [ 蓝桥杯Web真题 ]-布局切换
  • [AR]Vumark(下一代条形码)