微信小程序

分类下相关文章

HTTP 状态码 401 与 403 的区别

例如,在调用微信小程序后台服务接口时,如果没有带 token,应该返回 401 状态码还是 403? 容易混淆的名字 英文文档里 401 Unauthorized 403 Forbidden 看上去无法直接分辨两者的差异。 区别 401,是说服务端不知道你是谁。 例如,token 失效,或者 token 缺失,甚至 token 伪造。导致服务端无法识别你的身份,这时会返回 HTTP Status Code 401。客户端此时只能重试。 403,是说虽然服务端已经知道了你是谁,但是你没有权限去访问该数据资源。 例如,你登录成功了,但是你却非要去访问其他人的隐私内容,或者你无权访问的内容。 ...

阅读全文...

微信小程序 WeUI 组件库

WeUI 相对 Vant UI 的优势 WeUI 如果通过 useExtendedLib 扩展库 的方式引入,此时组件将不会计入代码包大小。非常适合对加载速度有要求的小程序。 微信官方组件,风格统一。还支持 dark 模式。 内置的图标丰富 官方维护,稳定性有保证 useExtendedLib 基础库 2.2.1 开始支持,低版本需做兼容处理。 但实际上 2.2.1 对应的微信版本是 18 年的,所以现在都 2020 年了基本不用担心兼容性问题。 WeUI 的特色组件 Slideview:支持左滑删除操作。类似邮件客户端里的左滑邮件,进行删除,标注等操作。 Half Screen D ...

阅读全文...

字节跳动小程序在今日头条 APP 搜素结果的展示

开发者平台 https://microapp.bytedance.com/ 自然搜素 自然结果方面,如果小程序内容能满足用户需求,对应的小程序内容将会被检索并呈现在搜索结果页中,其展示形式与其余 H5 页面一致。 优势:当 H5 页面内容质量与小程序一致时,会优先展示小程序。 搜素结果展示样式: 普通 H5 页面式样 阿拉丁卡片 接入自然搜素的方式: 与 H5 页面 URL 进行映射。好处是能够继承原 H5 的流量,生效快。 sitemap https://microapp.bytedance.com/dev/cn/mini-app/introduction/functional-pl ...

阅读全文...

字节跳动小程序个人账号与企业账号的区别

企业账号独有的权限 获取用户手机号 广告组件。不是很确定,个人开发者无需开具发票,平台按照相关税收法律法规的规定代扣代缴个人所得税 推送功能 某些类型的小程序只有企业账号支持 但是企业账号需要付费 50 元,无耻。 是否真的有信息流导流效果 至少,我看了半天,也没看到一条是小程序的,我非常怀疑做内容类小程序的效果。 但是,隔了几天,在头条顶部的搜索推荐中,点击推荐的搜素词,排名第一的是搜狐小程序的相关新闻。看来,还是有搞头。 ...

阅读全文...

百度小程序相对网站的优势

自然搜素流量优势 小程序优待:同质内容情况下,搜索会优先展现智能小程序页面 百度信息流流量入驻 百度小程序的内容可以入驻百度 app 信息流,这点是我比较看好的。 不能有第三方平台链接跳转,例如点击链接后跳转至其他 app,或引导下载 app。 入驻信息流的小程序,首页、首页首屏点击后的所有跳转页面(电商类小程序此处不限制)以及提交至信息流的素材落地页不能是 h5 页面 然而,不能跳转三方平台,决定了返利模式就走不通了。这样还是有一点局限。 所以,变现模式变成了自有服务的销售,和内置广告的变现。 百度小程序广告 一屏最多只能包含 2 条广告,且广告不能连续出现。 信息流推荐的分发逻辑是 ...

阅读全文...

统计参加人数的小程序

最近发现很多人有在微信或者QQ中,统计参加人数的功能需求。例如: 统计去食堂餐厅就餐的人数 统计参加周末团建的人数 统计周末加班的人数 统计坐车人数 统计上课人数 登记参会人数 等等。 于是我自己开发了一个统计人数的微信小程序,可以在微信中搜索 “报名人数统计” 或者扫描下方小程序码: 花了一个周时间完成了基础功能,正在逐步完善中,也欢迎大家给出建议。 主要功能界面 创建统计活动页面 参加活动页面 查看活动统计页面 功能简单实现起来还是挺耗费时间 本以为两天就能实现的人数统计功能,前后台加起来用了整整一周时间。很多基础性的功能由于没有顺手的基础组件,加上 golang 写小程序后台 ...

阅读全文...

使用 canvas 生成微信小程序分享图片

三方类库 https://github.com/kuckboy1994/mp_canvas_drawer 使用方法 <canvasdrawer painting="{{painting}}" bind:getImage="eventGetImage"/> painting 即需要传入的 json 设置。 但是,为何还需要一个 getImage 的回调呢? getImage 方法是绘图完成之后的回调函数,在 event.detail 中返回绘制完成的图片地址。 推荐阅读一下 github 上的示例代码,特别是 pages/index/inde ...

