- 业务域名地址可以访问但是保存不了?
https://www.fylkj.com/WH0BOUAxvR.txt [图片] 做这么久小程序第一次碰到这个问题
2023-07-26 - 导购分销 - 用销售激励,让人一起帮你卖货
详细使用指引可点击这里 导购分销——使用指引 关于导购管理员的功能详尽说明 导购管理员 -- 指引与常见问题 有疑问可在本页面留言咨询 导购分销是什么 导购分销是一个让人可以帮你一起卖货的销售激励能力。 通过添加企业员工、门店导购、渠道经销商等小商店关联角色为导购分销员,设置商品的销售提成来激励分销员线上销售,迅速扩张线上销售额。 [图片] 导购分销能帮助你的小商店做什么 核心效益 利用熟人社交,获取一传十、十传百的流量输入微信号即可添加一个导购分销员,每个导购分销员都有独立的移动端管理工作台,分销员可以查看可推广的商品,并直接分享给自己的微信好友,好友购买后,将呈现对应的提成业绩给该分销员。 同时,小商店店主可添加不同的分销员管理员,交由分销员管理员去添加、管理不同群组的分销员,每个群组内的分销员的总业绩均可分别汇总查看。 激励员工,刺激销售积极性,增加线上销售额方便有员工的企业,实现全员皆销售的数字化管理,无论是门店店员还是其他员工,均可以通过微信号,添加为小商店的导购分销员; 同时支持通过不同梯度等级提成模版的设置,激励员工通过提升销售业绩获取更高的提成比例。添加为导购销售员的员工与管理者,均可实时看到当前的业绩,与应该结算的提成金额,管理者可以按照设定时间导出每个导购分销员的业绩 赋能现有渠道商,数字化管理与对账添加渠道合作伙伴的微信号为导购分销员、或者导购分销管理员,为不同的合作伙伴设置不同的等级提成模版,渠道销售伙伴的线上销售额将会实时呈现给你与你的合作伙伴,方便进行数字化管理与对账。 导购分销的主要功能简介 你是店主或者店铺运营者 谁可以成为你店里的导购分销员? 人数有没有限制? 导购分销员的添加与管理店长可以添加导购管理员,导购管理员可以添加导购分销员。 * 店长在PC后台,店铺管理->成员管理,可添加导购管理员,仅有导购管理员权限的店铺成员,将仅能管理导购,而看不到店铺后台其他信息。 可设置经销商、门店店长、代理等合作伙伴为导购管理员。 [图片] 导购管理员,添加为小商店的分销员(通过微信号)。 支持通过excel文件批量添加。 [图片] 单个小商店,最多可添加N名导购管理员:N = 200个 单个小商店,单个导购管理员,最多可添加N名导购分销:N = 500名 (可以删除,删除后的不在这个域里面) 单个微信用户最多可以绑定成为N个小商店的导购分销:N = 50个 导购分销员需要做什么,提成才会作效?与分销员的绑定有效期是可以调整的吗? 分销员的客户关系设置 导购分销员需要通过分享商品给用户,引导用户到你的小商店购买,用户通过导购分销员分享的海报进入小商店直接下单,该笔订单将按照分佣比例在结算时间结算给该分销员。(目前需要商家按照数额线下结算给分销员) 在客户关系有效期内,客户自行搜索,或者从最近访问的小程序中访问了该小商店,购买了推广商品,也将结算给最后触达(用户通过分享进入小商店)的导购分销员。 商家可以自行按需选择分销员与客户的有效期。 [图片] 什么时候会将提成结算给分销员? 业绩计算与管理 商家可以在添加导购分销员的设置, 按照需要自行选择结算给导购分销员的时间。 [图片] 目前支持两种结算模式 平台自动结算线下手动打款[图片] 商家若配置为自动结算模式,则在配置的结算时间,提成金额将会打款到导购的微信零钱账户。(该导购的微信账户需要实名认证,才可打款成功) [图片] 若本身配置为线下手动结算,后调整为自动结算,则结算方式在调整后的下一笔订单生效,提成将会自动打款至该导购的微信零钱账户。但是调整之前的线下手动结算订单,仍需商家与导购自行结算。 谁可以看到分销员的业绩? 该导购的管理员以及小商店的超级管理员(店长)可以看到该导购分销员的业绩,比如A1导购分销员属于B导购管理员,A2导购分销员属于C 导购管理员,C只能看到A2业绩,不能看到A1的。方便商家区分不同渠道商、门店,让渠道商与门店自行管理终端分销人员。 仅有超级管理员可以看到下图全局视角(不同导购管理员分别的销售业绩之和)。 [图片] 每个导购管理员(门店/渠道),仅可查看自己管理的导购的业绩。 [图片] 不同商品,如何设置提成比例? --推广商品管理与提成设置 商家可从小商店中在架的商品中,选择部分商品,加入推广商品库,加入推广商品库的商品。 * 仅店长有权限管理推广商品,导购管理员无权管理推广商品 [图片] 商家可以为商品设置推广提成比例 支持2种模式设置比例—— 1、按照等级比例 该商品的提成比例将由导购分销员所在等级的提成比例决定(也就是2个不同提成模版、不同等级的分销员,卖出一个商品,拿到的提成会不同)。适合需要通过激励形式鼓励销售员卖更多本店商品的商家。 2、按照固定比例 该商品无论谁卖,都是一个比例。适合特殊价格商品。 [图片] 商家设置完推广商品后,导购分销员可登录移动端,查看自己可以推广的商品和对应的提成。 [图片] [图片] 如何能激励分销员卖出更多商品? --阶梯等级提成 如果一个导购分销员,知道自己再卖出20件后,每件商品的提成比例会由原来的5%,翻倍变成10%,那么按照目前的销售量,到手的提成也会变多,他将更有动力去完成一开始那20件的商品销售。 合理的设置阶梯的等级提成,将有效提升店铺销售量。 支持按照销售金额/销售笔数2种模式去设置分销员的升级衡量标准,比如客单价比较大的商家(家电、数码等),可按照销售笔数去评估导购分销员的等级,设置比如销售20笔,即可晋级的标准。 客单价较小的,比如食品饮料商家,可按照销售金额,去评估,比如总销售1000元,可晋级下一等级。 [图片] 同时,支持商家设置不同的提成模版,给到各个导购管理员,让他们适用于每个门店/渠道商。 比如大的渠道商,给到一个更大的提成比例区间的模版。 店长可以给导购管理员分配提成模版(导购管理员不可新增和修改提成模版) [图片] 每个导购分销员,最终将仅会关联到一个提成模版中的一个等级。 导购管理员添加导购的时候,可以从导购管理员给他分配的提成模版中,选择一个分配给该导购。 [图片] 你的导购分销员 导购分销员怎么分享商品给用户? --商品推广 已经被添加为导购分销员的个人,将可以搜索「小商店助手」,进入导购分销模块查看管理 [图片][图片] 通过导购分销员的首页,可以进入推广商品模块。 [图片] 这里呈现的商品将是商家在后台设置的推广商品。 分享方式支持 1、 图文分享,复制带参链接 [图片] 2、 复制小程序路径链接(可在公众号或其他小程序配置本页面) [图片] 3、 分享海报 (适合分享到朋友圈,或者制作线下物料) [图片] 4、 直接点击进入小程序,分享该商品页面 (用户可在会话列表中直接点击进入小商店购买,缩短进入小商店路径) 同时,导购分销员也可以点击商品列表中的商品,直接进入小商店的该商品页面,直接分享小商店的页面(这类方式分享也将计算佣金)。 [图片] 4、 导购的视频号视频下方,扩展链接 [图片] 5、 导购的视频号直播间 你的导购在他自己的视频号可挂你的小商店,也可直播卖你店的货,卖货后,推广商品将同样记佣给该导购。 1. 导购进入自己的视频号(需先开通视频号) 2. 进入视频号账号管理 [图片] 3. 设置关联小商店 [图片] 4. 导购选择小商店关联,若该导购有多个小商店,则需选择它所在的企业店进行关联 [图片] 5. 导购开始视频号直播,上架推广商品(仅销售推广商品会记佣) [图片] 针对不同客户,分销员怎么识别出更加有意向下单的客户? -- 导购分销员员客户管理 导购分销员可以看到已经访问过自己链接的客户,以及部分每个客户的消费行为 [图片]
2022-04-13 - 公众号快速注册并认证小程序
为方便公众号/服务号快捷接入小程序,并在各功能中使用小程序的服务,上线复用公众号/服务号资质注册小程序流程。快速注册认证小程序,境内非个人主体小程序无需重新提交主体材料、无需对公打款、无需支付300元认证费用。境外主体小程序无须重复提交主体材料对小程序认证,无需支付99美元认证费用。 条件:1、境内主体:已认证的企业、媒体、政府、其他组织类型的公众号/服务号(包括企业和个体工商户); 2、境外主体:已认证的服务号(包括境外主体的企业和政府机构)。 限制:1、境内主体非个体工商户类型(企业、媒体、政府、其他组织类型)公众号或服务号一个月可以复用资质注册5个小程序,个体户一个月可以复用资质注册1个小程序; 2、境外主体服务号一个月可以复用资质注册5个小程序。 开通入口: 登录公众号/服务号后台->小程序管理->添加->快速注册并认证小程序 相关规则: 1、复用资质创建的小程序默认与该公众号/服务号关联; 2、复用资质创建的小程序默认关联该公众号/服务号,不占一个月新增关联13个小程序的限制; 3、复用资质创建的小程序默认关联公众号/服务号,不下发模板消息,不默认出现在公众号/服务号资料页; 4、一个公众号/服务号若存在“待完成注册”的小程序,不可发起复用资质创建小程序; 5、一个公众号/服务号一个月内可复用资质注册小程序不多于5个。(创建成功才占用); 6、使用复用公众号/服务号资质注册小程序,将以本公众号/服务号的主体作为该小程序的开发者,可选择以本公众号/服务号运营者作为该小程序的管理员; 7、若选择了复用认证资质,则小程序完成注册后即是“已认证”状态; 8、若选择了复用认证资质,小程序初始认证有效期与公众号/服务号认证有效期一致,后续小程序认证年审需要在小程序后台独立申请。 创建流程: 第一步:登录公众号/服务号后台->小程序管理->添加->快速注册并认证小程序 [图片] 第二步:同意协议 [图片] 第三步:管理员扫码验证 [图片] 第四步:勾需要选快速创建小程序的资质 [图片] 注:复用微信认证资质不需要再次支付认证审核服务费,也不需要审核。 如不复用运营者信息,后续登录小程序时需绑定管理员 第五步:填写小程序账号信息 [图片] 注:邮箱需要是未绑定任何个人微信、公众号、服务号、小程序、微信开放平台的邮箱。 第六步:邮件激活小程序账号,激活完成后即可使用邮箱账号密码登录小程序。 [图片] 第七步:绑定小程序管理员 [图片] 注:绑定管理员,如果有在第四步有勾选复用运营者信息。最终以绑定管理员信息为准。 以上注册流程创建的小程序,不用再走小额打款验证主体。生成的账号具有独立的邮箱账号、密码,跟走正常注册流程注册的小程序具有一样的能力权限。
07-30 - 小程序的技术是怎么发展的啊?
老师要求研究技术发展,我怎么找都找不到啊
2022-03-15 - 来自海拉鲁的社区常见问题汇总(不定时更新)
1、微信服务号第一次进页面正常,手动刷新当前页面就404了 问题链接:https://developers.weixin.qq.com/community/develop/doc/000c2cba014b6816a4a9d97a555400 经了解到项目中使用了vue-router 的 history 模式,项目在本地yarn serve运行时访问二级页面,再刷新是问题的,yarn build后, 放到nginx里运行,再刷新就404了,主要原因是路由的路径资源并不是一个真实的路径,所以无法找到具体的文件。 s: https://router.vuejs.org/zh/guide/essentials/historymode.html 使用前先看说明,官方提供了一些配置例子,大家可以参考参考 2、wx:for循环打印的数据添加进去了却不循环? 问题链接:https:/developers.weixin.qq.com/community/develop/doc/00080a499b85c03bafa9e3b325b400 这位同学修改数值,没有调用this.setData触发视图更新,原因在于开发前没看文档 ps:https://developers.weixin.qq.com/miniprogram/dev/reference/wxml/data.html 数据绑定 3、这是接口问题吗?怎么解决? 问题链接:https://developers.weixin.qq.com/community/develop/doc/00040ae531c710caaea9c551456400 这位同学想调用逆地址解析接口,无奈粗心打印调成了地理编码接口 ps: https://lbs.qq.com/webservice_v1/guide-gcoder.html 腾讯位置服务逆地址解析 4、小程序如何获取好友列表? 问题链接:https://developers.weixin.qq.com/community/develop/doc/000cc82a9a00e09e78a9bcffe51c00 有类似需求的同学就不用想了,不可能提供,我在此:噗哈哈哈 5、我把自己的本地数据复制到另一小程序中就出错? 问题链接:https:/developers.weixin.qq.com/community/develop/doc/000c6ef50b0bb8bf59a98242c5b400 经过私聊该同学,代码写的少,碰见问题不会排查,错误出现在路径问题上,对于路径问题,有个笨办法,就是在/show/show 前面加..或/,一个一个加,加到能位置,不必研究目录关系。 6、微信小程序步数返还的时间戳为什么返回的全是1970? 问题链接:https://developers.weixin.qq.com/community/develop/doc/000caa9effce70ca5ea93371f5bc00 微信步数或者其它的API的时间戳字段没有写明是秒还是毫秒,碰到该类问题,大家先看看时间戳的长度判断是秒还是毫秒。该问题反馈给华哥了 7、picker多项选择器 循环渲染修改另外一个第一行 另外一个第二项数据会变化 问题链接:https://developers.weixin.qq.com/community/develop/doc/000026e420c9e89755a984fb856c00 https://developers.weixin.qq.com/community/develop/doc/0002c846538448b037a908c3951800 该问题对象复制的问题,还有的同学反馈console.log()打印出来的结果和展开的结果不一致问题,console.log打印出来的只是快照, 展开才是实际内容。 s: 可参考《javascript高级程序设计》第三版68页 基本类型和引用类型的值 8、为什么有的部分参数传不过去然后显示undefined? 问题链接:https:/developers.weixin.qq.com/community/develop/doc/0004626abb4b28eabf9988b4c56000 这位同学data-* 命名不规范有大写字母,所以没获取到值。此类传参问题,还有变量和等于之间多了个空格,眼神不好的,真以为代码没问题。 ps: 参考文章 https://developers.weixin.qq.com/community/develop/article/doc/0080aa5b441d81eb499a954056c13 9、wx.request() post请求中,data中的参数的封装? 问题链接:https//developers.weixin.qq.com/community/develop/doc/00048ac54e81e03474b95166c51000 10、大家调用安全检测接口有提示敏感词没? 问题链接:https://developers.weixin.qq.com/community/develop/doc/00040e0f33c5083bd5b976f1751800 该问题是调用文本安全检测不成功 不少同学都卡在这块了,本人不喜欢php,所以没有列出php的代码,也不想会,噗。以下列举java、nodejs、python2、云调用的调用代码 nodejs request库 (yarn add request) [图片] java okhttp库 [图片] [图片] [图片] linux环境的 python2 requests库 (pip install requests) [图片] [图片] 云调用示例: [图片][图片] 11、导入数据,这样的json格子哪里不对吗? 问题链接:https://developers.weixin.qq.com/community/develop/doc/0002a6973348e0396fc9aa61b52800 云开发数据库导入json数据,其实是{"name": "binnie", "age": 18}{"name": "binnie", "age": 18} 这种格式, 外层没有[],并且{}之间没有逗号,也算是新手容易犯的错误吧
2020-01-18 - 如何提单“公众平台”腾讯客服?
第一步:用手机打开微信 在微信首页的顶部“发现搜索按钮”(如图1.1)->搜索“腾讯客服”,打开“腾讯客服”小程序(如图1.2) 图1.1: [图片] 图1.2: [图片] 第二步:进入“腾讯客服”小程序,点击相应的“标签”进行跳转 在顶部tab,点击“其他”(如图2.1)->点击“更多其他问题”(如图2.1)->点击“公众平台”(如图2.2)->点击底部的“提交问题”(如图2.3) 图2.1: [图片] 图2.2 :[图片] 图2.3:[图片] 第三步:点击“提交问题”,跳转到编辑页面。 选择“问题类型”(如图3.1)->对应的选项进行填写(如图3.2) 图3.1:[图片] 图3.2:[图片]
2021-02-25 - 小程序是否支持发红包
满足条件的商户可在产品中心找到小程序红包入口,商户自主开通
2021-03-17 - 微信公众平台用户信息相关接口调整公告
微信公众平台为开发者提供了用户授权登录功能及相关接口,以便开发者为用户提供便捷的使用体验。 根据相关法律法规,为进一步规范开发者调用用户信息相关接口或功能,保障用户合法权益,平台将对用户信息相关功能及接口进行调整,具体如下: 一、相关接口调整: 1、小程序与小游戏获取用户信息相关接口:不再返回用户性别及地区信息; 能力参考:小程序用户信息 、小游戏用户信息; 2、 公众号用户信息获取接口:不再返回用户性别及地区信息; 能力参考:公众号用户信息; 3、 Open平台授权接口:包括App授权登录、公众号H5授权登录、网站扫码授权登录,不再返回用户性别及地区信息; 能力参考:移动应用、网站应用、第三方平台; 本次改造调整生效后,所述涉及字段返回值将按如下规则生效: [图片] *注:字段名均保持不变,小程序与小游戏获取用户信息接口“用户性别”字段名为gender;Open 平台授权接口“用户性别”字段名为 sex 二、相关功能调整: 1、 公众号个性化菜单功能:不再提供基于性别/地区设置个性化菜单的能力; 能力参考:个性化菜单接口; 2、公众号后台粉丝列表:粉丝列表等不再展示用户的性别信息; 涉及功能页面:公众平台帐号管理后台-用户管理/留言管理/赞赏/视频弹幕/消息; 3、服务号粉丝列表筛选:不再提供基于地区筛选粉丝的能力; 涉及功能页面:公众平台帐号管理后台-对话能力-客户管理。 平台预计10月20日完成调整,请开发者及时进行调整适配,避免影响相关服务及用户体验。 微信团队 2021年09月26日
2023-09-26 - 20w人观看,现场竞拍!视频号直播带货又有新玩法
一张方桌,一副笔墨纸砚,一位穿着中式的博主现场挥墨创作,直播间弹幕区不时弹出“好看”“漂亮”的评论,在视频号这样一场书画直播吸引近20万用户观看。 随着视频号直播功能愈加完善,越来越多拥有一技之长的人入局其中,他们有书法家、有画家,观看他们的直播,你也会有一种想挥墨或画画的冲动。 [图片] 一场书法直播近20万人观看 通过友望数据,我们发现近期不少艺术博主在视频号直播,他们的账号名称通常有“书画”“字画”“艺术”“绘画”等字,比如清枫书画双雅字画子非鱼手绘,让用户通过名字就可以了解该账号大致的直播内容。 [图片] [图片] △ 截图来源:友望数据-直播带货榜 这类直播内容展示了博主现场创作、教学的过程,比如搞艺术的阿妹,在直播中教用户基础素描的技巧及原理性的内容,比如具有空间感的水滴、眼睛怎么画等等,直播展示了绘画的每一步,用户可以一边看直播一边跟着学作画。 [图片] 直播间用户互动也比较强,许多用户在弹幕区留言评论,咨询问题,阿妹也会一一耐心回答。 阿妹也会在直播间积极与用户互动,比如欢迎每一个到直播间的新用户,并喊出用户的名称,让用户有一种被重视的感觉。当许多用户是第一次来直播间时,阿妹也会回顾上次直播的教学内容。 干货满满具有实用性的直播内容吸引不少用户观看,在【友望数据】-【直播记录】中可以看到,该账号近60天34场直播场均观看人数达到了1.89万。其中有20场直播观看人数1万以上,最高一场直播观看人数近8万。 [图片] △ 截图来源:友望数据-直播记录 比起生活、情感,艺术领域的用户群体相对来说比较狭窄,比如书法,在过去或许仅限于书法爱好者,而直播的出现则很好的将书法推向更广泛大众的人群。 蒋占红直播间展现了书法家臧伦勤书法创作的过程,虽然与其他热门直播间相比,书法直播略显枯燥乏味,但仍旧吸引不少用户观看。在【友望数据】-【直播记录】中可以看到该账号近90天场均观看人数近6万,最高一场直播观看人数近20万。 [图片] △ 截图来源:友望数据-直播记录 清枫书画同样也是直播书法家提笔挥墨的过程,古老的书法艺术加上古典悠扬的古筝音乐,将直播间艺术氛围拉满,不少用户称赞“漂亮”写的不错"。直播中,书法家一般只负责创作,由幕后工作人员进行解说,并为用户答疑解惑。 书画直播为何会吸引?我们分析了以下几点: (1)博主视频号直播热情高涨 相比于已经成熟且竞争激励的抖快直播带货平台,视频号直播还在完善优化中,且背靠微信巨大体量蕴藏的无限可能吸引越来越多艺术博主在视频号直播。 通过【友望数据】-【直播日历】可以发现许多艺术博主直播频率较高,比如蒋占红,在2月几乎每天都有直播,有时一天直播2场。高频直播可以辐射更多人群。 [图片] △ 截图来源:友望数据-直播日历 (2)直播内容与视频号用户契合 相比于抖音,视频号用户群体年龄偏大,对艺术文化类这种可读性强具有收藏价值的内容或许会更感兴趣。 另外,这类群体对书画作品也具有一定的消费能力,且在艺术领域,用户黏性较强,具有一定的重复消费性,一旦认准,就会再次购买。 (3)设置福袋福利 不少博主在直播中设置福袋福利来活跃直播间气氛,延长用户直播间存留时间,比如搞艺术的阿妹,在开播不久后,就会设置现金红包,并需要在直播间留言才可以参与。 [图片] △ 直播福袋 截图来源:友望数据-直播监控 清枫书画的福袋则要求用户关注视频号并留言,中奖用户可免费获赠一幅书法家的墨宝,包邮到家。 [图片] (4)拉近艺术与用户的距离 艺术作为一个小众化的领域,对普罗大众来说,日常生活当中比较少有机会接触到。 而通过直播,用户就可以沉浸式观摩博主艺术创作的全过程,满足好奇心的同时也可以学习干货知识。 [图片] 一场直播带货14万+ 直播的尽头是直播带货,艺术类直播也是如此。早期,书画作品购买途径主要有书画店、拍卖会、画廊等通过线下方式购买。随着互联网发展,用户可通过网络购买,更加便捷方便,而如今直播带货的大火更进一步拓宽了书画作品的销售渠道。 通过【友望数据】-【直播记录】我们可以发现许多艺术博主几乎每一场直播都会带货,比如双雅字画31场直播中有29场直播带货,带货产品主要为书法作品。 [图片] △ 直播带货书画商品 截图来源:友望数据-直播概况 清枫书画直播带货形式比较多样,书法家现场创作,用户看到满意的作品可在直播间下单购买。此外,主播也在直播间强调用户可现场定制。 书法创作结束后,该主播还会在直播间竞拍绘画作品,比如一幅画从多少价格起拍,价高者得,这种带货方式也吸引不少用户在直播间竞拍。 [图片] 课程是许多艺术博主带货的主要产品。 观鱼书画1月25日在视频号直播“观鱼书画-新春福利年会”,在这场时长四个半小时的直播中,多位书画家现场创作,并设置多个福袋,这场直播预估销售额达到了14.23万。 通过【友望数据】-【直播概况】可以发现这场直播热销产品是价值9.9元的零基础学传统国画体验课,其次是国画高阶课。性价比高的课程产品更容易让用户心动。 [图片] △ 带货绘画课程 截图来源:友望数据-直播概况 搞艺术的阿妹通过直播向用户展示阿妹绘画上的专业性,且在直播中我们了解到阿妹清华美院毕业,当有用户对素描感兴趣时,小助理会引导用户报名阿妹老师的绘画培训课程。 此外,阿妹也会在直播中展示培训班上的学员作品,来打消用户对课程是否有效果的顾虑,提高用户对阿妹的信任。 阿妹在直播中所使用的绘画道具也是他们带货的产品。比如观看直播中,我们发现不少用户对其所用的绘画工具感兴趣,画笔、工具套装等等,小助理就会提醒用户可直接在直播间购买。 在【友望数据】- 【直播带货分析】可以发现近30天该账号直播带货最热销商品是“阿妹老师素描入门工具套装”。 [图片] △ 近30天热销商品 截图来源:友望数据-直播带货分析 除了直播带货,搞艺术的阿妹也会在视频中关联购物车来带货变现。通过【友望数据】-【博主动态】可以发现该账号近30天发布18条作品,平均点赞3.96万,每条作品博主都会挂上购物车链接,视频的高曝光也有助于提高商品的浏览量,触达更多消费人群。 [图片] △关联商品的视频 截图来源:友望数据-博主动态 直播带货让书画作品得以在公共领域传播,跨越地域限制与用户“面对面交流”,也让书画家们得到更多的认可,增加人气的同时,也可以挖掘有购买意愿的潜在用户,增加收益。 [图片] 视频号助力艺术文化“破圈” 自视频号直播上线以来,直播功能一直在更新优化,即使2022年开年以来更新的脚步也从未停过,随着越来越多人涌入视频号直播赛道,直播内容也愈加丰富。 除了以上所述的书画直播内容,还有插花、印章篆刻,比如龚先生插花花艺培训,该账号直播内容为现场插画教学,用户可以在直播中学习插花知识和技法。观看龚老师插花作品后,不少用户直呼“好看”。该账号场均观看人数1万+,最高一场直播带货1万+。 还有一些传统手艺人通过视频号传播传统艺术文化,比如银匠雪儿,作为“银饰锻造”非遗继承者,通过视频号传播畲族银饰文化,拉近用户与非遗的距离,并通过视频号直播让畲族银饰走进千家万户。 [图片] 视频号的出现让拥有一技之长的人有了一个展示自己的平台,并通过这个平台寻求更多变现出口,同时,也让更多人可以近距离了解艺术创作、知识。 特别在传统艺术文化上,比如书法、非遗等,借由短视频新兴媒介进行传播,助力传统艺术文化“破圈”。 在推广艺术文化上,视频号也推出有针对性的活动,比如“春天里的艺术”“艺术直播周”等,激励博主创作优质的艺术内容及直播。 随着视频号愈加成熟,未来或许将会有更多艺术博主、手艺人加入其中。
2022-03-09 - 一种优雅的用户授权方式解读
一种优雅的用户授权方式解读 1 [图片] 2 [图片] 3 [图片] 4 [图片] 5 [图片] 6 一种优雅的用户授权方式解读 我在之前写过类似的文字,没想到我今天也实现了这种极致优雅的授权分享,马上忍不住想分享给大家参考 特色 就是将用户授权和手机号授权结合在一起,让整个授权逻辑非常有顺序性 这样用户就不会出现我怎么刚授权了,又让授权的困惑
2022-03-09 - 小程序按名称搜索找不到,已允许通过名称搜索,什么问题?
小程序全称:鱼塘到店 appid:wx7acacc700852de4e 已经发布上线有1个月了,也开启了允许名称搜索, 按小程序名称搜索不到,烦请官方给看下
2022-03-08 - 小程序AR图像追踪源码正式开放使用!
AR技术能够在现实的基础上构建出无限的虚拟世界,让艺术家们的画布在现实中也能得到无限延伸,为艺术作品的创作与展示带来了新的思路。 我们在全球范围内不乏看到一些知名的数字艺术家尝试使用AR作为其艺术作品的展示载体。 [图片] Kivisense在过去的两年中也尝试与不同的海外艺术家合作,让他们的创意脑洞通过AR入侵现实 [图片] 为了让更多从事艺术相关行业的小伙伴能够使用AR进行创作,kivicube特别推出AR实境壁画模版案例供大家使用! 本次AR实境壁画模版我们使用了白俄罗斯艺术家Key Detail的壁画作品《太阳女神》作为落地案例给大家具体展开一下,如何使用模版制作一个AR数字壁画内容。让用户无论是否亲临现场都能体验该艺术作品相关的AR互动,了解作品背后的故事。 [视频] AR实境壁画模版功能介绍与使用流程 那么现在我们就来具体展开一下,简单教大家如何使用AR实境壁画模版完成同款场景的制作。同时欢迎关注弥知科技公众号后台回复“女神”获取本次互动详细教程与源码示例 (一)素材准备 我们首先使用了快手绘图工具Procreate对比实拍壁画照片分层绘制了该壁画的原画,并使用AE让太阳女神的衣服,表情能够动起来,头上的太阳神鸟环绕女神徐徐飞出。 [图片] 附一段KIVISENSE设计大大们的制作过程 另外在本次教程素材的制作过程中我们还发现了非常多的对设计师甚至小白用户都非常友好的宝藏软件,能够帮助用户优化AR项目视觉与模型动画等多方面的体验。后续有机会我们会持续迭代相关的教程,大家敬请期待。 (二)AR制作 本次太阳女神AR教程分为入门与高级两个版本: 入门教程:只需要用户使用Kivicube编辑器无需编程即可制作好AR场景,并在Web端与小程序端体验 高级教程:高级教程会用到我们提供的开箱即用代码,Kivicube小程序AR插件进行二次自定义开发,可以制作更加丰富的体验 01 入门教程 我们考虑到很多用户在实际体验中无法亲临现场,在整个AR体验上分成了线上与线下两个部分 对于线上未能到现场的用户我们准备了AR趣味滤镜互动,用户打开摄像头即可与太阳神鸟主题滤镜合拍。 [图片] 而亲临现场的用户则能直接扫描壁画,即可看到壁画上的太阳女神微微一笑,神态安详,太阳神鸟从壁画中飞入现实。 [图片] 以上提到的所有AR互动内容,通过Kivicube AR在线制作平台即可完成所有制作!除此之外,我们秉承着“没有好素材就没有好的AR场景”的观点,将从识别图处理、视频素材制作规范以及AR相框制作注意事项等等所有与设计、素材制作相关的细节规范在详细教程中进行具体说明。 02 高级教程 在介绍高级教程之前,我们首先要跟大家公布一个好消息:Kivicube小程序AR原生图像追踪正式免费开放测试了!并且在本次AR实境壁画的高级教程中我们马上就会实际使用使用到这个功能! 有代码基础又对我们平台图像追踪功能非常感兴趣的Kivicube用户们一定不要错过! [图片] 那么现在我们就来看一看,高级教程中都包含了哪些值得期待的内容: 开箱即用的源码示例,手把手教你做AR 我们从过去几年的AR商业项目中分析提取了其中使用范围最广的一套小程序AR插件示例,让开发者不仅能够将AR场景直接接入自己的小程序,并在此基础上实现: UI/UX的自定义开发—开发者可根据项目的需要实现对UI/UX的自定义,例如示例中帮助用户了解艺术作品而添加的「作品详情」按钮等AR流程引导提示—我们提供一整套AR流程引导模版,让开发者与设计都无需再花太多精力研究AR场景中的用户体验。在本次示例中,包括扫描引导、安全提示在内的多项流程都可供大家使用自定义拍照—允许用户自定义相框设计,添加体验二维码等,生成更符合项目需求的拍照海报 支持H5接入AR功能,助力传统H5玩法升级 在kivicube正式上线的两年中我们接到了很多开发者关于kivicube场景接入H5的需求反馈。在本次的AR画布高级教程中,我们正式开放了两种不同的H5接入模式供开发者选择: 通过iframe嵌入—用户可通过iframe嵌入的方式,将Kivicube在线制作平台制作好的AR场景直接与自己已有的H5完成融合。通过跳转小程序体验—如果kivicube在线编辑器中的功能没有完全满足商业项目的需求,我们也支持用户直接使用kivicube小程序AR插件进行二次开发,并且无缝嵌入已有的H5中! 经过以上教程的一系列操作,我们就能成功使用AR实境壁画示例作出一个太阳女神AR艺术展示场景啦!不能到壁画现场打卡的小伙伴,可以扫描下方识别图直接体验AR效果哦 [图片] 期待AR实境壁画示例能更大程度的降低Kivicube用户的AR制作门槛,帮助大家的创意脑洞尽快落地。同时对Kivicube目前的功能有任何的建议,欢迎直接与我们沟通! 关于弥知 专注于AR(增强现实)原创技术研发,是国内领先的AR整体解决方案服务商 旗下国内首个WebXR在线制作平台KIVICUBE,帮助用户通过可视化编辑,零基础即可制作出交互丰富的AR商业场景,并一键发布至小程序、公众号与微博等多个平台 [图片]
2022-03-07 - 微信小商店推荐官下线了?
微信小商店推荐官功能是没了吗?这个功能太重要了,请问是永久下线了,还是说会完善升级之后重新上线?求解答
2022-03-06 - 小程序搜索优化调整(SEO)公告
各位开发者: 微信 8.0.14 起,通过 “首页-下拉-搜索小程序”、“发现-小程序-搜索小程序”等小程序搜索入口将不再展示小程序页面的内容结果。开发者通过搜索爬虫 SEO 获取到的流量将有所下滑。 例如,下图高亮部分,由小程序页面中的内容匹配到的搜索结果将不再展示。 [图片] 微信团队 2021 年 10 月 08 日
2021-10-12 - 求助:小程序无法登录,想要注销或者解绑,该如何操作?
公众平台助手上有显示绑定的小程序,ID:gh_7d00ecf784eb。但是无法登陆,也无法解除绑定。现在想要注销或者解除这个小程序,该怎么操作?[图片]
2022-03-05 - 刷题小程序开通会员的正确姿势
刷题小程序开通会员的正确姿势 ~ [图片] 很多刷题小程序都不是免费开放的,而是需要成为会员,正常而言付费就可以 但是鉴于苹果手机虚拟支付问题的存在, 所以如何照顾这部分用户是一个值得考虑的问题 ~ [图片] ~ [图片] ~ [图片] ~ [图片] ~ 通过上图我们可以看到成为会员有二种方式 1)在线付费 2)激活码 但是在苹果手机应该隐藏方式1,否则的话会受到微信方面的阶梯惩罚处理~ 合规运营一直是我们的底线 [图片]
2022-03-04 - 小程序用户信息相关接口调整公告
为进一步规范开发者调用用户信息相关接口或功能,提升用户体验,平台将对部分用户信息相关功能及接口进行调整,具体如下: 访问蓝牙、添加通讯录联系人、添加日历事件需要用户授权小程序处理用户的个人信息,需要获取用户明示同意,平台计划从2022年2月21日24时起对以下接口增加用户授权: 访问蓝牙:调用wx.openBluetoothAdapter、wx.createBLEPeripheralServer,需要授权scope.bluetooth添加通讯录联系人:调用wx.addPhoneContact,需要授权scope.addPhoneContact添加日历事件:调用wx.addPhoneRepeatCalendar、wx.addPhoneCalendar,需要授权scope.addPhoneCalendar开发者可在平台调整前提前增加使用 wx.getSetting 获取用户当前的授权状态的逻辑,若授权状态为false可以调用 wx.openSetting 打开设置界面,引导用户开启授权。 授权功能详细说明可参考:官方文档 <open-data>组件功能调整开发者在未获取用户明示同意的情况下通过 <open-data>组件 在小程序中展示用户个人信息,用户容易误以为自己的个人信息在未授权的情况下,被小程序获取。平台计划从2022年2月21日24时起回收通过<open-data>展示个人信息的能力,若小程序需收集用户昵称头像等信息,可以通过 头像昵称填写功能 功能进行收集。具体回收方式为: 头像展示 灰色头像用户昵称展示“微信用户”用户性别、地区、语言展示为为空(“”)小程序通过<open-data>展示群名称能力保留,平台会针对小程序生命周期内首次调用该组件展示群名称向用户提示:“群名称仅你可见,小程序无法获取。” 获取手机号能力安全升级此前小程序获取用户手机号是通过基础库接口直接获取encryptedData后进行解密。从基础库2.21.2版本起,回调参数中增加code参数,开发者获取code参数后,通过服务端auth.getPhoneNumber接口,使用code换取encryptedData,用于解密手机号。 为不影响开发者现有逻辑,原有基础库接口中的encryptedData参数依旧保留,建议开发者尽快使用新的方式获取用户手机号。 详细功能描述可参考 官方文档 微信团队 2021年12月27日
2023-09-26 - 开源 黑白图片上色 模糊照片变清晰
背景 之前给人家外包的黑白照片,这个哥们负了一点点款,然后开发完了就不要了 。没办法,到现在也没人要,我只能开源了,大家可以互相学习。欢迎start 使用到的技术 微信开发平台的云开发 以及第三方Api 百度Api 配置 云函数的配置 请先了解小程序云开发 百度key的配置 想审核ai平台的权限。需要[黑白图像上色]和【图像清晰度增强】这二个接口权限。 在云函数 getBaiduAccessToken的index.js中 把apiKey 替换为百度ai申请的appkey 把 secretKey替换成为 百度ai审核的secret秘钥然后更新云函数即可。 云数据库的配置 首先要创建token,index,user三个数据集 其他问题 简单的问题自行百度。如果还是不明白请留言 [图片][图片][图片] 开源地址:https://gitee.com/sunqi/bw
2020-09-25 - #小程序云开发挑战赛#-简约约拍-自习社
一、项目设计发明的目的 随着微博,微信等交际圈兴起、网红的各种美照的渗透、旅游等增多。传统影楼无法提供便捷拍摄服务及多元潮流的拍照风格,而相机价格较贵且使用学习成本高,消费者对拍照的需求,约拍小程序应运而生。为消费者和热爱拍摄的摄影师构建一个联通的平台,消费者和摄影师提供一个进行拍摄的服务平台、而且用户可以在上面分享自己拍摄的照片、拍摄的方法分享等等的一些动态分享,打造一个关于摄影爱好人群的社交圈子。同时基于OTO商业模式,“线上到线下”,约拍小程序的出现,用户线上可随时随地约拍符合自己风格的摄影师、摄影师可以利用空闲时间提供线下的约拍服务,成为移动的新型的影楼。 二、项目的创新点 ① 目前关于线上摄影的应用在市场上较少,且为是pc端或app端,使用到微信小程序平台随时可用,无需安装卸载,实现跨平台。又能低成本构建私域流量利用微信生态引流推广,打造线上摄影平台及摄影爱好者的交流平台。 ② 建立在微信平台,借助微信流量,进行推广更简单有效、成本低。小程序立即使用等优势可以快速吸引流量的引入。除此之外,基于020模式的约拍小程序不仅规范约拍服务和保障用户与摄影师的利益,而且还提供用户与用户之间的交流的平台。增加用户粘合程度的同时,激起约拍服务的流行,打造移动的新型影楼。 ③ 线上摄影平台,给摄影师和需要摄影的用户打造移动端的影楼,除了自身选择适合的摄影师、摄影风格等等,用户可以更加自由的去找到适合自身的风格和摄影师、可以随时随地的记录属于自身的美好 三、实现思路 前端开发使用原生代码,功能的实现充分利用云开发,提使用平台提供的 API 进行核心业务开发构建。 四、系统构架图以及前后端功能分析图 [图片] 五、目前所实现功能 作品:作品发布、作品展示、作品点赞动态:发布动态、动态点赞、动态评论约拍信息:发布约拍、约拍展示、约拍收藏、约拍下单 订单:订单详情展示、订单完成、订单评价 用户:关注、查看关注、查看关注用户、查看用户信息、用户实时聊天搜索功能 :展示搜索收藏功能:收藏后,打开收藏页面消息:实时通知功能 六、效果截图 [图片][图片][图片] [图片][图片][图片] [图片][图片][图片] [图片][图片] [图片][图片] 七、体验码 [图片] 八、开源地址 https://github.com/bigyellow19/bigyellow
2020-09-19 - #小程序云开发挑战赛#-大学生记账本-阳光队
系统提供支出、收入、转账、余额、借贷五大记账模块,内含多种情景账本,涉及食品、交通、购物、宿舍、娱乐、学习等各种针对学生的场景,以满足不同时期的记账需要。用户可以实时查看自己的账户余额和所有账单记录。本小程序已经上线,欢迎扫码体验。 [图片] 开源代码链接 GitHub:https://github.com/ChangYanwei/accountBook Gitee:https://gitee.com/changyanwei/accountBook 以下是详细介绍。 [图片] [图片] [图片] [图片] [图片] [图片] [图片] [图片] [图片] [图片] [图片] [图片] [图片] [图片] [图片] [图片] [图片] [图片] [图片] [图片] [图片] [图片] [图片][图片] [图片] [图片] [图片] [图片] [图片] [图片] [图片] [图片]
2022-04-10 - 关于虚拟支付的汇总整理
本文场景 在iso端做支付,虚拟支付问题是绕不过去,没有处理好,轻则封禁搜索,重则永久封号,所以对待这个问题不可谓不慎重 本文内容本文主要汇总社区相关的几个经典帖子,特别是带有官方回复的帖子,进行截图,最后做一个总结 截图一 [图片] 截图二 [图片] 截图三 [图片] 截图四 [图片] 参考文章 为什么“小鹅通”的小程序可以做虚拟支付?? - 微信开放社区 https://developers.weixin.qq.com/community/develop/doc/84ef0895eb9e4261b114a88d73dc7621 所谓的小程序IOS不允许虚拟支付到底限制的是谁?? - 微信开放社区 https://developers.weixin.qq.com/community/develop/article/doc/000246265d01201064ea17bc65b813 实名举报手机充值小程序虚拟支付可以正常使用?? - 微信开放社区 https://developers.weixin.qq.com/community/develop/doc/00066aedd70a907b38ea5043856400 跑腿小程序,支付跑腿费,属于虚拟支付吗?可以在ios里进行支付吗?? - 微信开放社区 https://developers.weixin.qq.com/community/develop/doc/0002e8ec24cbd0f29cba2e28156400 虚拟业务指南请收好。? - 微信开放社区 https://developers.weixin.qq.com/community/develop/doc/000cc6c0b383a047c7798e0045b409 本文总结关于虚拟支付的整理 关于一个支付业务到底是不是虚拟支付,在有参考的情况,可以根据官方的 上面社区的锅巴同学整理的非常详细,给出了官方明确定义为非虚拟支付的6种情况 以下内容摘录自锅巴同学的社区回帖内容 小程序在线直播课程,充值加油卡,手机流量等这6种,不算小程序虚拟支付,请参照以下6种情况即可,因为你不符合这6种情况,所以被判定为违规 ① 小程序在线课程直播。用户先买课程,后续在线上安排老师在小程序直播。补充选择教育-在线视频课程类目 ② 线上报名活动,线下培训的类型 ③ 充值加油卡加油,涉及预付卡销售服务,补充商家自营-预付卡销售类目 ④ 充值手机流量,补充IT科技-电信运营商类目 ⑤ 悬赏问答功能,需选择社交红包-社交红包类目,并完成新商户号申请后,再提交代码审核。 ⑥ 微信支付充值积分,签到积分等,积分兑换实物商品,兑换成功后,会直接给用户寄过去。有实际服务存在 最后总结下 你所认为的虚拟支付可能并不是虚拟支付,你所强调的非虚拟支付也有可能被定义为虚拟支付,所以一切以官方口径为依据。
2020-09-07 - 常见的云开发数据库操作脚本
在学习本文之前,请对云开发有一定的了解,并且在数据库新增一个集合,集合的名字为counters 如果对云开发有熟悉可以看下这篇文章 https://developers.weixin.qq.com/community/develop/article/doc/0000a2849d4cd8c4cddaeb1825bc13 本文背景 本文主要面向云开发初学者,其实主要是我的答题小程序用户,让他们掌握基本的数据库操作 本文内容 在云开发控制台数据库操作面板,左下角有个高级操作,我们可以在这里写一些常见的数据库操作脚本,并执行产出对应的结果 今天我们就来简单介绍下这一块 脚本一 第一个脚本是如何向数据库增加一条记录 db.collection('counters').add({ data: { count: 1 } }) 截图 [图片] 脚本二 第二个脚本是查询操作 db.collection('counters') .where({ count: 1 }) .get() [图片] 脚本三 第三个脚本是删除记录 db.collection('counters') .where({ count: 1 }) .remove() [图片]
2020-08-27 - 教你怎么监听小程序的返回键
更新:2020年7月28日08:51:11 基础库2.12.0起,可以调用wx.enableAlertBeforeUnload监听原生右上角返回、物理返回以及wx.navigateBack时弹框提示 AIP详情请看: https://developers.weixin.qq.com/miniprogram/dev/api/ui/interaction/wx.enableAlertBeforeUnload.html //======================================== 怎么监听小程序的返回键? 应该有很多人想要监听用户的这个动作吧,但是很遗憾,小程序不会给你这个API的,那是不是就没辙了? 幸好我们还可以自定义导航栏,这样一来我们就可以监听用户的这一动作了。 什么?这你已经知道啦? 那好咱们就不说自定义导航栏的返回监听了,说一下物理返回和左滑?右滑?(不管了,反正是滑)返回上一页怎么监听。 监听物理返回 首先说一下这个监听方法的缺点,虽说是监听,但是还是无法真正意义上的监听并拦截来阻止页面跳转,页面还是会返回上一页,而后重新载入刚刚的页面,如果这不是你想要的,那可以不用往下看了 其次说一下用到什么东西: wx.onAppRoute、wx.showModal 最后是一些主要代码: 重写wx.showModal,主要是加个confirmStay参数和使wx.showModal Promise化 [代码]const { showModal } = wx; Object.defineProperty(wx, 'showModal', { configurable: false, // 是否可以配置 enumerable: false, // 是否可迭代 writable: false, // 是否可重写 value(...param) { return new Promise(function (rs, rj) { let { success, fail, complete, confirmStay } = param[0] param[0].success = (res) => { res.navBack = (res.confirm && !confirmStay) || (res.cancel && confirmStay) wx.setStorageSync('showBackModal', !res.navBack) success && success(res) rs(res) } param[0].fail = (res) => { fail && fail(res) rj(res) } param[0].complete = (res) => { complete && complete(res) (res.confirm || res.cancel) ? rs(res) : rj(res) } return showModal.apply(this, param); // 原样移交函数参数和this }.bind(this)) } }); [代码] 使用wx.onAppRoute实现返回原来的页面 [代码]wx.onAppRoute(function (res) { var a = getApp(), ps = getCurrentPages(), t = ps[ps.length - 1], b = a && a.globalData && a.globalData.pageBeforeBacks || {}, c = a && a.globalData && a.globalData.lastPage || {} if (res.openType == 'navigateBack') { var showBackModal = wx.getStorageSync('showBackModal') if (c.route && showBackModal && typeof b[c.route] == 'function') { wx.navigateTo({ url: '/' + c.route + '?useCache=1', }) b[c.route]().then(res => { if (res.navBack){ a.globalData.pageBeforeBacks = {} wx.navigateBack({ delta: 1 }) } }) } } else if (res.openType == 'navigateTo' || res.openType == 'redirectTo') { if (!a.hasOwnProperty('globalData')) a.globalData = {} if (!a.globalData.hasOwnProperty('lastPage')) a.globalData.lastPage = {} if (!a.globalData.hasOwnProperty('pageBeforeBacks')) a.globalData.pageBeforeBacks = {} if (ps.length >= 2 && t.onBeforeBack && typeof t.onBeforeBack == 'function') { let { onUnload } = t wx.setStorageSync('showBackModal', !0) t.onUnload = function () { a.globalData.lastPage = { route: t.route, data: t.data } onUnload() } } t.onBeforeBack && typeof t.onBeforeBack == 'function' && (a.globalData.pageBeforeBacks[t.route] = t.onBeforeBack) } }) [代码] 改造Page [代码]const myPage = Page Page = function(e){ let { onLoad, onShow, onUnload } = e e.onLoad = (() => { return function (res) { this.app = getApp() this.app.globalData = this.app.globalData || {} let reinit = () => { if (this.app.globalData.lastPage && this.app.globalData.lastPage.route == this.route) { this.app.globalData.lastPage.data && this.setData(this.app.globalData.lastPage.data) Object.assign(this, this.app.globalData.lastPage.syncProps || {}) } } this.useCache = res.useCache res.useCache ? reinit() : (onLoad && onLoad.call(this, res)) } })() e.onShow = (() => { return function (res) { !this.useCache && onShow && onShow.call(this, res) } })() e.onUnload = (() => { return function (res) { this.app.globalData = Object.assign(this.app.globalData || {}, { lastPage: this }) onUnload && onUnload.call(this, res) } })() return myPage.call(this, e) } [代码] 在需要监听的页面加个onBeforeBack方法,方法返回Promise化的wx.showModal [代码]onBeforeBack: function () { return wx.showModal({ title: '提示', content: '信息尚未保存,确定要返回吗?', confirmStay: !1 //结合content意思,点击确定按钮,是否留在原来页面,confirmStay默认false }) } [代码] 运行测试,Oj8K 是不是很简单,马上去试试水吧,效果图就不放了,静态图也看不出效果,动态图懒得弄,想看效果的自己运行代码片段吧 代码片段 https://developers.weixin.qq.com/s/hc2tyrmw79hg
2020-07-28 - (17)分享功能调整背后的故事
有时候我们使用一个小程序会遇到以下情形: 我们打开一个小程序,就看见提示“分享到5个群,可以获得一张20元的优惠券”,吸引我们去无脑分享到不同的群里; 打开某个小游戏,提示我“一定要分享到xx个群,才能继续玩游戏”; …… 而我们在群里打开这类小程序,仍然是提示我分享的信息,这类功能无疑打断了我们对小程序/小游戏正常的功能使用。 我们收到了很多用户对这类小程序/小游戏的抱怨。这类分享并非是用户主动自发的,而是受到了某类利益的诱惑,或是被迫分享。这样的内容充斥在群里、小程序里,对用户造成了骚扰,是对分享功能的滥用。 在原来的分享接口中,用户发起分享动作之后,可以通过 success 、fail、complete等回调来判断用户是否完成了最后的分享动作。通过这个能力,开发者是可以将产品交互在分享这个能力上做得比较自然和顺畅。但却被上述情形的小程序滥用。在我们权衡了分享功能带来的利弊后,我们打算回收这个能力。调整为:我们将不再支持分享回调参数 success 、fail 、complete 。即开发者无法判断用户最终是否完成了分享动作,也无法获取到分享成功后的回调参数shareTicket 。 接下来将与大家介绍此次分享功能调整后,小程序的调整建议。 对应小程序调整建议 此次调整可能影响到两种分享功能的用法。 第一种:通过判断用户最终是否有分享来做分支逻辑的小程序。 例如,通过判断 success 回调触发,来判断用户是否分享出去了,进而给奖励,如果用户没有分享出去则不给奖励。这类功能是我们平台不倡导的,后续将没有办法实现。 如果是需要在分享完成后变更当前页面的状态,可以适当调整交互方案。例如过去赠送代金券后显示“等待领取”等应用场景,可以改成在分享后继续保留“赠送”按钮,但提示用户一个代金券只能被一人领取,重复赠送无效。 第二种:获取用户分享之后的 shareTicket ,换取群唯一标识 openGId ,进而显示对应群的相关信息的小程序。 例如,部分小程序实现了群内的排行信息,通过分享小程序到某个群里,可以查看该群内成员的排行榜。 此次调整后,用户分享完成后无法立刻显示该群的排行榜信息,但仍可在用户从群消息点击进入小程序时显示该群的排行榜信息。 因此建议适当修改产品流程,在用户分享小程序之时,提示用户可进入群内查看群排行等信息。避免调整策略生效之后带来的交互不完整影响。 调整覆盖范围提示 近期新提交的版本中将会受到此策略的影响。 除此之外,调整策略在即将发布的基础库版本 2.3.0 生效,该基础库版本对应本月即将发布的微信客户端版本(暂定版本号 6.7.2)。即:近期提交审核的小程序版本,在基础库版本 2.3.0 以下的环境中仍不受此策略影响,仅在基础库版本 2.3.0 以上的环境受影响。 开发者需要注意,近期提交审核的版本都需要考虑兼容上述调整带来的影响,请各位开发者及时调整分享能力。
2018-08-17 - 关于小商店,服务商可以做什么?
毋庸置疑,我们需要服务商一起参与,小商店将开放店铺、商品、订单、物流、客服等一系列API接口供第三方介入,完善小商店能力。 我们希望,在初期,服务商可提供一键搬家、订单批量发货等一系列提效工具;未来,小商店还会开放接入ERP/CRM、智能客服、店铺装修、营销等经营工具,和第三方合作伙伴共同帮助商家经营成长。
2020-07-17 - 微信支付接口报【签名错误】,看这一篇就够了
此文章致力解决在开发微信支付相关接口报【签名错误】,并不断升级更新 文章demo以’普通商户版’-‘JSAPI支付’作为案例(JSAPI支付文档) 先讲一下开发步骤和经验,文章后半部分讲排错经验 开发步骤 一 设置支付目录(文档链接) 支付目录,一定要设置实际支付页面的路径以 / 结尾,如果提示<当前页面URL未注册>,请检查自己实际支付页面的路径是否填写正确 发起支付的业务流程,我们做的操作应该是这样的:用户选择支付金额和其他参数–>用户点击支付–>前端向后台发起请求获取签名等参数–>后台调用统一下单接口,返回给前端需要的签名参数–>前端调用WeixinJSBridge.invoke–>用户填写密码–>支付成功–>微信发送通知给统一下单填写的回调方法。详细业务流程点我查看 二 后台调用统一下单接口(文档链接) 此接口参数非常多,第一次开发的时候,建议开发者仔仔细细对每个参数进行比对。遇到签名错误的同学,大部分人的原因是因为参数填写错误导致的 后台在给前端准备参数的时候,是要进行两次签名的:第一次是发送统一下单请求之前,对发送给微信的所有参数进行签名;第二次是微信返回预支付交易会话标识后,对传给前端的所有参数进行签名。 请注意,第一次签名和第二次签名的时候,参数是不一样的,第二次签名的时候,签名需要哪些参数呢?签名的参数是WeixinJSBridge.invoke需要用到的参数,和第一次签名需要的参数是不一样的! 对于参数package我第一次粗心大意,没有拼接字符串‘prepay_id=’希望大家也注意一些,前后台都需要拼接这个字符串‘prepay_id=’ 这是我刚刚花费10分钱获取的统一下单截图 [图片] 只有result_code和return_code都为SUCCESS的时候,说明调用成功,成功拿到预支付的id 三 前端获取参数后拉起微信支付(文档链接) [图片] 其实完整坐下来,微信支付就这么点东西,只是大家可能有些不熟悉,对于大家遇到的签名错误问题,绝大部分是参数没有认真进行参数比对,参数不能多,也不能少。如果还报错,建议从下面一些方式进行排查 排错经验 · 首先排查签名方法是否正确(签名效验工具),如果自己写的签名方法和工具展示出来的结果一模一样,说明你签名的工具方法写的没有问题,那么就剩下参数的问题了! · 然后进行参数比对,根据开发文档,进行比对,一个字母都不能差 · 第一次签名和第二次签名的APPID ,后台签名的i是小写,前端调用的是大写 · 后端第二次签名,参数package一定不要忘记拼接prepay_id · 请再三确认appid和mch_id是否正确,如果同时进行多个公众号支付开发,一定不要弄混 · 第二次签名参数timeStamp时间差距太大(你服务器时间要尽量准确,好像误差不能超过10分钟) · 中文参数错误,英文参数没有问题的,本文以MD5加密为例,请在加密的时候,指定编码格式为UTF-8 对于企业付款到零钱/银行卡 · 尝试在商户平台的账户信息中更改API密钥(账户设置-安全设置-API安全), 15分钟后生效 · 还是参数,参数,参数 终极杀器·缓存 作者开发语言是java,之前缓存无处不在,myeclipse(开发者工具)的缓存,本地编译缓存,服务器tomcat的缓存,如果你觉得我就是对的,什么都排查过了,没有问题,OK,建议清理缓存(先删除tomcat里边的项目,再添加然后重新编译项目;服务器tomcat缓存,清理tomcat文件夹下work-catalina文件夹的内容)。实在不行,重启本地电脑。重启服务器server。 请各位同学一定要先自行排查问题,如果还无法解决问题,或者你遇到过其他bug情况,欢迎留言,我会及时更新到文章,以便帮助更多人解决签名错误的问题。ღ( ´・ᴗ・` )比心 ------------------分割线------------------- 签名方式是否真的正确? ----------2019年12月2日更新,感谢斌斌反馈---------- 由于作者做支付是在2016年,辛辛苦苦整理了一份demo,一直沿用至今,忘记当时是否有官方sdk了,如果大家用的是官方sdkDemo,以上bug排查完,还是报签名错误,请检查签名方式,实际是MD5还是HMACSHA256。具体情况可以看这篇提问【JSAPI第二次签名到底什么机制?】
2021-03-18 - 关于云开发的一次性订阅消息
前段时间看到了这位老哥的一篇关于订阅消息的文章:https://developers.weixin.qq.com/community/develop/article/doc/0008802e8381e0eeabb92c9975b013 这篇文章对于程序员来说非常直观的说明了一次性订阅消息的逻辑:订阅1次,可以收到订阅消息一次,订阅10次,可以收到订阅消息10次。 但是我觉得这个方案对于一个普通用户来说,并不够友好,如果我是一个不懂订阅消息的普通用户,我根本不会花时间去点这样一个点1加1的订阅消息。我觉得对于开发者来说,用户能够点一次允许并且勾上不在询问就已经很不错了,剩下的完全可以交给程序来处理。下面是我的方案。让一次性订阅消息达到长期订阅的效果。 首先明确以下逻辑: 通过 wx.getSetting({ withSubscriptions: true }) 的 success 回调 res 可以得出订阅消息的以下5种状态[图片]当用户勾选了“不在询问”之后,不管你后面怎么调 wx.requestSubscribeMessage ,订阅消息的弹窗都是不会弹起的wx.requestSubscribeMessage 需要用户手动点击触发当得到以上几种状态之后,接下来就可以根据需要做自己想要做的操作 如我的小程序首页是一个版本列表 [图片] 我在列表的头部设计了一个跟小程序同风格的授权卡片,这样不会显得突兀同时告诉用户点击授权并且勾选“不在询问”,并告诉用户这样做的目的是什么。 然后根据上面得到的不同状态来显示不同的提示语: 总开关关闭了: [图片] 勾选了“不在询问”并且选项是取消 [图片] 接下来就是实现订阅消息+1的步骤,上面提到了当用户勾选了“不在询问”之后,不管你后面怎么调 wx.requestSubscribeMessage ,订阅消息的弹窗都是不会弹起的 这时在用户点击你应用中必点的操作时,比如知乎微博的点击列表进入详情,或者我这个小程序点击版本列表进入版本详情时就可以根据以上得到的状态来判断:当授权状态是“选择了不在询问并且选项是允许” 时,直接调用 wx.requestSubscribeMessage ,这时 wx.requestSubscribeMessage 的回调必定是success,而且不会出现授权弹窗,自然也就实现了+1效果。 最后把订阅次数+1记录到数据库,推送时推送订阅次数大于0的就ok了 [图片] 这样一个普通用户需要做的操作就只有点击授权-勾选不在询问-允许 这样一个步骤,同时就实现了无形中增加订阅次数的效果,替代让用户手动去点+1增加订阅消息的操作。 另外不用担心这种操作会使用户感觉像垃圾广告一样一直被推送,因为不管是在服务通知页面,还是在设置页面,用户都是可以很轻松的一键关闭通知。 [图片] 然后说下订阅消息的几个特殊情况: 1.当你的账号在开发者工具上面点过允许或取消的时候,wx.getSetting({ withSubscriptions: true }) 的 success 回调结果是这样的 [图片] 手机上的设置界面是这样的 [图片] 回调的itemSettings属性消失了,界面上有订阅消息的开关,但是订阅消息的选项却没了,正常情况应该是这样的 [图片] 这样的 [图片] 2.当用户点了“不在询问并允许”但是又手动通过服务通知页面,或者设置页面关闭了消息通知,这时就算该用户之前已经订阅过了很多次,都会被系统自动清0,这时你的数据库可能存的该用户还有比如5次订阅消息,但是通过cloud.openapi.subscribeMessage.send推送消息的时候,会进catch,errCode是43101。 3.当用户手速过快连续点击了授权按钮触发wx.requestSubscribeMessage时,会进入fail回调,errMsg是 requestSubscribeMessage:fail last call,这个文档是没写的。 最后可以扫码体验一下: [图片]
2020-07-14 - WXS功能文件共享
,在页面布局上难免会遇到要js处理数据的情况,我提供一份我目前使用的common.wxs给大家参考 module.exports = { jsonParse: function (str) { return JSON.parse(str); }, fixedFloatNumber: function (number, n) { return parseFloat(number.toFixed(n)) // 保留两位小数,末位为0时去掉 }, isEqualStrings: function (firstStr, nextStr) { var reg = getRegExp('[ ()-]', 'g') var str1 = firstStr.replace(reg, '') var str2 = nextStr.replace(reg, '') // console.log('bbb', str1, str2, str1 === str2) return str1 === str2 }, // params:倒计时的毫秒数 timeDifference: function(dateDiff){ // 剩余时间 var dayDiff = Math.floor(dateDiff / (24 * 3600 * 1000)); var leave1=dateDiff%(24*3600*1000); var hours=Math.floor(leave1/(3600*1000)); var leave2=leave1%(3600*1000); var minutes=Math.floor(leave2/(60*1000)); if(dayDiff) { return dayDiff + '天'; }else if(hours) { return hours + '小时'; }else if(minutes) { return minutes + '分钟'; }else { return '0分钟'; } // params:2019-07-18 格式化时间 getFormatDate: function(params){ var currentYear = getDate().getFullYear(); var resultDate = ''; if(params && params.indexOf('-') !== -1) { var dateSplit = params.split('-') || []; if(dateSplit.length === 3) { var year = dateSplit[0]; if(currentYear == year) { resultDate = dateSplit[1] + '月' + dateSplit[2] + '日' }else { resultDate = dateSplit[0] + '年' + dateSplit[1] + '月' + dateSplit[2] + '日' } }else { resultDate = params; } }else { resultDate = params; } return resultDate; }, getTagsList: function(tags) { // 返回\分隔数组 var tagsList = tags.split('|') || []; return tagsList; }, getCityString: function(cities) { // 返回字符串,逗号隔开 var citysList = cities || []; return citysList.join(','); }, getCustomerDate: function(timestamp, language = 'CN') { // 传入时间戳,返回格式 x月x日 x时:x分(7月1日 09:01) var formatDate = ''; if(timestamp && timestamp.toString().length > 0) { var myDate = getDate(timestamp); var myYear = myDate.getFullYear(); var myMonth = myDate.getMonth() + 1; var myDay = myDate.getDate(); var myHours = myDate.getHours(); if(myHours.toString().length === 1){ myHours = "0" + myHours; } var myMinutes = myDate.getMinutes(); if(myMinutes.toString().length === 1){ myMinutes = "0" + myMinutes; } var currentDate = getDate(); var currentYear = currentDate.getFullYear(); if(language === 'CN' || language === 'cn') { if (myYear === currentYear) { formatDate = myMonth + '月' + myDay + '日' + ' ' + myHours + ':' + myMinutes; } else { formatDate = myYear + '年' + myMonth + '月' + myDay + '日' + ' ' + myHours + ':' + myMinutes; } } else { formatDate = myYear + '/' + myMonth + '/' + myDay + '/' + ' ' + myHours + ':' + myMinutes; } } else { formatDate = ''; } return formatDate; }, searchText: function (resourceStr, keyStr) { if(resourceStr && resourceStr.length > 0){ return resourceStr.indexOf(keyStr) !== -1; } return false } };
2020-07-10 - 如何实现快速生成朋友圈海报分享图
由于我们无法将小程序直接分享到朋友圈,但分享到朋友圈的需求又很多,业界目前的做法是利用小程序的 Canvas 功能生成一张带有小程序码的图片,然后引导用户下载图片到本地后再分享到朋友圈。相信大家在绘制分享图中应该踩到 Canvas 的各种(坑)彩dan了吧~ 这里首先推荐一个开源的组件:painter(通过该组件目前我们已经成功在支付宝小程序上也应用上了分享图功能) 咱们不多说,直接上手就是干。 [图片] 首先我们新增一个自定义组件,在该组件的json中引入painter [代码]{ "component": true, "usingComponents": { "painter": "/painter/painter" } } [代码] 然后组件的WXML (代码片段在最后) [代码]// 将该组件定位在屏幕之外,用户查看不到。 <painter style="position: absolute; top: -9999rpx;" palette="{{imgDraw}}" bind:imgOK="onImgOK" /> [代码] 重点来了 JS (代码片段在最后) [代码]Component({ properties: { // 是否开始绘图 isCanDraw: { type: Boolean, value: false, observer(newVal) { newVal && this.handleStartDrawImg() } }, // 用户头像昵称信息 userInfo: { type: Object, value: { avatarUrl: '', nickName: '' } } }, data: { imgDraw: {}, // 绘制图片的大对象 sharePath: '' // 生成的分享图 }, methods: { handleStartDrawImg() { wx.showLoading({ title: '生成中' }) this.setData({ imgDraw: { width: '750rpx', height: '1334rpx', background: 'https://qiniu-image.qtshe.com/20190506share-bg.png', views: [ { type: 'image', url: 'https://qiniu-image.qtshe.com/1560248372315_467.jpg', css: { top: '32rpx', left: '30rpx', right: '32rpx', width: '688rpx', height: '420rpx', borderRadius: '16rpx' }, }, { type: 'image', url: this.data.userInfo.avatarUrl || 'https://qiniu-image.qtshe.com/default-avatar20170707.png', css: { top: '404rpx', left: '328rpx', width: '96rpx', height: '96rpx', borderWidth: '6rpx', borderColor: '#FFF', borderRadius: '96rpx' } }, { type: 'text', text: this.data.userInfo.nickName || '青团子', css: { top: '532rpx', fontSize: '28rpx', left: '375rpx', align: 'center', color: '#3c3c3c' } }, { type: 'text', text: `邀请您参与助力活动`, css: { top: '576rpx', left: '375rpx', align: 'center', fontSize: '28rpx', color: '#3c3c3c' } }, { type: 'text', text: `宇宙最萌蓝牙耳机测评员`, css: { top: '644rpx', left: '375rpx', maxLines: 1, align: 'center', fontWeight: 'bold', fontSize: '44rpx', color: '#3c3c3c' } }, { type: 'image', url: 'https://qiniu-image.qtshe.com/20190605index.jpg', css: { top: '834rpx', left: '470rpx', width: '200rpx', height: '200rpx' } } ] } }) }, onImgErr(e) { wx.hideLoading() wx.showToast({ title: '生成分享图失败,请刷新页面重试' }) //通知外部绘制完成,重置isCanDraw为false this.triggerEvent('initData') }, onImgOK(e) { wx.hideLoading() // 展示分享图 wx.showShareImageMenu({ path: e.detail.path, fail: err => { console.log(err) } }) //通知外部绘制完成,重置isCanDraw为false this.triggerEvent('initData') } } }) [代码] 那么我们该如何引用呢? 首先json里引用我们封装好的组件share-box [代码]{ "usingComponents": { "share-box": "/components/shareBox/index" } } [代码] 以下示例为获取用户头像昵称后再生成图。 [代码]<button class="intro" bindtap="getUserInfo">点我生成分享图</button> <share-box isCanDraw="{{isCanDraw}}" userInfo="{{userInfo}}" bind:initData="handleClose" /> [代码] 调用的地方: [代码]const app = getApp() Page({ data: { isCanDraw: false }, // 组件内部关掉或者绘制完成需重置状态 handleClose() { this.setData({ isCanDraw: !this.data.isCanDraw }) }, getUserInfo(e) { wx.getUserProfile({ desc: "获取您的头像昵称信息", success: res => { const { userInfo = {} } = res this.setData({ userInfo, isCanDraw: true // 开始绘制海报图 }) }, fail: err => { console.log(err) } }) } }) [代码] 最后绘制分享图的自定义组件就完成啦~效果图如下: [图片] tips: 文字居中实现可以看下代码片段 文字换行实现(maxLines)只需要设置宽度,maxLines如果设置为1,那么超出一行将会展示为省略号 代码片段:https://developers.weixin.qq.com/s/J38pKsmK7Qw5 附上painter可视化编辑代码工具:点我直达,因为涉及网络图片,代码片段设置不了downloadFile合法域名,建议真机开启调试模式,开发者工具 详情里开启不校验合法域名进行代码片段的运行查看。 最后看下面大家评论问的较多的问题:downLoadFile合法域名在小程序后台 开发>开发设置里配置,域名为你图片的域名前缀 比如我文章里的图https://qiniu-image.qtshe.com/20190605index.jpg。配置域名时填写https://qiniu-image.qtshe.com即可。如果你图片cdn地址为https://aaa.com/xxx.png, 那你就配置https://aaa.com即可。
2022-01-20 - 小程序海报生成工具,可视化编辑直接生成代码使用,你的海报你自己做主
开门见山 工具地址 点我直达>>painter-custom-poster 由于挂载在github page上,打开速度会慢一些,请耐心等待或自行解决git网速问题 背景 在做小程序时候,我们经常会有一个需求,需要将小程序分享到朋友圈,但是朋友圈是不允许直接分享小程序,那我们还有其他的办法解决吗?答案肯定是有的,即 canvas 生成个性化海报分享图片到朋友圈 分析 小程序中有大量的生成图片需求,但是使用过 canvas 的人,都会发现一些难以预料的问题>>有关小程序的坑 直接在 canvas 上绘制图形,对于普通开发者来说代码会特别凌乱并且难以维护,经常会花费很久的时间去优化代码 不同的环境渲染问题,例如在开发者工具看起来好好的,一到 Android 真机,就出现图片不显示,位置不对应等等问题 解决 那可不可以开发一款生成海报的插件库呢? 首先,只需要提供一份简单的参数配置文件即可 解决掉小程序Canvas遇到的一些大大小小的坑 有严苛的测试环节,解决各种环境和各种机型遇到的问题,并提供稳定的线上版本 长期维护,并有专人更新迭代更新颖的功能 以上的要求当然是可以的,曾经的我也想尝试开发一款出来,但是后来尝试了几款现成的工具之后就放弃了,毕竟轮子这个东西,是需要不断维护更新的,另外已经有这么多优秀现成的插件了,我为何还要费力去写呢,贡献代码岂不更美哉,以下是我收集的几款 小程序生成图片库,轻松通过 json 方式绘制一张可以发到朋友圈的图片>>Painter 小程序组件-小程序海报组件>>wxa-plugin-canvas 微信小程序:一个 json 帮你完成分享朋友圈图片>>mp_canvas_drawer 我想干什么 唠了这么多,好像提供给大家插件就没我什么事情了…想走是不可能的 为了能够制作出更酷炫的海报,我思考了许久 虽然有了插件后,只需要提供配置代码就能够制作出一款海报来,但是我发现还是有些许问题 制作海报效率还是不够高,微调一个元素的大小和位置,就需要不断的修改保存代码,等待片刻,查看效果,真的烦 一个小小的位置调整可能就需要来回调整无数次,这种最简单的机械化劳动,这辈子是不可能的 拿着完美的稿子,递给设计师看,这个位置不对,这个线太粗,这个颜色太重…你信不信我打死你 对于一些精美复杂的海报,实现起来真的不太现实 那我需要怎么做呢,请点击这个链接体验>>painter-custom-poster 点击左侧例子展示中的任意一个例子,然后导入代码就能看到效果图,这下你应该能猜到了我的想法了 如何实现 刚开始我想用简单的html和css加拖动功能实现,通过简单尝试之后就放弃了,因为这个功能真的太复杂了,简单的工具肯定是不行的 中间这个计划停滞了很长时间,一度已经放弃 直到发现了这个库fabric.js,真的太太优秀了,赞美之词无以言表,唯一的缺点就是中文教程太少,必须生啃英文加谷歌翻译 fabric介绍,你可以很容易地创建任何一个简单的形状,复杂的形状,图像;将它们添加到画布中,并以任何你想要的方式进行修改:位置、尺寸、角度、颜色、笔画、不透明度等 How To Use 目前工具一共分成4部分 例子展示 用来将一些用户设计的精美海报显示出来,通过点击对应的例子并将代码导入画布中 画布区 显示真实的海报效果,画布里添加的元素,都可以直接用鼠标进行拖动,旋转,缩放操作 操作区 第一排四个按钮 复制代码 将画布的展示效果转化成小程序海报插件库所需要的json配置代码,目前我使用的是Painter库,默认会转化成这个插件的配置代码,将代码直接复制到card.js即可 查看代码 这个功能用不用无所谓,可以直观的看到生成的代码 导出json 将画布转化成fabric所需要的json代码,方便将自己设计的海报代码保存下来 导入json 将第3步导出的json代码导入,会在画布上显示已设计的海报样式 第二排五个按钮 画布 画布的属性参数 详解见下方 文字 添加文字的属性参数 详解见下方 矩形 添加矩形的属性参数 详解见下方 图片 添加图片的属性参数 详解见下方 二维码 添加二维码的属性参数 详解见下方 第三排 各种元素的详细设置参数 激活区 激活对象是指鼠标点击画布上的元素,该对象会被蓝色的边框覆盖,此时该对象被激活,可以执行拖动 旋转 缩放等操作 激活区只有对象被激活才会出来,用来设置激活对象的各种配置参数,修改value值后,实时更新当前激活对象的对应状态,点击其他区域,此模块将隐藏 快捷键 ‘←’ 左移一像素 ‘→’ 右移一像素 ‘↑’ 上移一像素 ‘↓’ 下移一像素 ‘ctrl + z’ 撤销 ‘ctrl + y’ 恢复 ‘delete’ 删除 ‘[’ 提高元素的层级 ‘]’ 降低元素的层级 布局属性 通用布局属性 属性 说明 默认 rotate 旋转,按照顺时针旋转的度数 0 width、height view 的宽度和高度 top、left 如 css 中为 absolute 布局时的作用 0 background 背景颜色 rgba(0,0,0,0) borderRadius 边框圆角 0 borderWidth 边框宽 0 borderColor 边框颜色 #000000 shadow 阴影 ‘’ shadow 可以同时修饰 image、rect、text 等 。在修饰 text 时则相当于 text-shadow;修饰 image 和 rect 时相当于 box-shadow 使用方法: [代码]shadow: 'h-shadow v-shadow blur color'; h-shadow: 必需。水平阴影的位置。允许负值。 v-shadow: 必需。垂直阴影的位置。允许负值。 blur: 必需。模糊的距离。 color: 必需。阴影的颜色。 举例: shadow:10 10 5 #888888 [代码] 渐变色支持 你可以在画布的 background 属性中使用以下方式实现 css 3 的渐变色,其中 radial-gradient 渐变的圆心为 中点,半径为最长边,目前不支持自己设置。 [代码]linear-gradient(-135deg, blue 0%, rgba(18, 52, 86, 1) 20%, #987 80%) radial-gradient(rgba(0, 0, 0, 0) 5%, #0ff 15%, #f0f 60%) [代码] !!!注意:颜色后面的百分比一定得写。 画布属性 属性 说明 默认 times 控制生成插件代码的宽度大小,比如画布宽100,times为2,生成的值为200 1 文字属性 属性名称 说明 默认值 text 字体内容 别跟我谈感情,谈感情伤钱 maxLines 最大行数 不限,根据 width 来 lineHeight 行高(上下两行文字baseline的距离) 1.3 fontSize 字体大小 30 color 字体颜色 #000000 fontWeight 字体粗细。仅支持 normal, bold normal textDecoration 文本修饰,支持none underline、 overline、 linethrough none textStyle fill: 填充样式,stroke:镂空样式 fill fontFamily 字体 sans-serif textAlign 文字的对齐方式,分为 left, center, right left 备注: fontFamily,工具中的第一个例子支持文字字体,但是导入小程序为什么看不到呢,小程序官网加载网络字体方法>> 加载字体教程>> 文字高度 是maxLines lineHeight2个字段一起计算出来的 图片属性 属性 说明 默认 url 图片路径 mode 图片裁剪、缩放的模式 aspectFill mode参数详解 scaleToFill 缩放图片到固定的宽高 aspectFill 图片裁剪显示对应的宽高 auto 自动填充 宽度全显示 高度自适应居中显示 Tips(一定要看哦~) 本工具不考虑兼容性,如发现不兼容请使用google浏览器 painter现在只支持这几种图形,所以暂不支持圆,线等 如果编辑过程,一个元素被挡住了,无法操作,请选择对象并通过[ ]快捷键提高降低元素的层级 文字暂不支持直接缩放操作,因为文字大小和元素高度不容易计算,可以通过修改激活栏目maxLines lineHeight fontSize值来动态改变元素 如发现导出的代码一个元素被另一个元素挡住了,请手动调整元素的位置,json数组中元素越往后层级显示就越高,由于painter没有提供层级参数,所以目前只能这样做 本工具导出代码全是以px为单位,为什么不支持rpx, 因为painter在rpx单位下,阴影和边框宽会出现大小计算问题,由于原例子没有提供px生成图片方案,可以下载我这里修改过的demo>>Painter即可解决 文本宽度随着字数不同而动态变化,想在文本后面加个图标根据文本区域长度布局, 请参考Painter文档这块教程直接修改源码 由于本工具开发有些许难度,如出现bug,建议或者使用上的问题,请提issue,源码地址>>painter-custom-poster 海报贡献 如果你设计的海报很好看,并且愿意开源贡献,可以贡献你的海报代码和缩略图,例子代码文件在example中,按顺序排列,例如现在库里例子是example2.js,那你添加example3.js和example3.jpg图片,事例可以参考一下文件夹中源码,然后在index.js中导出一下 导出代码 代码不要格式化,会报错,请原模原样复制到json字段里 生成缩略图 刚开始我想在此工具中直接生成图片,但是由于浏览器图片跨域问题导致报错失败 所以请去小程序中生成保存图片,图片质量设置0.2,并去tinypng压缩一下图片 找到painter.js,替换下边这个方法,可以生成0.2质量的图片,代码如下 [代码] saveImgToLocal() { const that = this; setTimeout(() => { wx.canvasToTempFilePath( { canvasId: 'k-canvas', fileType: 'jpg', quality: 0.2, success: function(res) { that.getImageInfo(res.tempFilePath); }, fail: function(error) { console.error(`canvasToTempFilePath failed, ${JSON.stringify(error)}`); that.triggerEvent('imgErr', { error: error }); } }, this ); }, 300); } [代码] TODO 颜色值选择支持调色板工具 文字padding支持 缩放位置弹跳问题优化 假如需求大的话,支持其他几款插件库代码的生成 ~ 创作不易,如果对你有帮助,请给个星星 star✨✨ 谢谢 ~
2019-09-27 - 社区购物运营
预约,团购,触达最终客户,提供更好到客户服务
2020-03-20 - vue等前后端分离微信授权登录的解决方案
准备工作 前提:1、在阅读此实践方案之前,确保已经对OAuth2.0授权流程以及完整阅读了【开放平台-网站应用-微信登录功能-网站应用微信登录开发指南(点击红字去阅读)】并理解相应的授权流程 2、在开放平台注册并申请了相关到网站应用,填写了开发信息-授权回调域,获得了接口 (微信登录)。 原理简介 1.将微信登录二维码内嵌到自己的vue前端登录页面中,扫码后用户点击确认登录后会跳转回授权回调域(授权回调域设置与vue前端域名一致) 2,此时携带code和state参数,vue在路由拦截中判断code和state参数,并携带code和state跳转到登录页面实现后续登录逻辑 3,登录页面在钩子函数mounted()中判断是否是微信授权登录,通过相关接口传送code和state给服务端, 4.由服务端携带code通过请求access_token接口请求access_token并完成后续登录逻辑,返回相应结果给vue前端。此时授权登录完成。 实现1.将二维码内嵌到vue前端登录页面中:文档中已介绍相关案例代码如下步骤1:在页面中先引入如下JS文件(支持https) http://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js 步骤2:在需要使用微信登录的地方实例以下JS对象: var obj = new WxLogin({ self_redirect:false, id:"login_container", appid: "", scope: "", redirect_uri: "", state: "", style: "", href: "" }); x相关参数说明请仔细阅读文档中的参数说明;其中参数self_redirect的参数为false 即确认登录后再top window跳转到redirect_uri 内嵌二维码示例: [图片] 程序实现片段:引入js文件 ,通过自定义组件,将js文件引入页面 export default { components: { 'remote-js': { render(createElement) { return createElement('script',{attrs:{type:'text/javascript',src:this.src}}); }, props:{ src:{type:String,required:true} } } } } 页面内添加js相关组件,并实例WxLogin:具体实现方式结合自己的登录页面业务逻辑实现:注意回调地址不支持#号输入,会将#号后内容清除 var obj = new WxLogin({ self_redirect: false, id: "wechat-qrcode", appid: res.data.appid, scope: "snsapi_login", redirect_uri: '', state: '' }); h回调后,路由拦截设置:获取code,以及state,注意vue会自动添加 '#/' 在url地址后边,注意获取参数时去除 通过next()设置query参数 将code,state传到登录页面, 登录页面钩子函数mounted()中判断并请求服务端相应接口,例如判断参数有误code和state等 进行请求 服务端相应接口。完成相应的登录逻辑 此方案已经实现并使用中,如果有相关咨询问题,欢迎各位开发者大拿进行讨论。
2020-03-19