订阅号与服务号的区别： 1、申请主体的不同：分为个人、个体工商户、企业、媒体； 2、主要用途不同： 服务号：为企业和组织提供更强大的业务服务与用户管理能力，主要偏向服务类交互； 订阅号：为媒体和个人提供一种新的信息传播方式，主要功能是在微信端给用户传达资讯； 3、服务号的消息推送是直接展示在好友对话列表中；订阅号的推送消息则是显示在“订阅号消息”文件夹中； 4、群发次数 服务号：一个月（按自然月）内可发送四条群发消息。 订阅号：（认证用户、非认证用户）1天内可群发1条消息 5、公众号的两种模式： （1）编辑模式：直接使用微信公众平台所提供的后台操作进行用户交互。编辑模式可以使用在如下的场景：不具备开发能力的运营者，主要是进行品牌宣传、新闻媒体、自助客服的公众账号，运营初期，不需要特别多的功能等特殊情况。 （2）开发者模式：直接使用接口代码实现用户的交流。 另外还可以进行微信公众号二次开发，随着微信的推广和普及，原来微信公众号的基础功能都非常简单，对于部分企业商家来说，往往无法满足其需求。微信公众号的开发流程一般有以下几点： 1、需求提交并确认。在进行开发前，企业要首先结合自身发展情况对公众号作出详细的开发规划，并结合规划提出明确的功能开发需求，然后和开发公司再次沟通确认。 2、功能设计。基于明确的需求方案，开发公司的产品经理需要进行微信公众号的功能设计。就是将企业的需求和实际情况捋顺，明确功能设置和运行的逻辑，形成功能开发的大致框架。随后根据出现的矛盾与问题随时进行调整。 3、具体开发。开发环节由技术开发人员在微信公众号原有的逻辑框架之上，结合产品经理做的项目框架进行页面设计、功能搭建、测试等工作。 4、验收确认。当开发公司完成所有开发工作后，企业要对产品的开发成果进行验收，例如：看开发的功能、页面、布局、产品展示等等是否符合自己的需求。如果需要修改和优化，则可以将意见反馈给项目经理进行确认，技术员去具体操作完善，而如果需要对大框架进行修改调整，或增加新的需求，则需要进行再次评估，确定方案后再进行开发。项目完全完成后，由双方进行确认 订阅号与服务号的区别： 1、申请主体的不同：分为个人、个体工商户、企业、媒体； 2、主要用途不同： 服务号：为企业和组织提供更强大的业务服务与用户管理能力，主要偏向服务类交互； 订阅号：为媒体和个人提供一种新的信息传播方式，主要功能是在微信端给用户传达资讯； 3、服务号的消息推送是直接展示在好友对话列表中；订阅号的推送消息则是显示在“订阅号消息”文件夹中； 4、群发次数 服务号：一个月（按自然月）内可发送四条群发消息。 订阅号：（认证用户、非认证用户）1天内可群发1条消息 5、公众号的两种模式： （1）编辑模式：直接使用微信公众平台所提供的后台操作进行用户交互。编辑模式可以使用在如下的场景：不具备开发能力的运营者，主要是进行品牌宣传、新闻媒体、自助客服的公众账号，运营初期，不需要特别多的功能等特殊情况。 （2）开发者模式：直接使用接口代码实现用户的交流。 另外还可以进行微信公众号二次开发，随着微信的推广和普及，原来微信公众号的基础功能都非常简单，对于部分企业商家来说，往往无法满足其需求。微信公众号的开发流程一般有以下几点： 1、需求提交并确认。在进行开发前，企业要首先结合自身发展情况对公众号作出详细的开发规划，并结合规划提出明确的功能开发需求，然后和开发公司再次沟通确认。 2、功能设计。基于明确的需求方案，开发公司的产品经理需要进行微信公众号的功能设计。就是将企业的需求和实际情况捋顺，明确功能设置和运行的逻辑，形成功能开发的大致框架。随后根据出现的矛盾与问题随时进行调整。 3、具体开发。开发环节由技术开发人员在微信公众号原有的逻辑框架之上，结合产品经理做的项目框架进行页面设计、功能搭建、测试等工作。 4、验收确认。当开发公司完成所有开发工作后，企业要对产品的开发成果进行验收，例如：看开发的功能、页面、布局、产品展示等等是否符合自己的需求。如果需要修改和优化，则可以将意见反馈给项目经理进行确认，技术员去具体操作完善，而如果需要对大框架进行修改调整，或增加新的需求，则需要进行再次评估，确定方案后再进行开发。项目完全完成后，由双方进行确认