阅读全文...

微信小程序 scroller-view 组件 bindscrolltolower 事件不触发

bindscrolltolower 事件不触发的原因在于没有设置 height, 因为是用 flex 来进行的布局。 但是需要注意的是,用 height: 100%; 在有的页面有效,有的页面无效。 而用 height: 40em; 则正常触发。 ...

阅读全文...

微信小程序 SEO 优化排名的方法

小程序名称/标题 这个无疑是最重要的。因为在微信中搜索关键词,小程序名称/标题占据了最大的权重。所以,好的名字一定是包含了目标关键词,但是又不能过长,这个需要反复权衡。 小程序介绍中的描述 实际从微信中搜索一个关键词,你会发现,最重要的除了标题,就是对应的介绍。所以,充分利用好介绍非常重要。介绍有 120 个字的限制,一定要精简,把最重要的词塞进去。。。而且一个月可以调整5次,额度足够。 利用好小程序页面内的文字介绍 我觉得这个类似于网站网页的 SEO,微信小程序的爬虫也没有更多的好办法,一定会参考页面的文字描述。所以,以工具类小程序为例,我会将工具的介绍文字写在功能区的下方,方便小程序爬虫来 ...

阅读全文...

微信小程序导入第三方 javascript 库

今天要实现一个微信小程序中将人民币阿拉伯数字转中文大写的功能,github 上有一个开源的实现 https://github.com/cnwhy/nzh 如何将这个三方 javascript 的实现导入微信小程序呢? 微信小程序中引用三方库 首先下载: https://github.com/cnwhy/nzh/blob/master/dist/nzh.cn.js 到项目根目录下的 utils 文件夹中。 然后在对应的 pages js 中使用 require 引入 const nzh = require('../../utils/nzh.cn.js'); console.log(nzh.toM ...

阅读全文...

微信小程序 rich-text 组件限制高度/行数

例如,从后台拉取的题目列表的标题富文本可能过长,在微信小程序前端为了方便用户在一屏内浏览更多的题目,就需要对 rich-text 进行限高。 测试了一下发现在 rich-text 上设置高度 height 无效。 实现方法 在 rich text 组件外层套一层 view,在 view 上设置高度。 wxml 模板: <view class="title_wrapper"> <rich-text nodes="{{ question.title }}"></rich-text> </view> wxs ...

阅读全文...

微信小程序模板 for 循环中 if 判断是否添加 css class

使用场景 微信小程序模板中,for 循环展示一列元素。需要设置一个默认的 active 元素,默认是首个元素。样式上通过添加 active class 进行突出显示效果。 实现方法 利用 js 的三元运算符 <view class="subject {{ cur_index == index ? 'active' : ''}}" wx:for="{{ items }}" wx:for-index="index" wx:for-item="item"> {{ item }} & ...

阅读全文...

微信小程序 token 失效,自动重试机制

在需要用户登录的微信小程序中,需要处理 token 失效的问题。如果每个 wx.request 都去手动处理,非常麻烦。 解决思路 封装微信小程序自带的 wx.request,对返回的 http 状态码及错误码做区分处理。 这里使用 ES6 的 Promise 进行封装。 封装函数写在 app.js 中好,还是独立一个文件 我觉得写在 app.js 中,就挺好,因为以后新项目可以直接复制 app.js 文件。 如果独立一个文件,还需要同时复制 app.js 和另一个文件。 一个实现范例 app.js http: function({url = '', param = {}, type = 'j ...

阅读全文...

微信小程序真机下进入页面时,所有本地图片会闪一下

在小程序开发工具上表现正常,但是在真机上,打开页面的瞬间,image src 为本地图片的会闪一下。 具体表现是,图片会瞬间拉长,然后变为正常。看上去就像闪烁了一下。 原因推测 图片高度无法预先知道。就像 web 浏览器上一样,只有加载完图片才知道对应的高度。 问题的根源就是没设置图片高度属性 Height。 解决方法一 设置 height。rpx 也行,rem 也行,只要设置了 Height 就可以。但是 100% 无效。 解决方法二 在样式文件顶部加上 image { height:auto; } 虽然我想不通为何这个能解决,但确实有效。 ...

阅读全文...

微信小程序 camera 组件全屏显示

想自定义微信小程序 camera 组件的显示,调起摄像头时,为全屏显示。 但是 width 和 height 都设置为 100% 时,实际是无效的。 <camera device-position="back" style="width: 100%; height: 100%;"></camera> 真机测试: 宽度确实是 100% 但是高度只有屏幕的四分之一 解决方法 height 使用 vh <camera device-position="back" style="width: 10 ...

阅读全文...