uniapp微信小程序中打开腾讯地图获取用户位置信息

实现的效果

 

第一步:首先登录微信公众平台 , 需要用到AppID

 

第二步: 注册登录腾讯位置服务

注册需要手机号和邮箱确认,然后创建应用

创建后点击添加key

添加后会生成key,后面会用到这个key

第三步: 登录微信公众平台,进入开发管理- -> 开发设置 添加 服务器域名

 

 第四步:在 manifest.json 文件 Web配置中,定位和地图勾选腾讯地图,将自己的腾讯地图的 Key 粘贴至此。

 代码中

 第五步:以上配置全部完成下面是开发代码

点击按钮

<view class="positioning-logo" @click="getLocation"><imagesrc="/static/image/positioning.png"class="positioning-img"/><text>定位</text>
</view>

 js代码

const getLocation = () => {uni.getSystemInfo({success(res) {let locationEnabled = res.locationEnabled; //判断手机定位服务是否开启let locationAuthorized = res.locationAuthorized; //判断定位服务是否允许微信授权if (locationEnabled == false || locationAuthorized == false) {//手机定位服务(GPS)未授权uni.showModal({title: "授权",content: "获取授权失败,是否前往授权?",success: function (result) {if (result.confirm) {uni.openAppAuthorizeSetting();}},fail: function () {uni.showToast({title: "请前往设置中授权位置信息",icon: "none",});},});} else {uni.chooseLocation({success: function (response) {console.log("位置名称:", response);},});}},});};

 

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/60400.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

走进人工智能| 智能物联网 AIoT的魅力交织

前言&#xff1a; AIIoT是指人工智能&#xff08;AI&#xff09;与物联网&#xff08;IoT&#xff09;的结合。智能物联网是一种技术体系&#xff0c;通过连接和集成物理设备、传感器和互联网&#xff0c;实现设备之间的智能交互和数据共享&#xff0c;为人们提供智能化、自动化…

科技前沿:一文带你读懂“星闪点亮万物互联”

目录 一、星闪简介 二、星闪技术的模式 三、星闪技术六大优势 四、应用场景 智能汽车 智能工业 智能穿戴 智能家居 智能终端 一、星闪简介 星闪NearLink是由中国信通院牵头发起的星闪联盟&#xff08;NearLink Alliance&#xff09;推出的一种新一代近距离无线连接技…

广州华锐互动:VR3D课程在线教育平台为职业院校提供沉浸式的虚拟现实学习体验

随着科技的飞速发展&#xff0c;虚拟现实(VR)和增强现实(AR)技术已经逐渐渗透到我们生活的各个领域。其中&#xff0c;VR3D课程在线教育平台作为一种新兴的教育方式&#xff0c;正在逐渐改变我们的学习方式和体验。本文将详细介绍VR3D课程在线教育平台的应用前景及特点。 VR3D课…

无涯教程-Perl - 面向对象

Perl中的面向对象概念很大程度上基于引用以及匿名数组和哈希。让我们开始学习面向对象Perl的基本概念。 定义类 在Perl中定义一个类非常简单。类以最简单的形式对应于Perl软件包。要在Perl中创建一个类&#xff0c;我们首先构建一个包。 Perl软件包在Perl程序中提供了一个单…

Kafka:安装和配置

producer&#xff1a;发布消息的对象&#xff0c;称为消息产生者 &#xff08;Kafka topic producer&#xff09; topic&#xff1a;Kafka将消息分门别类&#xff0c;每一个消息称为一个主题&#xff08;topic&#xff09; consumer&#xff1a;订阅消息并处理发布消息的对象…

Apache2.4源码安装与配置

环境准备 openssl-devel pcre-devel expat-devel libtool gcc libxml2-devel 这些包要提前安装&#xff0c;否则httpd编译安装时候会报错 下载源码、解压缩、软连接 1、wget下载[rootnode01 ~]# wget https://downloads.apache.org/httpd/httpd-2.4.57.tar.gz --2023-07-20 …

jenkins流水线

1.拉取代码 https://gitee.com/Wjc_project/yygh-parent.git2、项目编译 mvn clean package -Dmaven.test.skiptrue ls hospital-manage/target3、构建镜像 ls hospital-manage/target docker build -t hospital-manage:latest -f hospital-manage/Dockerfile ./hospital-ma…

本质矩阵E、基本矩阵F、单应矩阵H

1. E (归一化坐标对进行计算) t ^ R 为3*3的矩阵, 因为R,t共有6个自由度&#xff0c;又因为单目尺度等价性&#xff0c;所以实际上E矩阵共有5个自由度。因此至少需要5个点对来求解。 2. 基本矩阵F:根据两帧间匹配的像素点对儿计算 3*3且自由度为7的矩阵kF也为基础矩阵&#x…

如何给Google Chrome增加proxy

1. 先打开https://github.com/KaranGauswami/socks-to-http-proxy/releases 我的电脑是Liunx系统所以下载第一个 2. 下载完之后把这个文件变成可执行文件&#xff0c;可以是用这个命令 chmod x 文件名 3. 然后执行这个命令&#xff1a; ./sthp-linux -p 8080 -s 127.0.0.1:…

使用 Visual Studio Code 调试 CMake 脚本

之前被引入到 Visual Studio 中的 CMake 调试器&#xff0c;现已在 Visual Studio Code 中可用。 也就是说&#xff0c;现在你可以通过在 VS Code 中安装 CMake 工具扩展&#xff0c;来调试你的 CMakeLists.txt 脚本了。是不是很棒? 背景知识 Visual C 开发团队和 CMake 的维…

tui.calender日历在vue中的使用1.0

官网&#xff1a;https://ui.toast.com/tui-calendar github&#xff1a;https://github.com/nhn/tui.calendar/tree/main 月、周、日视图都有&#xff0c;拖拽也比较方便&#xff0c;但是自己用起来比较费劲&#xff0c;参考文档写得不全&#xff0c;做个记录日后方便参考&…

如何使用 AT+WEBSERVER 指令实现自定义的 Webserver html 网页配网

开启 AT 固件中的 Webserver 指令和 FS 指令支持 乐鑫官网发布的默认通用 AT 固件不支持 webserver 配网功能&#xff0c; 需要用户自己搭建 esp-at 环境&#xff0c;并在 sdkconfig 中开启 webserver AT 指令 和 FS 指令的支持&#xff0c; 如下图所示&#xff1a; 测试 AT 固…