1、公众号类型功能介绍   [图片] 2、服务号、订阅号功能区别  [图片] 3、小程序介绍   主要优势 1、用户可便捷地获取服务，无需安装或下载即可使用； 2、具有更丰富的功能和出色的使用体验； 3、封装一系列接口能力，帮助快速开发和迭代。 [图片] 4、企业微信介绍  [图片]

为更好地满足小程序客服人员使用网页端客服的需求，同时结合用户的反馈，平台更新网页端客服离线状态、黑名单、快捷键、小程序/小商店后台跳转网页客服、聊天消息识别超链接的能力，满足客服的使用需求。 本次更新点： 1. 客服离线状态 客服离线后，对于已接入会话，若用户再次咨询，则会话进入待接入列表，其他客服可以接入会话并看到该用户历史聊天记录。客服离线后，不允许客服对已接入会话发送消息，也允许转发、结束会话、自动接入、自动回复等功能，若要使用，需重新开启在线状态。 2. 黑名单能力 针对来自用户的骚扰，平台推出黑名单，客服可拉黑用户，拉黑后不会收到用户咨询的消息。同时，在设置内可对被拉黑的用户进行管理。 [图片] [图片] 3. 网页端客服快捷键 针对网页端客服在PC操作的习惯，平台推出网页端客服基础功能快捷键，提高客服在网页端的处理效率。 消息发送 Enter输入换行 Shift + Enter结束预览图片 Esc选择已接入列表内上一个会话 ↑选择已接入列表内下一个会话 ↓ 4. 小程序/小商店管理后台直接跳转网页端客服 为方便小程序/小商店管理后台客服入口直接进入网页端客服，平台支持直接带登录态跳转，从而省去再次扫码登录网页客服的隔断式体验。 5. 聊天消息识别超链接，支持点击跳转 支持识别并点击跳转客服会话消息中的超链接。如遇异常链接会弹窗提示异常并二次确认继续访问，保障用户资金和财产安全。

为更好地满足小程序客服人员使用网页端客服的需求，平台支持客服名称备注，迭代自动回复，新增文字链消息，提升客服的沟通效率。 本次更新点： 1. 支持客服名称备注 为便于客服间互相辨识，平台将MP后台和客服系统内展示的客服人员名称为微信昵称支持备注，并将备注展示在转接、数据面板等客服名称出现的场景，旨在提高客服的工作效率。 1.1 备注修改入口：小程序MP后台-客服-小程序客服-客服人员【编辑】 [图片] 1.2 备注展示位置 小程序MP后台网页端客服工作台：转接列表、转接留言、数据面板客服维度数据 & 明细数据下载表格移动端客服工作台（客服小助手）：转接留言、数据面板客服维度数据 2. 自动回复迭代 - 新增文字链消息 新增常见问题：文字链消息自动回复，支持客服管理员编辑[图片] 接入欢迎语：接入时回复支持个性化配置[图片] 离线回复：废除优先级，支持客服管理员编辑[图片] 关键词回复：调整为在线/离线（全部客服离线）状态均生效，支持客服管理员编辑[图片] 后续客服系统将会持续迭代更新，欢迎各位商家分享使用体验及建议。

为更好地满足小程序客服人员使用客服，让用户感受有温度的服务，平台将接入会话的客服人员名称展示在用户端客服会话页。 触发时机：客服接入会话 / 会话转接触发内容：「客服名称」为你服务用户端客服会话页展示样式[图片] 客服名称修改请参考：《小程序客服能力迭代 20220316》第1点更新 https://developers.weixin.qq.com/community/minihome/article/doc/000cc67f4787d0405b9dca53656413

