vue3+ts+uniapp小程序封装获取授权hook函数

news/2024/7/10 0:16:26 标签: uni-app, 小程序, typescript, vue

vue3tsuniapphook_0">vue3+ts+uniapp小程序封装获取授权hook函数

小程序授权的时候,如果点击拒绝授权,然后就再也不会出现授权了,除非用户手动去右上角…设置打开

通过uni官方api自己封装一个全局的提示:
uni.getSetting :http://uniapp.dcloud.io/api/other/setting?id=getsetting
uni.authorize:http://uniapp.dcloud.io/api/other/authorize?id=authorize
uni.openSetting:https://uniapp.dcloud.net.cn/api/other/setting.html#opensetting

具体代码
src\composable\index.ts

/**
 * 授权综合逻辑
 * @param {*} scope 权限代表
 */
export const useShowPullAuth = () => {
  const pullAuth = (scope: keyof UniApp.AuthSetting): void => {
    const map: Record<string, string> = {
      'scope.userInfo': '用户信息',
      'scope.userLocation': '地理位置',
      'scope.userLocationBackground': '后台定位',
      'scope.address': '通信地址',
      'scope.record': '录音功能',
      'scope.writePhotosAlbum': '保存到相册',
      'scope.camera': '摄像头',
      'scope.invoice': '获取发票',
      'scope.invoiceTitle': '发票抬头',
      'scope.werun': '微信运动步数',
    }

    uni.getSetting({
      success() {
        // scope 存在
        if (map[scope]) {
          // 提前向用户发起授权请求
          uni.authorize({
            scope,
            fail() {
              const word = map[scope]
              uni.showModal({
                content: `检测到您没打开${word}权限,是否去设置打开?`,
                confirmText: '确认',
                cancelText: '取消',
                success: (res) => {
                  if (res.confirm) {
                    // 打开授权页
                    uni.openSetting({
                      success: (res) => {
                        if (res.authSetting[scope]) {
                          uni.showToast({
                            title: '授权成功',
                            icon: 'none',
                          })
                        } else {
                          uni.showToast({
                            title:
                              '未授权,将会影响使用小程序部分功能,可自行去右上角(...)中-设置手动打开!',
                            icon: 'none',
                          })
                        }
                      },
                    })
                  } else {
                    uni.showToast({
                      title:
                        '未授权,将会影响使用小程序部分功能,可自行去右上角(...)中-设置手动打开!',
                      icon: 'none',
                      duration: 2500,
                    })
                  }
                },
              })
            },
          })
        } else {
          // 不存在授权 scope
          uni.showToast({
            title: '无此授权功能',
            icon: 'none',
          })
        }
      },
    })
  }
  return { pullAuth }
}

在需要用的页面使用 onLoad

放在onLoad是为了一进来就进行调用,当scope是对的就会进行发起授权,当你之前已经授权过了,就会什么也不做,若是发现未授权,就会弹窗手动引导你去系统授权设置里!

<script setup lang="ts">
import { useShowPullAuth } from '@/composable'
import { onLoad } from '@dcloudio/uni-app'
onLoad(() => {
  console.log('onLoad')
  pullAuth('scope.camera')
})
</script>

在这里插入图片描述


http://www.niftyadmin.cn/n/5027345.html

相关文章

工业交换机常见的硬件故障有哪些?

工业交换机常见的硬件故障主要是由于受到供电电源、室内温度、室内湿度、电磁干扰、静电等机房环境的影响&#xff0c;造成工业交换机电源、背板、模块、端口等部件出现故障。具体可以分为以下几类。 1.电力供应故障&#xff1a; 由于外部供电不稳定、电源线路老化或雷击等原因…

AI助手-百度免费AI助手工具

AI助手是有百度推出的免费AI助手工具&#xff0c;国内无需魔就可以使用的AI工具&#xff0c;而且无限制&#xff0c;和ChatGPT类似的人工智能聊天机器人差不多&#xff0c;内置了各种功能的快捷入口&#xff0c;直接点开即可使用&#xff0c;而且还可以ai作画。 工具地址&…

Ceph入门到精通-S3 基准测试工具warp使用入门

S3 基准测试工具。 下载 下载适用于各种平台的二进制版本。 配置 可以使用命令行参数或环境变量配置 Warp。 可以使用 、 在命令行上指定要使用的 S3 服务器&#xff0c;也可以选择指定 TLS 和自定义区域。--host--access-key--secret-key--tls--region 也可以使用 、、 和…

脚本:用python实现五子棋

文章目录 1. 语言2. 效果3. 脚本4. 解读5. FutureReference 1. 语言 Python 无环境配置、无库安装。 2. 效果 以第一回合为例 玩家X 玩家0 3. 脚本 class GomokuGame:def __init__(self, board_size15):self.board_size board_sizeself.board [[ for _ in range(board_…

学习Kotlin看哪些书?【赠书活动|第八期《深入实践Kotlin元编程》】

文章目录 图书简介01 《深入实践Kotlin元编程》02 《Spring Boot学习指南》03 《Kotlin编程实战》 抽奖方式 与Java一样&#xff0c;Kotlin也是用于Android应用程序开发的编程语言&#xff0c;是Android官方支持的第二种编程语言。 2016年Kotlin正式发布&#xff0c;在Android“…

uniapp video全屏 cover-view 失效

查看官方文档 video | uni-app官网 确定自己开发的是app端 还是 微信小程序&#xff0c;我开发的是app端&#xff0c;所以在nvue文件写&#xff0c;同时cover-view组件要在video组件内容。 我写了一个简单的视频组件&#xff0c;可以看我另一篇博客。 uniapp video&#xff08…

:style在列表中动态配置背景图片

要在一个列表中动态配置多个元素的背景图片&#xff0c;您可以使用 v-for 循环遍历列表中的每个元素&#xff0c;并为每个元素设置不同的背景图片。以下是一个示例&#xff1a; <template><div><div v-for"(item, index) in items" :key"index&…

java中批量导出文件并压缩到zip文件中

最近开发遇到个问题 批量导出并压缩到zip文件中&#xff0c;代码和思路如下 不做赘余的解释… PostMapping("/downLoads")public void downLoadCategoryFiles(RequestBody List<String> fileUids, HttpServletResponse response) throws Exception {// 取得文…