鸿蒙开发者社区

公众号矩阵

移动端

视频课免费课排行榜短视频直播课软考学堂

全部课程软考信创认证华为认证厂商认证 IT技术 PMP项目管理免费题库

文章资源问答课堂专栏直播

51CTO

鸿蒙开发者社区

51CTO技术栈

51CTO官微

51CTO学堂

51CTO博客

CTO训练营

鸿蒙开发者社区订阅号

51CTO软考

51CTO学堂APP

51CTO学堂企业版APP

鸿蒙开发者社区视频号

51CTO软考题库

鸿蒙开发者社区

登录/注册
51CTO

中国优质的IT技术网站

51CTO博客

专业IT技术创作平台

51CTO学堂

IT职业在线教育平台

活动短视频专栏极客Show 鸿蒙技术特刊

Web中如何创建定位授权弹窗

Web中如何创建定位授权弹窗

HarmonyOS

2024-03-17 17:44:12

浏览

赞

收藏 0

回答 1

待解决

回答 1

按赞同

/

按时间

在Web组件中使用定位能力可参考指南管理位置权限及以下示例代码。

// xxx.ets 
import { webview } from '@kit.ArkWeb'; 
 
@Entry 
@Component 
struct WebComponent { 
  controller: webview.WebviewController = new webview.WebviewController(); 
 
  build() { 
    Column() { 
      Web({ src: $rawfile('getLocation.html'), controller: this.controller }) 
        .geolocationAccess(true) 
        .onGeolocationShow((event) => { // 地理位置权限申请通知 
          AlertDialog.show({ 
            title: '位置权限请求', 
            message: '是否允许获取位置信息', 
            primaryButton: { 
              value: 'cancel', 
              action: () => { 
                if (event) { 
                  event.geolocation.invoke(event.origin, false, false); // 不允许此站点地理位置权限请求 
                } 
              } 
            }, 
            secondaryButton: { 
              value: 'ok', 
              action: () => { 
                if (event) { 
                  event.geolocation.invoke(event.origin, true, false); // 允许此站点地理位置权限请求 
                } 
              } 
            }, 
            cancel: () => { 
              if (event) { 
                event.geolocation.invoke(event.origin, false, false); // 不允许此站点地理位置权限请求 
              } 
            } 
          }) 
        }) 
    } 
  } 
}

在“src/main/resources/rawfile”路径下创建文件getLocation.html：

<!DOCTYPE html> 
<html> 
<body> 
<p id="locationInfo">位置信息</p> 
<button onclick="getLocation()">获取位置</button> 
<script> 
var locationInfo=document.getElementById("locationInfo"); 
function getLocation(){ 
  if (navigator.geolocation) { 
    <!-- 前端页面访问设备地理位置 --> 
    navigator.geolocation.getCurrentPosition(showPosition); 
  } 
} 
function showPosition(position){ 
  locationInfo.innerHTML="Latitude: " + position.coords.latitude + "<br />Longitude: " + position.coords.longitude; 
} 
</script> 
</body> 
</html>

回复

2024-03-18 21:20:48

如何写精华回答，获更多曝光？

发布

相关问题

HarmonyOS 使用定位api无法弹出授权弹窗

1192浏览 • 1回复待解决

定位授权直接提示用户拒绝授权

1425浏览 • 1回复待解决

定位授权配置中ability和when的作用范围？

3272浏览 • 1回复待解决

HarmonyOS 申请位置权限代码，如何调起定位授权

2057浏览 • 1回复待解决

HarmonyOS Web如何区分弹窗类型

731浏览 • 1回复待解决

HarmonyOS web获取定位异常，获取不到定位信息

1195浏览 • 1回复待解决

HarmonyOS 如何判断ohos.permission.LOCATION精准定位用户是否已授权

1087浏览 • 1回复待解决

HarmonyOS 在位值相关权限授权成功后获取定位信息还是报错

2299浏览 • 1回复待解决

HarmonyOS CustomDialogController弹窗创建问题

1950浏览 • 1回复待解决

#鸿蒙通关秘籍#如何使用openCustomDialog在鸿蒙中创建自定义弹窗？

1649浏览 • 1回复待解决

HarmonyOS 怎么弹出用户授权的弹窗比如相机权限，麦克风权限的弹窗？

2758浏览 • 1回复待解决

HarmonyOS 如何创建自定义的全局弹窗

1306浏览 • 1回复待解决

AlertDialog.show创建的弹窗，如何主动消失

4072浏览 • 1回复待解决

#鸿蒙通关秘籍#如何在鸿蒙ArkUI中创建并显示自定义弹窗？

1286浏览 • 1回复待解决

#鸿蒙通关秘籍#如何在ArkUI中创建一个自定义弹窗？

1206浏览 • 1回复待解决

#鸿蒙通关秘籍# 在HarmonyOS中如何通过子窗口方式创建和展示弹窗？

929浏览 • 0回复待解决

Web加载失败问题定位定界指导

1141浏览 • 1回复待解决

如何在一个非@Entry的类中创建一个CustomDialogController弹窗

1686浏览 • 1回复待解决

#鸿蒙通关秘籍#如何使用bindPopup创建气泡弹窗效果？

1313浏览 • 1回复待解决

HarmonyOS 创建全局弹窗的推荐方案

984浏览 • 1回复待解决

如何在自定义弹窗中再次弹窗

3595浏览 • 1回复待解决

如何在HarmonyOS应用中实现用户认证与授权？

612浏览 • 0回复待解决

#鸿蒙通关秘籍#如何创建和销毁弹窗控制器？

1247浏览 • 1回复待解决

如何申请组合授权权限？

1535浏览 • 1回复待解决

HarmonyOS 关于Web的动态创建

1126浏览 • 1回复待解决

提问

该提问已有0人参与，帮助了0人

相关讨论帖

鸿蒙Web组件调试：3招定位问题? 0回复

#打卡不停更# Web项目实战之如何创建项目及增加日志功能 4回复

如何定位解决焦点问题 0回复

如何定位Flutter内存问题 0回复

鸿蒙开发中的又一种弹窗形式--半模态弹窗 0回复

Copyright © 2005-2025 51CTO.COM 京ICP证060544版权所有未经许可请勿转载