Unipp开发中遇到的坑

最新推荐文章于 2025-06-08 15:04:23 发布
原创 最新推荐文章于 2025-06-08 15:04:23 发布 · 458 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#微信小程序 #小程序

本文介绍了Uniapp框架，它基于VUE和微信小程序语法，可打包成多端代码。作者分享了开发APP时遇到微信授权登录功能的问题，使用uni.getUserProfile获取用户信息后传给后端为空，后发现该API不支持APP及H5，提醒开发者用百度搜索时先去官网查看API支持情况。

前言：相信大家没用过也听过Uniapp吧，他是一款基于VUE以及微信小程序的一套语法，最终可以打包成多端代码。所以也是很火的一个框架，那么我们在用uniapp中，肯定会遇到问题或者说没见过的需求，那么今天我就说一下我开发APP中遇到的坑。

不知道大家有没有遇到微信授权登录这个功能，由于我之前没做过嘛，遇到这个需求也是没有一点头绪，于是我就开始去百度。上面有一堆的方法和代码，于是我看到了一个。

uni.getUserProfile   获取用户信息

看到这个字眼，我以为解药来了，好家伙我框框就是c v 大法，唉，已打印，确实是用户信息都出来了

但是当我要传给后端的时候，怎么传发现都是空的。

然后我就纳闷了，我就去官网一搜，结果呢

 

 不支持APP以及H5，当时我10年的脑血痊都复发了。

所以在这提示大家，在去百度的时候，大家一定要先去官网查看一下这个api是否支持小程序等，不要看到一个字眼盲目的用到自己项目上

