vue app开发调用原生方法实现权限访问授权处理（二）

置顶 已于 2023-07-06 14:48:45 修改
阅读量1k 收藏 2
点赞数 1
分类专栏： Vue javascript vue项目非常实用的功能整理 文章标签： 前端 vue.js javascript
于 2022-12-03 18:47:12 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/SmartJunTao/article/details/128163902
版权

vue app开发调用原生方法实现权限访问授权处理


前提：在写代码之前应该想清楚调用原生安卓、ios的方法，就应该遵循双端的方法规则，调用方法时应该注意，在这里先主要介绍一下注意事项：

根据App发布应用市场的要求，下载、上传、定位获取、版本获取等功能必须要提供供用户选择的授权提示。当访问页面时候通过调用原生方法唤起手机授权提示，选择授权同意和拒绝授权处理，当选择同意授权就要对获取的数据进行 处理，选择拒绝授权时应做一些拒绝的提示，当再次访问页面时候，也要再次弹出这样的权限弹窗供用户选择授权，当然 用户可以拒绝或者在手机后台手动去设置是否要授权。

  • 了解提供的原生的方法的实现步骤
  • 知道原生方法的使用规范
  • 原生方法的调用授权处理
  • 同意授权处理和拒绝授权处理 

这里介绍原生方法的使用，实现步骤。 可根据自己项目需求自定义，但是用法都是类似的，参考使用。以下定义的方法需要和安卓、ios开发人沟通、协商定义。

目录

vue app开发调用原生方法实现权限访问授权处理

图片上传授权

app版本获取 

 图片下载

电话授权

授权同意处理统一方法

了解本专栏 订阅专栏 解锁全文 超级会员免费看
船长在船上
关注
  • 1
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 1
    评论