客服数据面板提示小程序客服应答率低？ 一起来看看通过「开启自动回复」、「开启快捷回复」、「开启在微信接收客服应答质量数据报告」提高客服应答率吧！ [图片] 1. 开启自动回复 自动回复内可以设置4项自动发送消息的功能，包括「常见问题」、「接入欢迎语」、「离线回复」、「关键词回复」。 1.1 管理位置：PC客服（https://mpkf.weixin.qq.com/）：设置 - 自动回复 [图片] 1.2 功能介绍 常见问题：包括「开场白」(必填) 和「问题知识库」，支持客服管理员配置。客服管理员设置后，用户发送消息，客服无需接入会话即可自动回复常见问题。支持配置5组知识库，支持勾选生效。[图片] 接入欢迎语：客服接入会话时的自动回复，支持每个客服自定义配置。每个客服配置后，欢迎语会在接入会话时自动下发给用户。[图片] 离线回复：当小程序内全部客服离线状态下，用户咨询消息，客服自动回复离线回复。支持客服管理员配置。[图片] 关键词回复：至多5组问答知识库，当用户发送的消息命中关键词，客服自动下发回复消息，支持勾选生效，客服在线离线均生效。支持客服管理员配置。[图片] 2. 开启快捷回复 快捷回复便于客服针对用户的常见咨询下发快捷素材，支持「文本素材」和「小程序卡片素材」。 2.1 管理位置 PC客服（https://mpkf.weixin.qq.com/）：设置 - 快捷回复[图片] 移动端（「客服小助手」小程序）：设置 - 管理快捷回复[图片] 2.2 使用位置 PC客服（https://mpkf.weixin.qq.com/）：右侧扩展面板 - 快捷回复[图片] 移动端（「客服小助手」小程序）：会话页 - 快捷回复入口[图片] 3. 开启在微信接收客服应答质量数据报告 客服管理员在数据面板开启「在微信接收数据报告」后，客服管理员可每日定期查看每个客服的应答情况。 3.1 开启位置 PC客服（https://mpkf.weixin.qq.com/）：数据面板 - 开启数据报告[图片] 移动端（「客服小助手」小程序）：数据 - 订阅数据报告 - 开启[图片] 3.2 在微信接收报告 客服管理员开启报告后，可在 微信 - 微信公众平台 接收客服应答报告，点击模板消息可前往「客服小助手」查看详情。 [图片] [图片] 后续小程序客服将会推出更多提高客服应答的工具，敬请期待！ 欢迎各位开发者/商家分享使用体验及建议。

