h5就是页面吗,还是微信小程序?

author author     2023-05-12     441

关键词:

hr总是问会不会h5,网上查说h5是html5,但感觉不太对。h5到底是什么,是纯页面html+css+js,还是微信小程序,或者是微信jssdk。

h5就是html5的简称,现在h5还有一个含义,因为很多人不懂h5是什么东西,但是都知道哪些炫酷的邀请函,节日卡等等是用h5技术做出来的,然后很多人就认为这样的页面就叫做h5。
其实h5就是html5, 它是html的升级,它配合css3+javascript可以写出各种各样的炫酷页面。
它是可以基于微信平台的(可以是小程序的形式,可以是公众号的推文等等),也可以基于任何的其他平台,也可以是个人服务器等等。当然现在用得比较多的场景还是基于微信平台的。
而HR问你的会不会H5,一般指的是你会不会写单页面(即用html5+css3+javascript技术开发的页面(主要是 canvas 的熟练使用))
其实H5在我们开发眼里是一种技术,在其他使用者眼里是一种页面
参考技术A HTML5并不是一项技术,而是一个标准。我们在谈论H5的时候,实际包含了html css javacsript canvas websocket 盒模型等前端技术, 也可以理解为H5是前端开发
微信小程序是微信的衍生品, 实际就是提供了微信原生功能的webApi接口, 可以让前端开发者通过JS调用原生的功能, 如拍照, 定位, 语音识别等等, 相对于原生APP开发, 会大大降低开发的成本
参考技术B 小程序和H5的区别是什么
大家知道有一种H5页面,网页。在小程序出来之前,包括现在也有很多的链接,都是点到H5页面的,包括现在的抖音自己的跳转,包括很多的网页调用都是H5页面。那么我们第二个问题就是小程序和H5的区别是什么?小程序和H5的优劣是什么?我们从三点来看。
第一,功能。功能就是三个字叫有没有,就是说有没有这个功能,IOS有的功能小程序有的功能H5有没有?H5有的功能小程序有没有?当然从这一点来看,H5基本上有所有的功能,但是小程序在一些功能上面没有完全的具备,就比如说我们在大家都知道在微信上面用IOS苹果手机是不能用小程序进行知识付费的,也就是说在这一点上面微信和苹果端没有谈拢,所以在苹果的手机上面,微信是不能提供知识付费版的小程序的,购买只能购买实物类,商城只支持实物类的购买,而对于知识付费型是不能的,大家知道为什么吗?这里面简单说就是,苹果对所有的虚拟产品他要去进行抽成的,要抽到分之30。这时候的话就是会导致什么?苹果版的微信的知识付费的课程天然的就要比安卓的课程要贵一点,或者说价钱会前端要学好必须每天坚持学习。为了方便大家的交流学习,也是创建了一个群每天都有分享学习方法和专业老师直播前端课程,这个扣裙首先是132 中间是667 最后是127 前端学习零基础想要学习的同学欢迎加入,如果只是凑热闹就不要来了!!!不一样,其实是苹果的问题,所以我觉得微信想了想说了算了,这一点我们就不做了。
所以在微信小程序上面在苹果系统里面的知识付费是比较欠缺的,这也是为什么前面一段时间得到的CEO罗振宇就整体没有那么重视小程序,而还是重视APP了,因为得到都是知识付费大量的这种虚拟产品,但是小程序是是不支持的,所以他也没办法,所以主力的做自己的APP了。这是功能上有一些区别。
第二,体验。小程序和H5的体验,,功能叫有没有,体验叫好不好。我们说小程序的整体的操作体验要远远大于H5,H5的体验在移动上体验是非常不好的,而且开发难度很大,小程序开发难度也有,但是小程序的匹配跟各个手机这些匹配是很好的。因为每一个超级APP他们已经做好了匹配,你只要匹配好超级APP就行了,而H5它是个脱离APP以及脱离系统级别的,它是网页时代的一个产品,所以他很多的兼容性它需要开发团队自己去调整。
那么H5它需要针对不同型号的手机都要去进行调整,否则有时候点一个网页,在移动客户端体验的时候,有时候点到一个网页一个网站去,大家会发现不同手机的体验相差很多,有的字体特大体验特别不好,为什么?是因为对方的H5网站的程序员没有对你这一款手机进行体验的优化,所以就非常不好,所以他的体验是非常是比起小程序是差非常多的。
第三,区别。我们说入口到底多不多?做小程序有一个很重要的目标是为了获取更多的用户或者说更多的客户。但是如果说入口特别少,或者说超级APP给你开放的入口特别少的话,你的获取客户的效率也低,如果开放的入口越多,你的效率也越高,小程序和H5的入口都很重要。大家看,我们分析其实在这个微信端,小程序和H5的入口都差不多,但是小程序的入口还是多,为什么多?因为可以放H5的地方,二维码上也可以放小程序码,在微信里面可以放H5二维码的地方也可以放小程序码对吧?但是在很多小程序的入口,微信里面提供的小程序的入口,比如说下滑就能看小程序列表,这些地方并没有让你去把你的H5网页也放上去。所以我们结论还是小程序的入口会远远多于H5的入口。
那么我们再来看一下抖音端和头条端,安卓版的抖音上面目前已经有五个小程序的入口了,也就是说在五个场景下用户都能抵达到你的小程序,而如果是H5的话,它只有非常少的个别场景,而且还是需要一定权限的号才能抵达到你的H5的页面,所以也仍然是小程序的入口会远多于H5页面的入口。
上面说的这个也就是说小程序和H5的区别是什么。我们经过比较发现叫除了IOS的知识付费类的小程序应用对用户的体验不是太友好,其实是收费不是太友好,那么其他的都是小程序要完胜。从这个角度来讲也是小程序将是最后解决超级APP上面的二次互动,或者是深度体验的一个必备的利器。

