- 博客(20)
- 收藏
- 关注
原创 uniapp的H5端微信与支付宝支付(包括PC端与移动端)
大致流程为请求创建订单接口传递正确参数(例如openid、金额、开始结束时间等),此接口会返回一个图片,或网络图片,或base64图片,这个图片是一张二维码;前端拿到这个二维码渲染到屏幕上并开始启动定时器,每过一秒请求一次查询支付结果接口,查询是否支付成功;支付宝支付可能会给一个跳转链接,直接跳转进入,其中有一个二维码,扫码可完成支付,支付成功或中断的url地址都是在微信商户平台后台配置的;支付成功清除定时器,跳转结果页;以上为流程,那么代码逻辑是就可以跟随流程进行编写以便进行查看,具体流程和代码的逻辑为:
2023-05-03 12:22:28
8673
3
原创 微信H5端网页授权流程(在H5中的openid获取,网页绑定微信)
这里说的是scope为snsapi_base这种方式,用于获取每一个微信用户都只有一个的openid,作用是让用户使用微信绑定当前网页,获取微信的H5支付的必要参数之一。1、先准备一个结果页面,即为,告知用户当前是否获取到openid结果的页面(就是一个白页面,上面一行字,‘您已成功绑定微信’或‘微信绑定失败,请重新绑定’);判断是否为微信浏览器,如果为微信浏览器,弹出提示框,用户确认一下绑定防止误触(这一步为用户体验优化),确认绑定直接请求链接,然后到结果页面进行上述流程;①、客户拥有自己的公众号。
2023-04-15 15:46:05
10936
原创 uniapp一键登录流程及代码
原理流程:通过三大运营商和uniCloud云函数,以移动网络(流量)去鉴别手机号,用户只需要点击“登录”按钮,前端开发者就可以获取到手机号,将这个手机号通过接口传递给后端,后端一般会给一个一键登录接口,后端拿到以后进行处理将登录凭证(token)给到前端,前端存储本地,完成一键登录操作;因此,对于用户来说,一键登录的必须条件为:1、手机设备打开“移动网络”,且手机号可用(可发送短信,拨打电话,充值流量,且为正规手机号码);真机调试连接成功,但控制台不打印数据无法唤起自带弹框,一直转圈等其它问题打印代码,通过
2023-04-15 15:13:38
6063
4
原创 关于uniapp的跨域
在请求接口的时候,无论是否需要登录凭证,都报跨域错误;只有需要登录凭证的接口会报跨域错误,其它的公共接口正常请求;请求发出了,后端返回数据报错(token key 为空)四、请求发出,没有报跨域错误,请求头上也有token,但返回数据始终未登录各位同道在遇到后端对接跨域问题的时候可以做参考。关于cors(设置响应头组件)前端应该了解的部分:例如首页轮播图等,这种就是需要处理跨域,处理方式为:在manifest.json-源码视图-"h5"中加上:在很多人使用uniapp,与后端对接时有事会遇到跨域线上开发则
2023-04-08 16:15:05
6157
5
原创 uniapp宽屏开发PC端方案,及衍生问题解决
需要在uniapp的pages.json文件中配置正常电脑没有高于3840像素宽的,这个程度就足以;在使用时,只要正常的按照1920/750 = 2.56的比例,在HBuliderX中进行比例配置,使用时进行px转化rpx即可。问题一、pc端字体过大问题二、字体大小固定:问题三、如何同时适配PC与移动端?解决思路:由于PC的根元素必须是因此要么pc和移动端都在page-meta的规则下使用v-if进行判断渲染,判断当前的设备是移动端或pc端,然后渲参考rem处
2023-03-06 00:17:14
8727
3
原创 uniapp图片、视频文件上传,图片自动与手动裁剪
首先使用uni.chooseImage进行图片选择与裁剪,图片裁剪仅支持app端,通过uni.chooseImage获取到图片临时路径。此模式会自动裁剪图片,图片的更多裁剪模式请参考uni官方开放文档(mode有效值 有 14 种,其中 5 种是缩放模式,9 种是裁剪模式)与图片类似,使用uni.chooseVideo选择视频搭配uni.uploadFile进行文件上传即可。2、使用uni.uploadFile进行文件上传,获取到服务器上的图片路径。
2023-02-16 23:16:03
2027
原创 uniapp苹果上架出现的问题及解决方案
苹果上架各种问题解决,1、无法进入技术支持网站,url导向不正确2、没有数据,某些列表没有加载数据,没有商品3、没有解释追踪的使用您的 App 包含 NSUserTrackingUsageDescription,这表示您将会请求追踪用户4、包含Android引用或内容5、应用功能出错6、本不需要token验证的页面出现token验证,如详情,搜索页面(信息收集)7、“年龄分级”分类不准确,app拥有“竞赛”等内容出现8、没有账户注销9、“规则”中没有说明与苹果无关登录无响应11、业务不合规,应用商店不支持
2023-02-16 00:14:37
2675
1
原创 unaipp竖屏占满屏幕
uniapp中如果直接在页面中使用css属性height:100%是无法生效的,究其原因,是因为其根元素不具有高度,那么找到了原因,便可以解决,解决方法为:需要在app.vue的文件中的里写上:这样就在页面根元素上设置了100%,然后任何页面需要占满屏幕高度,就直接设置height:100%即可生效。如果是需要初始内容为100%,或不确定后续是否有添加新内容,使用min-height:100%;或设置over竖屏占满可运用场景:APP首屏图、内容较少的登录注册及其他页面
2023-02-15 00:33:01
3133
原创 uniapp前端实现热更新
uniapp前端实现热更新1、首先,在主页或app.vue中使用plus.runtime.getProperty()获取到app的当前wgt包版本号。3、安装wgt包:plus.runtime.install();4、重启app:plus.runtime.restart();注意:千万千万不要用这个(plus.runtime.version)作为判断,它获取的是当前app的安装包版本,上面的那个是获取wgt包的版本,两个不一样,plus.runtime.version始终是一个恒定的值,除非安卓整包更新。p
2023-02-13 23:51:46
3491
原创 uniapp使用高德地图地理位置逆解析/将获取到的经纬度转化为地址
uniapp使用高德地图地理位置逆解析/将获取到的经纬度转化为地址。首先使用uni.chooseLocation获取一个地图上指定的经纬度,然后通过高德地图逆解析的api进行逆解析来获得详细地址。1、在高德登录注册,进行个人或企业开发者认证(个人开发者可以随时升级企业开发者)使用时直接传参即可打印成功或失败数据;key:高德地图里面获取的key;获取的结果即为解析出来的地址。说明:这是一个函数,有三个参数;2、进入控制台,按以下图示操作
2023-02-12 19:38:58
4138
10
原创 使用HbuilderX进行uniapp的真机调试
uniapp真机调试连接不上/连接上后电脑没反应HbuilderX显示“找不到设备”无限加载/不停的转圈/正在获取设备列表手机上显示无法连接到服务器(failed to connect to ……)
2023-01-26 21:56:05
5327
2
原创 关于单页面加载机制与路由懒加载是否冲突的问题
搭配上路由懒加载后能够实现某种优化,此时的优点是“当用户访问到一个已经访问过的组件时,组件不会重复加载内容,而是将之前加载好的内容拿出来给用户,但是多页面加载并不具备此功能,会重新加载;因此使用路由懒加载,仅在切换相应路由的时候加载相应组件内容(js、模板、css、数据),有效减少首屏加载时长;单页面指的是一个html通过路由进行多个组件的切换和加载,实现的功能构造,它在一开始就加载所有的html,css,js,用户使用时无需重复加载,切换组件更为流畅;4、便于设置切换动画,切换动画可以做的更为炫酷。...
2022-09-01 14:43:27
270
原创 微信小程序学习(一)
小程序的生命周期分为全局与页面,它们的环境都是类,全局的引入名叫做App,页面的叫做Page,它们都是提前封装引入,可以直接使用,在其中进行逻辑代码写入。场景值的出现是因为用户通过不同方式进入需要呈现不同页面的需求存在,因而出现的属性,开发者可以通过场景值的不同来进行不同的页面渲染或页面跳转。在app.js中进行定义的方法与属性当然可以在其本身使用,因为在app.js中定义,它们被称为全局属性,当然可以在项目中的其他页面中使用。项目私有配置文件,其中的配置优先于project.config.json。...
2022-07-23 23:35:20
671
原创 vue3的学习(四)
vue3相较于vue2拥有很大的升级与不同这里继续记录vue2与vue3的不同与区别在vue3中,由于不再使用实例来进行方法,因此在全局组件的形式上,也略有区别,但主要是在引入方式上,主要代码区别不大代码为了方便对比,这里放上vue2的全局注册方式关于vue3中的过滤器说明:在vue3中,不再支持过滤器,也就是说,过滤器被直接移除了,因为官方认为过滤器完全可以让开发者自己写一个函数进行数据处理,没有必要专门做一个语法,过滤器...
2022-07-13 22:01:22
1513
原创 vue3的学习(三)
在前面说了vue3的新特性与其新添加的setup函数和实现响应式更新的三个方法前面的学习这里继续记录vue的新特性和方法,以及不同于vue2之处;在vue3中,生命周期函数并没有什么大变化,依然是八大生命周期函数,这里值得一提的是setup中的生命周期函数,在setup函数中,没有创建之前(beforeCreate)与创建完成(created)这两个函数,因为这两个函数在外界已经完成建立,而且setup函数的主要作用也是创建;剩下的生命周期函数如果要在setup中使用需要...
2022-07-10 22:51:21
473
原创 vue3的学习(二)
vue3与vue2在代码使用上有了很大的区别,更加趋向于原生js的格式,使用composition可以将界面中重复的部分连同其功能一起提取为可重用的代码段,从而提高应用的可维护性和灵活性setup函数是vue3与vue2的一个重要的不同,setup函数在组件被创建之前,props之后进行解析执行,解析完成后,props就作为了组合式apl的入口。setup函数的调用发生在data、computed和methods等属性之前,这些属性无法在setup中被获取使用...
2022-07-09 20:44:57
2291
原创 使用html布局时的经常出现的冷门问题
在刚学html时,新手经常会因为各种各样的原因导致页面布局出现BUG,无法达到预期效果,这里做一个练习时的总结
2022-07-09 19:55:37
538
原创 关于清除浮动的理解(个人理解)
总所周知,子元素浮动会导致父元素高度塌陷,影响后续布局,出现布局重叠混乱等问题。清除浮动的作用就是使父元素拥有高度,不影响后续布局。清除浮动有五种方法,而大部分初学者常用的方法是给父元素加浮动。但这样会造成更大的浮动问题,导致一旦遇到结构复杂的情况时就会样式混乱。而使用伪元素清除浮动的意义,就是清除浮动之后,父元素拥有了高度,哪怕在之后不再使用浮动,也不会导致页面混乱,结构坍塌,后面所写的布局仍然是稳定正常的。这也是伪元素清除浮动最好用的原因,可以提前在公共样式中写好,之后直接添加类名使用伪元素清除浮动即可
2022-07-09 19:43:34
592
原创 Vue3的学习(一)
vue3测试于2020年九月,直至2021年底成为vue的核心库,在此之前市场上大部分所使用vue搭建的项目为vue2,但vue3取代于vue2已经成为必然的趋势,在学习vue3之前建议提前学习vue2,待到vue3占据市场大部分时就可以对vue2仅做了解的学习vue3相较于vue2有更多的优势,具体表现于性能方面:项目打包体积更小初次渲染更快,更新渲染更快需要的运行内存更小使用了Proxy(代理)替代了Object.defineProtype,实现了数据的响应虚拟DOM更新了算法 和 Tree-Shaki
2022-07-07 21:57:31
381
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人