专栏目录
订阅专栏
vue中打开定位权限
weixin_45803033的博客
03-22 1670
cordova.plugins.diagnostic和cordova-open-native-settings打开手机上的gps定位 安装插件 cordova plugin add cordova.plugins.diagnostic cordova plugin add cordova-open-native-settings // 打开设置gps定位的窗口 导入插件 import { AndroidPermissions } from '@ionic-native/android-permissio
vue 获取安卓原生方法_vue与原生app的对接交互的方法(混合开发)
weixin_39831991的博客
12-19 1115
小伙伴们在用vue开发h5项目特别是移动端的项目，很多都是打包后挂载在原生APP上的，那就少不了与原生交互了，我把我踩的一些坑，拿出来给大家分享下。1.通过url传输数据：(一般是在入口页面传下app的用户信息进来供vue h5使用)methods: {// 接收url后的数据urltext() {let loc = location.href; 6 let n1 = loc.l...
vue中如何调用原生安卓或ios的方法
sslcsq的博客
08-10 1984
现在的app部分是嵌套h5页面(我是使用vue去开发的，别的都一样) 那么如何调用原生安卓或者ios的方法呢？ 首先 在事件里面去这样写 const u = navigator.userAgent; const isAndroid = u.indexOf("Android") > -1 || u.indexOf("Adr") > -1; //android终端 const isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); /
Vue调用手机权限
YourNikee的博客
01-25 2574
自学vue打包成app的时候，发现了一个问题，普通ui框架无法调用手机硬件的权限，所以我找了一下，发现Dcloud有一个5+specification可以间接实现这个功能，所以我就研究了一下用法。 这个比较简单，只是想让其他小伙伴少绕一点弯路。 由于本人没学原生和nt，所以不太清楚权限是不是全的。 下面说一下用法。 其实很简单，就只是找到项目目录下的单原页面：index.html 然后使用document.addEventListener触发plusready方法，将需要使用的权限通过定义全局变量的方式定义
vue导航权限
weixin_42304401的博客
02-22 201
vue导航权限控制 登录动过接口获取用户权限，本地缓存菜单 项目由于是四层结构，代码如下 … {{ item.resourceName }} {{ itemChild.resourceName }} {{ itemChild_Child.resourceName }} {{ itemChild_three.resourceName }} {{ itemChild_Child.resourceName }} {{ itemChild.resourceName }} {{ item
vue 移动端---语音播放--原生audio（类似百度翻译的语音播放）
DcTbnk的博客
06-08 868
原生audio---语音播放*可下载进行测试的音频网站1.效果图2.一些audio相关的代码知识上图效果代码展示--vue项目 *可下载进行测试的音频网站 →点击可查看—可下载的音频网站 1.效果图 上图效果的代码请查看博文→点击可查看（写成了父子组件形式） 我目前写的主要展示的是单个语音的播放，如下图所示，我参考的文章地址是 → 点击可查看 多个语音的播放顺序问题，可查看文章→点击可查看 2.一些audio相关的代码知识 // 重新加载 this.audio.load(); // 判断是否正在播放
便利贴--30{vue重写获取高德当前位置，解决提醒没有权限情况}
hacker12356的博客
03-03 914
便利贴--30{vue重写获取高德当前位置，解决提醒没有权限情况}
NativeScriptVue使用NativeScript和Vue开发原生iOS和Android移动App
08-08
总的来说，这个资源提供了使用NativeScriptVue开发混合移动应用的方法，包括如何设置环境，如何创建和管理Vue组件，以及如何调用原生设备API等。开发者可以借助这个框架，将前端开发技能延伸到移动应用领域，实现一...
基于vue的eros app 快速开发模板
02-18
【Vue.js】 ...通过学习和使用这个基于Vue的Eros App快速开发模板，开发者能够快速理解如何在Eros App环境中组织代码、处理数据流、实现页面间通信，以及如何进行项目构建和部署，从而大大提高开发效率。
uni-app 项目调用手机原生事件，获取蓝牙连接，打印信息
06-16
在uni-app中，我们可以通过调用原生API来实现蓝牙功能，从而与这些设备进行数据交换。 uni-app 提供了一个名为 `uni.getBluetoothAdapterState` 的方法来检查蓝牙状态，这是整个蓝牙操作流程的第一步。这个方法会...
原生Vue 实现右键菜单组件功能
10-15
总之，原生Vue实现的右键菜单组件提供了高度的定制性和灵活性，通过监听事件、定义菜单结构和处理点击事件，可以轻松实现这一功能。通过这种方式，你可以在不引入额外依赖的情况下，为Vue应用添加丰富的交互体验。
uniapp调用原生Android SDK
08-11
【uniapp调用原生Android SDK】和【uniapp调用原生IOS SDK】涉及到的是在跨平台开发框架uniapp中如何与原生系统进行深度交互的技术。uniapp是一个使用Vue.js开发的所有平台的统一解决方案，它允许开发者通过一套代码...
vuex移动端项目中对页面权限控制设置
晚星的博客
03-20 734
1. 理解整体需求 当用户没有登录时，是不能访问’我的’这个路由的，跳转到登录页面让用户登录，其它页面可以正常进入 2. 思路分析 如果跳转到的是其它页面直接放行 如果跳转到的是’我的’页面，增加判断逻辑，如果有token则放行，如果没有则跳回到登录页面 import store from '@/store' router.beforeEach((to, from, next) => { if (to.path.startsWith('/user')) { if (store.st
引入vue,App组件
qq_65672119的博客
10-15 879
2、在HTML文档中使用script标签引入下载好的vue文件即可，语法“”。changeOrigin: false //用于控制请求头中的host值。changeOrigin: true //用于控制请求头中的host值。ws: true, //用于支持websocket。ws: true, //用于支持websocket。// 引入App组件，它是所有组件的父组件。// 关闭Vue的生产关系。// 第一种方式代理。
Vue 工程在 Chrome 浏览器打开，获取音频设备权限问题
夢的点滴的博客
03-16 4329
目录 项目场景 问题描述 解决方案 方法一、网页使用https方式访问 方法二、修改浏览器安全配置（最直接、简单） 项目场景 VUE 工程中使用 navigator.mediaDevices.getUserMedia方法调用音视频设备。 问题描述 Vue 工程在 Chrome 浏览器打开，无法获取音视频设备，控制台提示获取音频设备权限问题 Cannot read property getUserMedia of undefined 解决方案 方法一、网页使用https方式访...
vue权限管理
qq_36262295的博客
04-13 888
权限 权限是对特定资源的访问许可，所谓权限控制， 也就是确保用户只能访问到被分配的资源 接口权限 接口权限目前一般采用jwt的形式来验证， 没有通过的话一般返回401，跳转到登录页面重新进行登录 登录完拿到token，将token存起来， 通过axios请求拦截器进行拦截，每次请求的时候头部携带token axios.interceptors.request.use(config => { config.headers['token'] = cookie.get('token') re
vue中文件上传下载与回显
m0_52189068的博客
12-20 3823
一.上传文件: pc端 采用饿了么上传组件:<el-upload /> 可以手动上传也可以立即上传 1.立即上传: <el-upload ​ • ref="myUpload" ​ • :action="fileUploadApi + '?name=' + fileName" ​ • :headers="headers" // 设置请求头{'Authorization': getToken()} ​ • ...
uni-app 用户拒绝授权后再次调起授权页面 和 在小程序中打开第三方导航地图
qq_38758763的博客
04-15 3480
1、用户拒绝授权后再次调起授权页面 uni.getSetting({ success(res) { if (res.authSetting['scope.userLocation']) { console.log("userLocation位置功能已授权") // 如果已授权,直接获取对应参数 uni.getLocation({ ...
一个使用Go语言和现代Web技术构建跨平台桌面应用程序开源项目
最新发布
yunmoon的博客
07-10 739
Wails作为一个桥梁，连接强大的Go后端逻辑与丰富的Web前端界面，允许开发者利用两者的最佳特性来开发应用。
vue点击号码拨打电话
10-12
可以使用vue的@click事件和tel协议来实现点击号码拨打电话的功能。具体实现代码如下： ```html <template> <div> <a href="tel:10086" @click.prevent="callPhone">10086</a> </div> </template> <script> export default { methods: { callPhone() { window.location.href = 'tel:10086'; } } } </script> ```

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

船长在船上

您的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值