微信小程序h5页面缓存问题处理

参考技术A微信小程序会缓存H5页面,导致页面升级之后不能及时刷新。这种情况通过配置nginx不缓存静态页面无法影响到小程序缓存。假设H5请求地址是https://xxx/h5/用户进入小程序之后生成一个数字,请求H5时把数字拼接到URL后缀... 查看详情

一招解决微信小程序中的h5缓存问题(代码片段)

...中,为了更新代码方便,往往会在小程序中嵌入H5页面。但问题来了,小程序原生代码更新版本后,简单的从微信中删除或者代码强刷就可以解决缓存问题,但小程序中嵌入的H5页面,无论是删除小程序ÿ... 查看详情

微信小程序web-view,嵌入h5页面

参考技术A需求:1、将已开发好的H5页面,嵌入先有的小程序。2、并且要实现H5支付功能解决方式:web-view1、登陆小程序管理后台a.如果是公众号。则进行双向绑定完成这一步,那么基本上就差不多成功了一大半2、在小程序里面... 查看详情

微信小程序web-view,嵌入h5页面

参考技术A需求:1、将已开发好的H5页面,嵌入先有的小程序。2、并且要实现H5支付功能解决方式:web-view1、登陆小程序管理后台a.如果是公众号。则进行双向绑定完成这一步,那么基本上就差不多成功了一大半2、在小程序里面... 查看详情

微信小程序和h5之间互相跳转互相传值(代码片段)

...小程序官方提供了web-view组件来实现微信小程序跳转到H5页面,实现的方式也很简单,具体实现方式如下:1、新建一个页面用来单独存放web-view组件,并且所有的内嵌H5都可以通过这个页面来实现跳转;//web-view&... 查看详情

h5分享微信小程序到朋友圈

参考技术A可以的,可以通过微信提供的分享API接口将H5页面的内容分享到微信小程序的朋友圈中。 查看详情

微信小程序webview内h5多级跳转没有返回键问题

