Cross-platform APP
文章平均质量分 88
跨平台概念是软件开发中一个重要的概念,即不依赖于操作系统,也不依赖硬件环境。本专栏内容主要涵盖跨平台应用开发。
No Silver Bullet
业精于勤荒于嬉,行成于思毁于随。
学业由于勤奋而专精,由于玩乐而荒废;德行由于独立思考而有所成就,由于因循随俗而败坏。
——出自(唐)韩愈《进学解》
展开
-
跨平台应用开发进阶(五十四)cordova自定义插件
在前期博文《ReactNative进阶(一):ReactNative 学习资料汇总》中,提到目前主流的移动跨平台技术方案大体可以分为三类,使用原生内置浏览器加载HTML5的Hybrid技术方案,采用此种方案的主要有CordovaIonic和微信小程序;使用JavaScript语言进行开发,然后使用原生组件进行渲染,采用此方案的主要有Weex和轻快应用;使用自带渲染引擎和自带原生组件来实现跨平台,采用此种方案的主要是Flutter。注意⚠️:存放自定义cordova插件目录不能有空格可能会报错!原创 2024-05-15 14:27:42 · 1358 阅读 · 0 评论 -
跨平台应用开发进阶(二十七)安卓应用加固签名后应用无法打开问题分析及解决
在应用RN改造好系统功能进行功能验证阶段,发现使用梆梆加固对APP进行加固、签名后点击APP图标无法打开应用,且移动设备处于卡死状态。应用未进行加固签名的APP,应用可正常打开,且功能正常。故问题出在加固或签名环节。加固阶段,更换不同加固策略,发现应用策略A加固、签名后的应用图标无法正常打开,应用策略B加固、签名后的应用功能正常,故可将问题定位在加固环节中的加固策略A,签名环节应该无问题。继续深究下2个加固策略之间的差异性。原创 2023-09-15 10:10:43 · 649 阅读 · 0 评论 -
跨平台应用开发进阶(六十六):component组件实现原生插件
JS中window.alert()与alert()的区别alert与window.alert没什么区别,如果有人觉得有区别,那就来解释一下:所有以window.开始的语句,都可以直接把window省略。只是在有些软件中,由于其编译器特性,当你写了window.的时候会自动的出现window的方法,所以如果你记得住完全没必要写window。比如location.href=window.loc原创 2015-11-23 22:04:25 · 52290 阅读 · 0 评论 -
跨平台应用开发进阶(六) :uni-app实现原生插件集成
因项目需求,需要uni-app实现原生插件集成,现将集成过程梳理得出此文。原创 2016-01-19 09:39:21 · 48550 阅读 · 1 评论 -
跨平台应用开发进阶(六十五):小程序分包策略及实战讲解
微信小程序开发过程中,随着业务不断迭代,程序包的体积越来越大,使用分包加载是开发者必须面对的问题。正常情况下,小程序首次启动时,会将整个代码包下载下来,所以如果代码包过大,会影响小程序首次启动时间,因此微信官方对小程序代码包做了大小限制。原创 2023-05-20 20:27:34 · 1122 阅读 · 0 评论 -
跨平台应用开发进阶(六十四):微信小程序开发技术栈原生开发 VS 跨平台开发
说到前端开发,就不得不说到跨端开发,因为它可以提高应用程序的效率并降低开发成本。uni-app是一种跨平台开发框架,基于Vue.js,并且可以在多个平台如微信小程序、支付宝小程序、H5等上运行。对于开发人员来说,这意味着他们可以使用同一个代码库来构建多个平台的应用,而不需要开发不同的代码库。原创 2023-05-18 10:55:02 · 1233 阅读 · 0 评论 -
跨平台应用开发进阶(六十三):微信小程序开发
随着微信小程序越来越普及,开发人员们也在不断地寻求更高效且方便的开发方式。uni-app是一款由DCloud开发的跨平台工具,可以同时支持小程序、H5、App等多种平台的开发。那么,当使用uni-app开发微信小程序时,怎么进行调试呢?下面就来详细介绍一下。小程序的运行环境分成渲染层和逻辑层,其中WXML模板和WXSS样式工作在渲染层,JS 脚本工作在逻辑层。小程序的渲染层和逻辑层分别由2个线程管理:渲染层的界面使用了WebView进行渲染;逻辑层采用JsCore线程运行JS脚本。原创 2023-05-18 09:54:31 · 1185 阅读 · 0 评论 -
跨平台应用开发进阶(六十二):如何把 uni-app APP项目转换成小程序
随着移动互联网的快速发展,移动应用已成为生活中不可或缺的一部分。与此同时,跨平台开发也得到越来越多的关注,因为它可以提高应用程序的效率并降低开发成本。Uniapp是一种跨平台开发框架,基于Vue.js,并且可以在多个平台如微信小程序、支付宝小程序、H5等上运行。对于开发人员来说,这意味着他们可以使用同一个代码库来构建多个平台的应用,而不需要开发不同的代码库。本文接下来将介绍如何把Uniapp转换成小程序,并提供一些有用的技巧和经验。原创 2023-05-12 11:04:43 · 3200 阅读 · 0 评论 -
跨平台应用开发进阶(六十一):uni-app 跨平台技术开发框架可行性调研
答:uni-app采用Vue作为底层技术栈,为考虑平台兼容性,有些功能本身是H5不支持的,例如APP视频播放的小窗播放功能,需应用原生开发技术栈实现,也可通过插件市场插件实现,不过考虑到插件市场有大部分为个人开发者,插件功能测试充分性未知,插件质量不好保证。答:考虑到APP与小程序在组件和API、样式、事件绑定、数据绑定、路由实现方面的差异性,将APP现有功能搬到小程序,工作量大致为APP的80%。答:取决于插件是否支持源码查看,大部分插件是不支持源码查看的,只支持使用,不支持个性化修改。原创 2023-05-11 15:05:37 · 865 阅读 · 0 评论 -
跨平台应用开发进阶(六十):uniapp 获取设备唯一标识信息
应App个人信息保护与安全要求合规检查要求,需要实现当用户在不同移动终端上进行登录时应向用户进行信息提示或增大鉴别强度。那么,uniapp如何获取手机唯一标识,即使软件卸载重装后也不会变呢?目前实现方案是通过uni-app自带的设备信息获取方法。// 获取设备品牌、型号、设备 id 、系统名称、osVersion const {项目上线后,发现同一用户在升级APP并登录后,收到了登录不同设备的信息提示。通过排查发现是由于获取deviceId不同导致的。deviceId用于获取设备 id。由。原创 2023-03-24 20:19:57 · 15532 阅读 · 10 评论 -
跨平台应用开发进阶(五十九):uni-app实现视屏播放小窗功能
在业务功能开发过程中,需要实现视频直播、播放小窗功能。鉴于目前通过接入火山webSDK实现视频直播、点播功能。需要火山协助配合改造实现小窗功能。uni-app插件市场也提供了若干插件,经试用效果并不友好。画中画悬浮窗(视频) Ba-VideoPip存在以下问题:其他的,例如画中画(全局)、支持为第三方播放器无缝添加、进度同步更新(andorid)原生系统自带播放器、支持为第三方播放器无缝添加画中画(全局) (ios)定价过高,且无任何用户提出使用效果,毕竟不是官方出品,实属不敢使用。原创 2023-04-12 15:17:12 · 1932 阅读 · 0 评论 -
跨平台应用开发进阶(五十八):短链基本工作原理与实现方案
短链就是普通的长链(普通URL网址)经过一定的处理得到的一个简短且唯一的网址字符串。客户端访问短链网址服务器,短链网址服务器返回对应长链地址和302响应码,客户端收到响应后重定向访问长链地址服务器。以访问某平台短链为例:https://eficc.cicconline.com/s/qAE6Uq以上可以很清晰的看到整个短链跳转的过程。这里说一下响应码和响应码: 代表永久重定向,也就是第一次重定向以后就会从浏览器缓存中获取重定向地址,下次直接访问; 代表临时重定向,客户端每次都会重新请求后端获取重定向地址。了原创 2023-04-01 10:35:48 · 1941 阅读 · 0 评论 -
跨平台应用开发进阶(五十七):uni-app 通过 overrideUrlLoading 实现拦截 webview 窗口的 URL 跳转请求
项目需求:通过uni-app的webview嵌入H5页面,且webview的src为互联网页面访问地址,页面中涉及很多可点击链接,若不加限制,则可以在webview中随意跳转至其它外链地址,存在安全合规隐患。原创 2023-03-07 19:58:15 · 1995 阅读 · 0 评论 -
跨平台应用开发进阶(五十六):应用渲染异常问题分析及解决
继前期iOS由于移动设备内存不足导致页面白屏问题之后,(详参博文《跨平台应用开发进阶(五十)uni-app ios web-view嵌套H5项目白屏问题分析及解决》)又发现APP在iOS系统运行过程中,会高频出现页面黑屏、黑色区块,白屏问题。原创 2023-03-06 10:50:32 · 1493 阅读 · 0 评论 -
跨平台应用开发进阶(五十五):uni-app 获取设备信息及 APP 报无相应权限问题分析及解决
APP开发过程中,需要实现分享功能。系统分享组件;uniShare SDK调用;原创 2023-02-16 11:03:23 · 4612 阅读 · 0 评论 -
跨平台应用开发进阶(五十三):uni-app 通过webview方式嵌套H5实现图片点击下载
在项目开发过程中,遇到uni-app通过webview嵌套H5项目,实现H5中图片点击下载的需求。原创 2023-01-12 09:10:58 · 2156 阅读 · 0 评论 -
我的2022跨平台开发之旅暨跨平台APP开发经验总结
对于经常使用APP且技术性敏感的用户,在操作APP过程中,对于一个页面是native App还是hybird App实现,往往一眼就能识别出来谁是网页质感,谁是原生质感,在实际想法开发过程中,项目组在制定产品研发策略时,考虑到开发成本(时间、金钱)和上手难度,Hybrid App成为技术框架首选。因为Hybrid App只需要编写一套代码,便可以同步生成Android和IOS两个平台的APP,甚至能够部分兼容微信公众号和小程序。原创 2023-01-10 10:56:33 · 1081 阅读 · 0 评论 -
跨平台应用开发进阶(五十二):安全合规之Android APP完整性校验机制探究
Android系统开放免费,开发者和用户都趋之若鹜。用户已经习惯了Android应用的这种免费午餐,但背后却隐藏着巨大的安全隐患。在对APP进行渗透测试时,要求提供APP是否具备完整性校验机制,防止被重签名和二次打包(采用混淆、验证签名、服务器端验证等技术防范二次打包等;)注⚠️:APK的唯一标识取决于包名和签名。原创 2018-09-08 16:18:19 · 3890 阅读 · 3 评论 -
跨平台应用开发进阶(五十一):HTML5(富文本内容)连续数字、字母不自动换行问题分析及解决
项目开发过程中,涉及在Web端维护富文本内容,通过APP端查看的相关的功能,功能描述大概如下:通过富文本编辑器添加的内容,通过view展示出来(这里用到了 Vue 的v-html指令)。原创 2022-12-27 16:23:33 · 1782 阅读 · 1 评论 -
跨平台应用开发进阶(五十)uni-app ios web-view嵌套H5项目白屏问题分析及解决
应用uni-app框架开发好APP上架使用过程中,发现应用经过长时间由后台切换至前台时,通过webview方式嵌套的H5页面发生白屏现象。在前端减少内存使用,最重要的就是图片渲染,尤其是大图片。在页面上不要渲染多张大图,比如从摄像头或相册选择多张图,并缩放尺寸渲染在页面上,虽然肉眼看起来手机屏幕上是几张小图,但实际上是多张大图只是被缩小,这种情况非常耗费内存。一张图片3m,9张这样的大图同时渲染到屏幕上,什么手机都受不了。一个缩略图控制在几k或十几k,才是合理的。详情页面展现多张大图并不受影响。原创 2022-12-21 19:42:26 · 9295 阅读 · 0 评论 -
跨平台应用开发进阶(四十九)由环境切换引发的页面通讯机制思考
APP开发完毕,app store上架审核前存在后台晚于APP发布的场景,鉴于APP首页页面渲染依赖于后台接口,且苹果上架审核人员对于页面渲染效果比较苛刻,故制定出应用启动时默认连接生产环境,通过接口查询识别到非发版版本时切换到UAT环境的应对策略。原创 2022-12-11 15:48:41 · 503 阅读 · 0 评论 -
跨平台应用开发进阶(四十七)APP字体库文件处理方案
有时候我们需要让网页加载自定义字体文件,但是通常的字体格式(TTF、OTF)体积太大了,这就需要我们将其转换为更小体积的字体文件格式(WOFF2)。之前我尝试使用类似 CloudConvert 的在线工具去转换 OTF 字体文件,但是不知道为何转换出来的字体损坏了,无法使用。经过多方面研究,现在我找到了一种本地压缩字体可行的方法,因此分享给大家。原创 2022-12-09 10:20:06 · 1077 阅读 · 0 评论 -
跨平台应用开发进阶(四十六)webview方式嵌套H5应用加载慢解决方案
项目中通过方式嵌套H5应用时,出现页面加载慢的用户体验问题。尤其当应用第一次加载H5应用时,页面白屏大致有3-4s!经过分析发现,h5页面第一次加载时会下载页面静态资源(包括图片、字体库文件、css样式文件、js脚本等),后续加载时浏览器引擎在缓存机制的作用下会直接加载缓存信息,渲染较快。老生常谈,从输入URL到页面展示,发生了什么?我们可以在控制台输入 来获取 (FP:文档中任意元素首次渲染时间)和 (FCP:也就是我们常说的白屏时间 )当然了,这两个值也不是固定的,比如在第一次打开页面和第二次原创 2022-12-07 20:33:14 · 5883 阅读 · 0 评论 -
跨平台应用开发进阶(四十八)uni-app自定义组包app:checkReleaseDuplicateClasses问题分析及解决
应用进行自定义基座打包时,发生打包失败,错误提示信息截图如下:项目集成极光时引入的依赖包中的与依赖中引入的json包版本号冲突,导致编译报错。删除极光依赖包目录下的文件。原创 2022-12-07 09:09:07 · 1329 阅读 · 0 评论 -
跨平台应用开发进阶(四十)uni-app自定义插件及引用
正如将可复用功能封装为自定义组件以供他人使用一样,在uni-app开发框架中提供了另一种形式的自定义插件,并可将该插件提交至uni-app插件市场。原创 2022-11-28 14:47:12 · 1892 阅读 · 0 评论 -
跨平台应用开发进阶(四十五)uni-app集成企微客服实战
应用运营过程中,考虑接入企业微信客服功能,大致看了下官方接入文档,并不困难,引入代码量也不大。按照手册来操作即可。原创 2022-11-23 15:09:58 · 1881 阅读 · 0 评论 -
跨平台应用开发进阶(四十四)一文走近应用层抓包工具:Charles
在前期博文《跨平台应用开发进阶(四十三)一文走近网络层抓包工具:WhireShark》中介绍了网络层TCP抓包工具WhireShark,本节介绍应用层抓包工具Charles。Charles具有如下功能:截取Http和Https网络封包。支持重发网络请求,方便后端调试。支持修改网络请求参数。支持网络请求的截获并动态修改。支持模拟慢速网络。Charles提供两种查看封包的视图方式:Structure和Sequence。原创 2016-11-24 22:03:00 · 45556 阅读 · 0 评论 -
跨平台应用开发进阶(四十三)一文走近网络层抓包工具:WhireShark
wireshark是非常流行的网络封包分析软件,功能十分强大。可以截取各种网络封包,显示网络封包的详细信息。使用wireshark的人必须了解网络协议,否则就看不懂wireshark抓包信息。为了安全考虑,wireshark只能查看封包,而不能修改封包的内容或者发送封包。wireshark能获取HTTP,也能获取HTTPS,但是不能解密HTTPS。所以wireshark看不懂HTTPS中的内容。如果是处理HTTP,HTTPS 还是用Fiddler,其他协议比如TCP、UDP 就用wireshark。原创 2022-11-16 19:09:58 · 2314 阅读 · 0 评论 -
跨平台应用开发进阶(四十二)nvue页面设计方案探究
在应用uni-app跨平台设计方案进行app开发过程中,uni-appvue与nvue,不少同学在应用过程中,会搞不清楚两者的区别,而不知如何选择,甚至可能产生错误的应用方式。原创 2022-10-23 10:48:30 · 2032 阅读 · 0 评论 -
跨平台应用开发进阶(四十一)使用Xcode打包 iOS 应用 archive 时四种证书的区别详解
直接运行安装,此种方式一般为开发人员在开发过程中比较快捷的安装测试方式,但是,该方式只可以使用。等第三方平台,进行安装,此种情况下两种证书都可以使用;模式下测试(推送,内购等)没有问题,发布到。多一个可以直接连接真机安装的功能,建议首选。的包在各种功能测试上是一样的,只要。证书,安装测试,确保最终上架到。综上所述:前期开发测试的时候,模式创建证书,后期将要发布到。模式的包,和将来发布到。原创 2022-10-22 17:21:18 · 2081 阅读 · 0 评论 -
跨平台应用开发进阶(三十九)uni-app实现内容分享
APP开发过程中,需要实现分享功能。系统分享组件;uniShare SDK调用;原创 2017-03-20 21:39:56 · 48500 阅读 · 5 评论 -
跨平台应用开发进阶(三十八)uni-app前端监控方案:基调听云APP探究
在前期博文《跨平台应用开发进阶(三十七)uni-app前端监控方案 Sentry 探究》中讲解了Sentry,Sentry是一个开源的实时错误监控的项目,它支持很多端的配置,包括 web 前端、服务器端、移动端及其游戏端。考虑到目前存量产品在用监控方案听云,故弃用Sentry,探究听云应用详情。基调听云App移动应用性能管理产品采用SDK方式实现对App的崩溃、卡顿、超时等性能问题进行采集,并能对真实用户体验数据进行量化分析,实现版本迭代过程中的用户体验优化。原创 2022-10-12 10:12:41 · 2734 阅读 · 0 评论 -
跨平台应用开发进阶(三十七)uni-app前端监控方案 Sentry 探究
在日益发达的网络时代,web应用也是越来越复杂,尤其是前端的开发,也是越来越受重视。前端项目开发完成后,会有一些列的web应用的上线验证,如自测、QA测试、code review 等,以确保应用能在生产上没有事故。但事以愿违,很多时候我们都会接受的客户的一些线上问题,这些问题有时候可能你是自己开发的原因本身存在的问题,这样的问题一般能够在测试环境重现,我们很快的能定位到问题关键位置。但是,很多时候有一些问题,原创 2022-09-30 19:33:15 · 2124 阅读 · 2 评论 -
跨平台应用开发进阶(三十六) :uniapp使用uni.request请求报错{“errMsg“:“request:fail abort statusCode:-1“}的解决办法
在以上前提下还出现这种问题,最有可能的原因:手机没有连网,或者看着连上了网但实际网络不可用,可以在手机浏览器中随便输入点文字搜一下测试看看,能不能搜到新内容。根据服务端接口需要的配置(如:url、data、header、method等)都没有问题。返回值,其实并不是服务端返回来的,因为请求都完全没有到服务端。对网络进行监听,如果监听到当前设备是处于无网络的状态时,就不执行。请求,而是弹出一个弹框或者消息提示,提醒用户:“,因此,导致了后面的业务代码报错。向服务端接口发起请求后,返回值为。原创 2022-09-28 14:44:38 · 13991 阅读 · 0 评论 -
跨平台应用开发进阶(三十五) :Android权限列表permission说明
uni-app开发完APP后,上架到应用市场,审核时会对APP内部设置的权限进行核准,并给出相应的理由。原创 2022-09-27 16:56:01 · 2038 阅读 · 0 评论 -
跨平台应用开发进阶(三十四) :uni-app 应用 Universal Link 实现 iOS 微信分享
传统的微信分享可通过URLScheme实现,具体实现方式详参博文《跨平台应用开发进阶(十六) :uni-app实现URLScheme唤醒APP》,但URL scheme因为是自定义的协议,所以在没有安装 app 的情况下是无法直接打开的(在Safari中还会出现一个不可打开的弹窗),而(通用链接)本身是一个HTTPS链接,所以有更好的兼容性。原创 2022-09-23 22:19:01 · 3691 阅读 · 0 评论 -
跨平台应用开发进阶(三十三) :Android上架准备材料及流程介绍
文章目录一、前言二、安卓端上架应用商店的六步流程三、材料准备一、前言此篇博文主要给大家讲解下安卓端app开发后的上架步骤,及上架前需要准备哪些材料,以便顺利将app上架应用商店。二、安卓端上架应用商店的六步流程首先要注册开发者账号。需要提前把手机号,名字,身份证等等材料准备好。选择软件安装包上传。不同渠道需要准备渠道ID,做好统计。上传成功后,需要填写一些APP的基本信息。这些信息也要提前准备好,有些通用的直接复制即可。上传APP应用的LOGO 。在写软件的关键字标签和原创 2022-08-20 12:40:29 · 1143 阅读 · 0 评论 -
跨平台应用开发进阶(三十二) :AK/SK鉴权原理简介
AK:,⽤于标⽰⽤户;SK:,是⽤户⽤于加密认证字符串和⽤来验证认证字符串的密钥,其中SK必须保密。通过使⽤加密的⽅法来验证某个请求的发送者⾝份。原创 2022-08-19 17:43:01 · 6297 阅读 · 0 评论 -
跨平台应用开发进阶(三十一) :uni-app实现覆盖原生控件导航栏和tabbar全屏弹窗
应用uni-app跨平台框架进行项目开发过程中,需要实现版本更新时全页面弹窗,底部导航栏无法点击的效果。但是,在uni-app中popup弹窗及对话框的遮罩层是覆盖不了原生导航栏和tabbar栏的,而且在tabbar页中使用弹出框会非常的违和。原创 2022-08-19 16:13:23 · 4051 阅读 · 5 评论 -
跨平台应用开发进阶(三十):uni-app 实现集成火山视频直播服务
项目开发进程中,业务提出新需求,需要接入视频直播。为此,开始接触火山引擎视频直播。火山引擎方值负责提供观播SDK,综合考虑现有技术栈,采用集成Web SDK方式,接入观播功能。直播通过企业版腾讯会议方式进行推流操作。..................原创 2022-08-13 19:17:09 · 2703 阅读 · 0 评论