需求描述 小程序目前的主要能力还都在小程序端实现，但是我们在进行开发的小程序不可能只有小程序端能力，我们也会有一些管理端能力。比如说，当用户在小程序中提交了消息以后，我们的小程序应该可以通知到小程序的管理员，以便让管理员进行下一步操作。 解决方案 架构说明 由于小程序本身不支持长久性的消息通知能力，因此，我们可以考虑借助一些第三方的服务和能力，来完成我们自己的需求。 这个需求很适合使用小程序新发布的长期订阅消息能力，但是目前该能力开放的类目还不足以支持我们的需要。 一般而言，使用短信是我们目前到达率比较高的能力，且更为普遍的能力，其他通道的能力大多受限或不符合国情，为了确保通知信息的到达率，我们这篇文章就使用短信来完成需求。 架构图示 [图片] 具体操作 1. 开通腾讯云短信服务并获取配置信息 我们想要发送短信，就需要先有一个短信服务，用于发送短信，这里我们可以使用腾讯云提供的云短信服务来发送短信。 开通腾讯云短信，并创建应用 首先，你需要访问 https://console.cloud.tencent.com/smsv2 ,点击开通腾讯云·云短信。 在开通完成后，点击界面中的【添加应用】，添加一个新的短信应用，你可以根据自己的实际情况，添加短信应用的名称和简介。 [图片] 获取 AppID、App Key 添加完成后，点击你创建好的应用，进入到应用详情页,在应用的详情页中的应用信息栏目中，你可以找到 AppID 和 AppKey ，复制并保存这两个值，稍候我们会用到。 [图片] 2. 配置短信模板、短信签名 开通了腾讯云短信服务以后，我们需要去创建短信模板，以及短信签名 腾讯云短信并不是让你随意发所有的内容的，而是你需要创建一个模板，并使用特定的模板来完成短信的发送。 短信签名则是原来让收到短信的用户知道他所收到的短信来自于他的那一个服务，一般来说，设置为产品的品名。 在腾讯云控制台中，进入到【云短信】控制台 创建短信签名 首先，点击【国内短信】，进入到短信的页面，点击【创建签名】，然后在弹出的窗口中输入你的签名的具体信息，比如这里我就是以公众号【程序百晓生】来创建签名。 [图片] 签名创建完成后，你需要等待腾讯云官方的审核，审核通过以后，你添加的签名才可以被使用。 创建短信模板 创建完签名，你需要创建一个短信的正文模板，用于发送短信。 输入模板名称、短信类型，然后选择标准模板中的模板，这里我们选择“您有新的{1}订单，请注意查收！”这个模板。 除了使用标准模板，你也可以自己编写一个模板，为了方便文章撰写，这里使用标准模板。 [图片] 然后点击提交，等待审核就可以了。 3.编写云函数发送短信 在完成了基础的配置后，我们在微信开发者工具中实现一个云函数，用于调用腾讯云的短信服务，实现具体的通知。 首先，我们创建一个新的云函数，名为 [代码]notifyAdmin[代码]，意为用于通知管理员的云函数。 [图片] 然后，选择我们刚刚创建的 [代码]notifyAdmin[代码] 云函数，在函数上右击，选择【在终端中打开】，进入到控制台，并输入如下命令，安装所需的短信 SDK。 [代码]npm install --save sms-node-sdk [代码] [图片] 然后，修改云函数的 [代码]index.js[代码]，加入如下代码 [代码]// 云函数入口文件 const cloud = require('wx-server-sdk') const { SmsClient } = require('sms-node-sdk'); const AppID = 1400286810; // SDK AppID是1400开头 // 短信应用SDK AppKey ，替换为你自己的 AppKey const AppKey = 'xxxx'; // 需要发送短信的手机号码 const phoneNumber = '10000000'; // 短信模板ID，需要在短信应用中申请 const templId = 476457; // 签名，替换为你自己申请的签名 const smsSign = '程序百晓生'; // 实例化smsClient cloud.init() // 云函数入口函数 exports.main = async (event, context) => { let orderId = event.orderId; let smsClient = new SmsClient({ AppID, AppKey }); return await smsClient.init({ action: 'SmsSingleSendTemplate', data: { nationCode: '86', phoneNumber, templId: templId, params: [orderId], sign: smsSign // 签名参数未提供或者为空时，会使用默认签名发送短信 } }) } [代码] 完成代码的修改后，就可以部署你的云函数了，右键你的云函数，选择【上传并部署云函数：云端安装依赖】 4. 在小程序端触发短信 在前面我们提到，在一些特定的场景下，我们希望用户的操作可以给管理员发送消息通知。在具体的实现的时候，我们可以根据自己的实际业务需求，来设定我们的通知发送的条件，比如说，在用户支付成功后发送消息，则相关代码如下： [代码]let orderId = 'this is a orderId'; wx.requestPayment({ success:res => { console.log("User Payment Success"); // 调用云函数发送短信 wx.cloud.callFunction({ name:"notifyAdmin", data:{ orderId: orderId } }); } }) [代码] 总结 经过本次的分享，我们了解到了如何借助短信服务，实现云开发的后台通知能力，实际上，除了短信服务，你还可以借助一些其他的工具，比如邮件、企业微信机器人等能力，实现后台管理信息的推送。 明天，我们将分享如何借助通过微信发送订单消息。