参考技术A我们可以在H5页面使用jssdk中H5页面跳转到小程序页面的方法wx.miniProgram.navigateTo,然后再携带一个url参数 查看详情

微信小程序web-view环境下h5跳转小程序页面方法(代码片段)

web-view页面内的H5页面跳转至小程序页面一般的,web-view组件的src属性指定的H5页面之间,可以正常的采用超级链接a标记对进行页面之间的条转。但是web-view页面要想通过手指触碰返回小程序页面,就无法使用超级链接a... 查看详情

微信小程序webview内页面分享(代码片段)

需求:微信小程序内部使用webview嵌套了h5页面,现在要添加一个新的功能,用户在哪个页面进行了分享,被分享的用户从链接进来就跳转到哪个分享页面。由于webview内部页面无法直接调起小程序的转发,所以为了实现webview中的... 查看详情

微信小程序web-view组件嵌入h5页面导致双导航栏,如何只保留其中一个?(代码片段)

一.前提已知存在一个微信小程序,该小程序的某个页面通过web-view组件嵌套了我们app的一个h5页面,h5页面本身有自己的导航栏,就导致了双导航栏。由于uniapp的web-view组件一定有原生导航栏,pages.js中设置navigationS... 查看详情

为啥微信小程序嵌套h5页面会弹出debugger

我在二级页面嵌套了一个h5的页面,点击跳转进入就直接dedugger了什么都没有操作,请问有遇到过的吗是因为你打开了开发者工具,有些浏览器打开开发者工具时,会显示断点的追问这是在微信开发者平台打开的,而且我现在把... 查看详情

微信小程序可以实现自动登录吗?

...,第一次进入时,判断openid是否存在,不存在保存,存在就是老用户,自动登录参考技术A微信小程序类似后台语言,只能在页面绑定对象,不能动态添加,如果要添加可以先隐藏再显示,列表动态加载,可以先绑定列表,改变... 查看详情

uniapp微信小程序跳转h5后video自动播放

...跳转过来变可以自动播放了。但是需要手动来开启声音。还是不推荐使用,通常处于用户体验,节省流量来考虑的话,一进来还是手动点击才人性化。最好尽量引导手动点击。3.参考https://blog.csdn.net/qq_43628847/article/details/120706080 查看详情

判断h5页面环境在微信中还是小程序中(代码片段)

用小程序提供的wx.miniProgram.getEnv可以获取环境参数<scripttype="text/javascript"src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script><script>varua=navigator.userAgent.toLowerCase();if(ua.m 查看详情

微信小程序web-view与h5通信方式探索(代码片段)

...f0c;同时具有出色的使用体验。需求微信小程序H5混合开发就是在一个小程序中,采用部分小程序原生页面,部分通过Webview内嵌H5页面¹,二者配合实现完整业务逻辑的方案。为什么需要混合开发原生无法满足(例... 查看详情

微信小程序web-view外部引用h5页面调用摄像头录制视频配有提示音(代码片段)

微信小程序web-view外部引用h5页面调用摄像头录制视频配有提示音1、目前的需求是什么2、都踩了那些坑1、小程序2、h5语音提示3、语音合成声音录制不进去,ios有时候是麦克风,有时候是听筒发音!4、语音合成声音录... 查看详情

微信小程序web-view外部引用h5页面调用摄像头录制视频配有提示音(代码片段)

微信小程序web-view外部引用h5页面调用摄像头录制视频配有提示音1、目前的需求是什么2、都踩了那些坑1、小程序2、h5语音提示3、语音合成声音录制不进去,ios有时候是麦克风,有时候是听筒发音!4、语音合成声音录... 查看详情

微信小程序web-view外部引用h5页面调用摄像头录制视频配有提示音(代码片段)

微信小程序web-view外部引用h5页面调用摄像头录制视频配有提示音1、目前的需求是什么2、都踩了那些坑1、小程序2、h5语音提示3、语音合成声音录制不进去,ios有时候是麦克风,有时候是听筒发音!4、语音合成声音录... 查看详情