uniapp新手必须的知道的坑
zsq199771的博客
06-10 1万+
有学过微信小程序开发和vue的，uniapp开发成本低，但是还是不能忽视了注意事项，别给自己带来麻烦，以下是我从官网上抽取的，希望接下来的开发能够顺利进行，文字有点多，但细看益处多多，go~~~ 开发工具下载标准版，在运行或发行uni-app时，会提示安装uni-app插件 下载App开发版，可开箱即用 如使用cli方式创建项目，可直接下载标准版，因为uni-app编译插件被安装到项目下了。 可以通过 vue-cli 创建 uni-app 项目。 接口能力（JS API）靠近微信小程序规范，但需将前缀 wx
关于uniapp开发app的坑（有些可能是app开发都会遇到的）
weixin_42095178的博客
12-15 3364
⾸先第三⽅授权登录（如微信登录）中的签名为app证书的md5，⽅法按照Dcloud官⽅⾛就完事，Java可以选择下载的，更快，⽤Oracle的贼⿇烦还要注册账户，然后就到了坑，再输⼊密码的时候会发现输⼊的内容不显⽰，⼀度怀疑⼈⽣，后来发现只是是隐藏了⽽已，为了安全…所有页⾯样式失效还是样式与⼩程序不符先想想这个页⾯有没有input，video，textarea这类使⽤了原⽣组件的组件，解决办法官⽅有，但看不懂，笨办法是使⽤v-if来隐藏，然后v-else写个假的放上⾯，⽤的时候显⽰真的，其他时候显⽰假的*
UNIapp 开发H5踩坑记录
masju的博客
04-02 1333
设置页面全屏背景图 因为在VUE我们没有body这个标签（层级）。但是提供了page这个在外层的vdom。所以我们直接在page中定义背景的CSS page{ background: url('assets/images/index-bg.png') no-repeat center center; background-size: 100% 100%; width: 100%; min-height: 100%; background-repeat: no-repeat; } ...
uniapp—H5和App坑
qq_33475629的博客
02-28 1099
1、uni-notice-bar在App端不滚动显示 解决：setAnimation方法下面添加app端的判断： //#ifdef APP-PLUS setTimeout(() => { uni.createSelectorQuery().in(this).select(`#${this.elId}`).boundingClientRect().exec((ret) => { this.animation = `notice ${ret[0].width / this.speed}s l
vue 函数嵌套函数再嵌套函数 _this的巨大作用
weixin_44102328的博客
02-26 3862
openOCR3(){ var _this= this; uni.chooseImage({ count: 1, //默认9 sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有 sourceType: ['c.
unipp---HarmonyOS 应用开发实战
qq_36597625的博客
06-08 1195
uniapp-鸿蒙应用开发实践
多端开发之uniapp开发app
weixin_56449722的博客
02-21 3118
最近在给f做一些工具app，学习了不少关于uniapp编写android应用的知识。 首先，App应用的创建的时候要选择项目类型为uniapp类型。最开始我选择的是h5+项目，这种项目就比较容易写成纯js的项目，利用一些html5plus能力，或者使用mui来编写手机app。 我调研了一下，uniapp和h5+（mui为代表）的差异和优缺点如下所示。 技术类型 优点 缺点 uniapp 可以使用unipp封装的组件和api，有海量的插件可以从插件市场中找到。兼容多端，也可以用html
uni-app如何页面传参数的几种方法总结
10-15
本文将详细介绍uni-app页面传参数的几种方法，特别关注`uni.$emit()`和`uni.$on()`的使用，以及它们在实际开发中的应用场景。 首先，`uni.$emit(eventName, OBJECT)`是用来触发全局的自定义事件。你可以向事件中...
山科小站小程序
WindRunnerMax
01-01 3240
山科小站 项目开源地址：https://github.com/WindrunnerMax/SW 目录山科小站一、微信小程序转Uniapp1. 文件对应关系2. App.vue文件3. 自定义组件4. 自定义文件夹5. 数据绑定6. template数据渲染7. 动态绑定class与style8. page.json9. 条件编译功能10. 阿里矢量图标库Iconfont二、 山科小站封装实现1. ...
UNI-APP开发中遇到的坑
goodmentc的专栏
07-13 2309
这样会导致，页面有时无法正常跳转，而点击页面的回退按钮也没有任何反应，页面卡住在当前页面。原因：uni-app中showModel会阻碍 uni.navigateBack跳转。问题：第一次进入页面，列表正常显示，下拉刷新后，列表消失。原因：数组赋值检测不到。解决方案：使用push给数组赋值或者如下方法。在页面中我们一般会在顶部左侧放置一个返回按钮，用户点击返回按钮则关闭当前页面，返回上一层页面。需求：当用户进行操作成功后，我们希望页面自动关闭，跳转回上一层页面。
uni-app遇到的坑
weixin_30735391的博客
08-14 1275
1、【uni-app】微信开发者工具拒绝HBuilderX访问 　　解决：在微信开发者工具里设置。原意服务端口已关闭。要使用命令行调用工具，请打开工具 -> 设置 -> 安全设置，将服务端口开启。 　　 2、H5跨域问题　　配置uni-app 中 manifest.json->h5->devServer(manifest.json文件的源码)　　"h5": ...
uni-app的坑
w001yy的博客
01-09 596
作为vue语法开发的跨平台开发框架虽然愿望很美好，但是真的要实现跨平台还是需要开发者搭建好的项目架构，灵活运行vue语法和模块化开发思维。 H5适配 官方创新很好，又为我们创造了一个尺寸单位，upx，但是考虑到项目迁移和开发通用，我决定还是使用px配合flexible实现适配，确保项目可以轻松移植到uni框架，需要改动@dcloudio/vue-cli-plugin-uni/packages/po...
uniapp /deep/设置uni-app组件样式时 h5生效 小程序失效问题解决
qq_36904182的博客
04-19 3217
今天写uni-app的项目 设置uni-app扩展组件的样式 使用穿透/deep/ 发现小程序没有效果 h5有效果 //小程序无效 h5生效 /deep/ .uni-list-item .uni-list-item__container .uni-list-item__content .uni-list-item__content-title{ color: #333333; font-size: 32upx; } 加入一下代码后 h5 和小程序 都生效 //与methods 同级加.
【UniApp】-uni-app概述
Reische的博客
12-13 160
好，经过我们前面文章的编写，大家可以了解到微信小程序开发相关的知识，了解完了这个微信小程序开发和云开发之后，从这篇文章开始，我再来给大家写一下关于 Uniapp 的知识。好，开始，那什么是 Uniapp 呢？这个时候我们不管三七二十一，先打开我们 Uniapp 官方文档，它官方地址也很简单，叫做dcloud.io这就是官方档。在官方文档当中有一个 uni-app，然后它下面写了一句话，开发一次多端覆盖，对吧？那什么叫做开发一次多端覆盖？也非常简单。
uniapp详细介绍
热门推荐
m0_68907098的博客
11-29 2万+
uniapp的详细介绍
uni app心得和感受
2301_78360123的博客
06-20 603
开发多个平台的时候，对，就是开发多端，其中包括安卓、IOS、H5/公众号、微信小程序、百度小程序...等其它小程序时，如果每个平台开发，人力开发成本高，后期维护也难，原生开发周期也长，那Unipp就是你的优先选择，官方是这样介绍的~哈~2、采用vue的语法，v-for，v-if，生命周期等；社区还是比较成熟，生态好，组件丰富，支持npm方式安装第三方包，兼容mpvue，DCloud有大量的组件供你使用，当然付费的也不贵，你还可以发布你开发的，赚两个鸡腿钱还是可以的。7、既然是跨端，当然有端的判断。
unipp心得体会
e745418的博客
06-13 1424
UniApp广泛应用于各类移动应用开发场景，包括但不限于电商应用、社交&媒体应用、企业应用、教育应用、生活服务应用以及金融应用等。例如，某知名电商平台利用UniApp开发了一款跨平台电商应用，实现了商品展示、交易、物流查询等功能，为用户提供了便捷的购物体验。随着技术的不断进步和移动互联网的不断发展，UniApp将会继续优化和完善其功能特点，为开发者提供更加高效、便捷的开发体验。UniApp，作为一款跨平台应用开发框架，自诞生以来便以其独特的优势和广泛的应用场景，受到了众多开发者的青睐。
uni-app快速入门
邓邓子的博客
09-23 1万+
uni-app 是一个使用 Vue.js 开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、Web（响应式）、以及各种小程序（微信/支付宝/百度/头条/飞书/QQ/快手/钉钉/淘宝）、快应用等多个平台。DCloud 公司拥有900万开发者、数百万应用、12亿手机端月活用户、数千款uni-app插件、70+微信/qq群。阿里小程序工具官方内置uni-app，腾讯课堂官方为uni-app录制培训课程，开发者可以放心选择。uni-app 在手，做啥都不愁。即使不跨端，uni-app 也是
使用uniapp开发项目来的几点心得体会
8号专栏
12-14 2389
先说一下提前须要会的技术 要想快速入手uniapp的话，你最好提前学会vue、微信小程序开发，因为它几乎就是这两个东西的结合体，不然，你就只有慢慢研究吧。 为什么要选择uniapp？？？ 开发多个平台的时候，对，就是开发多端，其中包括安卓、IOS、H5/公众号、微信小程序、百度小程序...等其它小程序时，如果每个平台开发，人力开发成本高，后期维护也难，原生开发周期也长，那Unipp就是你的优先选择，官方是这样介绍的~哈~ 先来说一下uniapp的优点 uniapp优点 优点一，多端支持 当然是多
unipp开发App设置应用权限
最新发布
08-22
在使用 Uni-app 开发 Android 或 iOS 应用时，配置应用权限是确保应用正常运行的关键步骤。不同平台的权限配置方式有所不同，下面将分别介绍 Android 和 iOS 平台的权限配置方法。 ### Android 平台权限配置 在 Android 平台上，应用权限分为**普通权限（Normal Permissions）**和**危险权限（Dangerous Permissions）**。普通权限通常涉及用户数据的访问，而危险权限则可能对用户的隐私或设备功能造成影响，因此需要用户手动授权。 #### 1. 声明权限 在 `manifest.json` 文件中，可以通过 **源码视图** 的方式进入 `AndroidManifest.xml` 文件，添加所需的权限声明。例如，若需要访问设备的位置信息，可以添加以下权限： ```xml <uses-permission android:name="android.permission.ACCESS_FINE_LOCATION" /> ``` #### 2. 请求权限 在 Uni-app 中，可以通过 `uni.authorize` 或 `uni.getSetting` 接口请求权限。例如，请求位置权限的代码如下： ```javascript uni.authorize({ scope: 'scope.userLocation', success() { console.log('授权成功'); }, fail() { console.log('用户拒绝授权'); uni.openSetting({ success(settingData) { if (settingData.authSetting['scope.userLocation']) { console.log('用户重新授权成功'); } } }); } }); ``` ### iOS 平台权限配置 在 iOS 平台上，除了在 `manifest.json` 中配置权限外，还需要在 `Info.plist` 文件中添加相应的描述信息，否则应用将无法通过 App Store 审核。 #### 1. 声明权限 在 HBuilderX 中，可以通过 **源码视图** 修改 `Info.plist` 文件，添加以下内容以请求位置权限为例： ```xml <key>NSLocationWhenInUseUsageDescription</key> <string>我们需要您的位置信息来提供附近服务</string> ``` #### 2. 请求权限 与 Android 类似，iOS 也通过 `uni.authorize` 和 `uni.getSetting` 进行权限请求。例如： ```javascript uni.authorize({ scope: 'scope.userLocation', success() { console.log('授权成功'); }, fail() { console.log('用户拒绝授权'); uni.openSetting({ success(settingData) { if (settingData.authSetting['scope.userLocation']) { console.log('用户重新授权成功'); } } }); } }); ``` ### 注意事项 - 在 Android 6.0 及以上版本中，危险权限需要在运行时请求，而不能仅在 `AndroidManifest.xml` 中声明。 - iOS 的权限请求描述必须清晰说明用途，否则可能被 App Store 拒绝。 - 所有权限请求应遵循最小权限原则，仅请求必要的权限[^2]。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值