瀑布流又称瀑布流式布局，是比较流行的一种网站页面布局方式。视觉表现为参差不齐的多栏布局，即多行等宽元素排列，后面的元素依次添加到其后，等宽不等高，根据图片原比例缩放直至宽度达到我们的要求，依次放入到高度最低的那一栏。 先上代码：https://developers.weixin.qq.com/s/Fgm5s1mz7Wdm 所谓简单，是指只考虑图片，图片之外的其他元素高度固定，不在考虑范围内。 说一下基本的实现思路： 1、加载列表数据 2、在一个隐藏的view中加载图片，通过image组件的bindload获取图片的实际宽高并存储 3、等所有图片加载完成后遍历列表，将图片插入到高度低的那一栏，同时更新该栏高度 我也考虑过在第二步bindload获取到宽高后就直接插入到栏位中，但是会出现小的图片先加载完先出现到页面中，虽然瀑布流不是普通的列表那样的排序，但是也不能小的图片在上面这样太乱顺序，所以就改成了获取宽高先存储，等所有图片加载完成后再往页面上渲染。 来看看实际的代码 不需要渲染到wxml中的数据，我放到了jsData中，主要是两栏的高度和是否在加载数据的标记。 tempPics是第一次加载的数据，临时存放，用于加载图片宽高 columns是两个栏位的实际展示数据 [代码]jsData: { columnsHeight: [0, 0], isLoading: false }, data: { columns: [ [], [] ], tempPics: [] } [代码] 1、加载列表数据 这一步没什么好说的，主要是触发方式，我的代码里是放在页面加载以及拉到页面底部时触发 [代码]onLoad: function() { this.loadData() }, onReachBottom: function() { this.loadData() } [代码] 加载后将列表数据存到tempPics中，用于页面加载获取宽高 2、在一个隐藏的view中加载图片，通过image组件的bindload获取图片的实际宽高并存储 [代码]<view class="hide"> <image wx:for="{{tempPics}}" src="{{item.pic}}" bindload="loadPic" binderror="loadPicError" data-index="{{index}}" /> </view> [代码] 主要是image组件的bindload来获取实际宽高，这里还增加了binderror，防止出现图片加载出错的时候卡死 [代码]loadPic: function(e) { var that = this, data = that.data, tempPics = data.tempPics, index = e.currentTarget.dataset.index if (tempPics[index]) { //以750为宽度算出相对应的高度 tempPics[index].height = e.detail.height * 750 / e.detail.width tempPics[index].isLoad = true } that.setData({ tempPics: tempPics }, function() { that.finLoadPic() }) } [代码] 获取到宽高后，以750为宽度计算出相对应的高度并存储，然后增加一个加载完成的标记。加载出错后就强制高度为750，这样展示的时候就是一个正方形。 单个图片加载完成并存储后调用finLoadPic方法来判断所有图片是否都加载完成。 遍历列表，只要有一个图片没有加载完成的标记，就判断为没有加载完成。 加载完成后进入下一步。 [代码]finLoadPic: function() { var that = this, data = that.data, tempPics = data.tempPics, length = tempPics.length, fin = true for (var i = 0; i < length; i++) { if (!tempPics[i].isLoad) { fin = false break } } if (fin) { wx.hideLoading() if (that.jsData.isLoading) { that.jsData.isLoading = false that.renderPage() } } } [代码] 3、等所有图片加载完成后遍历列表，将图片插入到高度低的那一栏，同时更新该栏高度 这里需要再便利一遍列表，根据当前栏位的高度情况，将图片插入到高度底的那一栏，同时把这一栏高度加上当前图片的高度（不是实际高度，是上一步以750为宽度算出来的高度） [代码]renderPage: function() { var that = this, data = that.data, columns = data.columns, tempPics = data.tempPics, length = tempPics.length, columnsHeight = that.jsData.columnsHeight, index = 0 for (var i = 0; i < length; i++) { index = columnsHeight[1] < columnsHeight[0] ? 1 : 0 columns[index].push(tempPics[i]) columnsHeight[index] += tempPics[i].height } that.setData({ columns: columns, tempPics: [] }) that.jsData.columnsHeight = columnsHeight } [代码] 在wxml中展示的时候image组件的mode要使用widthFix，同时wxss中图片的高度和宽度一样，这样加载出错的图片可以正方形展示 11月21日增加： 根据@杨泉的建议，也尝试了使用wx.getImageInfo来获取图片的宽高（具体代码可以参考评论区），代码也精简了很多。但是实际比较下来速度要比用image组件慢，初步推测原因是[代码]wx.getImageInfo[代码]会返回本地路径，多了写本地临时文件的时间 ps：用到瀑布流的地方，最好能后端直接返回图片的宽高，省去小程序端获取宽高的麻烦 再ps：我个人并不建议小程序端使用瀑布流

此文章致力解决在开发微信支付相关接口报【签名错误】，并不断升级更新 文章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第二次签名到底什么机制？】