微信小程序开发文档

小程序相关介绍 在测试前，先简单理解下小程序特性。 小程序发布审核 发布前需申请外网域名，并在微信web开发者工具里找到项目，设置好服务器的域名。 开发完上传代码后，在微信公众平台—》登录小程序管理后台—》点击开发管理—》点击提交版本审核即可。 审核通过后会有相应提示，接着把审核通过的小程序发布线上；若未审核通过可做相应修改继续提审。 第一次提交小程序审核时，需先上线后端，一般第一次审核时间比较久（3d左右）。 小程序的限制 页面层级跳转不能超过10层。 用户本地缓存不能超过10MB。 小程序代码包不能超过3M，所以部分图片资源需上传CDN。 小程序发布需提交微信审核通过才可发版。 提交审核前，外网域名需申请（除微信域名之外）。 层级问题 小程序原生页面存在10层限制问题，即超过10层时便无法打开新页面，而业务流程或者访问形成闭环时，很容易陷入10层问题。 为避免层级限制导致的无法打开页面和层级限制带来的交互路径限制，内部提出了【层级策略】以解决层级限制问题。 【层级策略】将页面路径存储到storage，返回时则刷新拉取存储的页面路径，目前只保存页面路径，不保存表单等数据。具体解决方案见文档“层级策略.txt”。 服务通知 基于微信的通知渠道，为开发者提供了可以高效触达用户的模板消息能力，以便实现服务的闭环并提供更佳的体验。 模板推送位置：服务通知。模板下发条件

这篇博客，记录下我测试小程序的一些心得： 一、测试前准备： 1、环境搭建，环境配置，前端页面，必要的时候可以下载微信web开发工具，参考文档如下， https://www.jianshu.com/p/4d3190111eb0 2、管理后台，准备数据，准备账户 二、测试范围： 1、权限测试： 未授权登录小程序--未授权的时候，进行业务的操作，一般使用这个都会弹出框，提醒你先授权在登录小程序； ps ：在这一块，特别注意小程序的分享，分享打开后，没有授权情况，业务是你能查看；还有就是老用户，小程序被kill了，又打开，需要授权，页面、业务ok; 已授权登录小程序--正向业务，意味着微信账号北小程序管理方所获取，自动以微信的身份进行业务的操作； 同一个微信号在不同手机上进行登录授权--所查看的数据无疑 ps :小程序的授权基本都是没什么大问题，还需要关注下布局，页面，未授权有些核心业务是不能看到的； 2、功能测试： 按照功能模块测试：所有的功能测试，从最开始的，都是从这一层开始，把大功能模块，划分小的功能模块，覆盖每个细节，具体的方法不再赘述； 按照业务流程测试：业务流程，就是使用用户可能的一些操作场景，同一个业务可能又不同的路径去实现，所以都需要去覆盖； 按照数据流向测试：根据数据从某一端操作输入和输出流向，设计基于数据流向的测试用例，检查输入的数据是否按照代码的逻辑执行正常的输出

前段时间不是很忙，刚好公司需要开发一个微信小程序，于是我就入坑了（此坑还是有点深滴，请备好干粮）。 我是一名iOS开发工程师，个人觉得入门开发小程序的话，需要基本的web前端知识，比如说：代码的书写格式，规范，标签以及样式的使用等，但作为一门如此新的开发语言，它也有自己的独特之处，就像我们的swift，融合了万家语言于一体，学好它就可以敲遍天下无敌手了（程序猿的毛病又犯了。。。）。它的外表看起来有点像传统的web开发，但它实质的开发思想又和我们的oc很像，比如它的 app.js、app.json、app.wxss 这三个全局文件的作用，还有数据绑定的开发模式。下面就说说自己的入坑经历吧，希望对大家有点点帮助。 先说一些大家上手小程序时都会问到的问题： Q：小程序可以和现有的App 打通吗？ A：小程序可以借助微信联合登录，和开发者已有的App 后台的用户数据进行打通，但不会支持小程序和App 直接的跳转。 Q：微信已经有了订阅号、服务号、企业号，小程序和这三者有什么不同？ A：小程序、订阅号、服务号、企业号是并行的体系。 Q：小程序可以个人开发吗？ A：小程序允许个人开发，只是个人开发是不能发布的，并且想在真机上看到的话，在创建小程序时就得填上你申请好的appid。 Q：小程序需要付费吗？ A：个人是不需要的，公司的需要一个被认证过的微信服务号，不需再付额外的费用

平台视角认识小程序 写在前面 小程序技术和生态已然已经被很多人熟知，但： 为什么火的是小程序？ 小程序战场战况如何？ 小程序的优势在哪？ 能给业务方带来什么？ 哪些业务适合用小程序？ 小程序跟其他跨端方案有怎样的区别和关系？ 小程序的能力怎么样？ 发展空间和愿景怎么样？ 本文试图以文档方式从各个疑问点出发给大家做个分享，希望能让大家有个宏观的认识，更好的结合各自的业务发展诉求，为平台和生态的发展贡献更多的可能。 展开问题回答前，概念先对齐下 ？ 小程序，主要泛指像微信、支付宝、头条、抖音、百度、快应用这样的即时应用方案。 叫法主要从微信开始和推出（ 较强的先发优势），推出不需要下载安装即可使用的应用，不安装情况下随时「触手可及」。该思路和玩法并非微信首创， 更早期由多家提出的 instant APP 、 轻应用 及后来的 快应用多属这个范畴。即平台方为扩展和丰富生态，给开发者提供的供用户使用的可即时打开的应用形态。（对小程序更多定义可参见 白皮书 ） 为什么火的是小程序？ 上边概念时讲到， 在这个开发者生态领域有很多公司在尝试和发展，通过提供平台解决方案引入更多开发者，构建生态和丰富生态的玩法。 早在07年， facebook就有推出开放平台，当时facebook开放了一些核心功能的接口，让开发者可以将应用程序中的功能与Facebook结合，到10年已经与超过100万开发者和创业者

2、代码高亮WebStorm/PhpStorm（其他工具参见： wepy官网代码高亮 ） （1）打开 Settings ，搜索 Plugins ，搜索 Vue.js 插件并安装。 （2） 打开 Settings ，搜索 File Types ，找到 Vue.js Template ，在 Registered Patterns 添加 *.wpy ，即可高亮。 3、代码优化 （1）代码规范 wepy标签和原生一样 自定义组件命名应避开：原生组件名（ input、button、view、repeat 等）、WePY的辅助标签 <repeat> 变量/方法名尽量使用驼峰式命名，避免使用 $ 开头（ $ 开头的标识符是WePY内建属性/方法，可在js中以 this. 的方式直接使用，具体请 参考API文档 ） app、pages、components文件名的后缀为 .wpy ，外链的文件可以是其它后缀。 具体请参考 wpy文件说明 。 支持ES6/7的一些新特性，框架在ES6(ECMAScript 6)下开发（默认使用babel编译），因此也需要使用ES6开发小程序，ES6中有大量的语法糖可以让我们的代码更加简洁高效。 wepy继承了wx对象的方法，建议在wepy框架开发中不要用到wx对象的方法，虽然运行时效果是一样，但是打包时会cli报错（wepy中没有wx对象

微信小程序-- 分享功能 微信小程序前段时间开放了小程序右上角的分享功能， 可以分享任意一个页面到 好友 或者 群聊 ， 但是不能分享到朋友圈 这里有微信开发文档链接： 点击跳转到微信分享功能API 入口方法： 一，小程序右上角自带的分享功能（...）： 以下代码实例写在export default { };里面 //右上角分享功能 onShareAppMessage: function(res) { var that = this; return { title: that.article.title, path: 'pages/text/main?id='+that.$mp.query.id, success: function(res) {}, fail: function(res) {} }; } title: 为转发的标题 path: 为转发的路径（这个路径是对方如果点击你分享的内容跳转回小程序时，在小程序中显示的页面的路径，很明显后面传递的参数是此页面打开时所需要的参数【如果需要参数的话，当然也可以不传】） 二，自定义 分享按钮 ：<button open-type='share'>分享</button> 分享---数据类型 不管采用以上何种方法，转发给好友的数据总归有它的数据模型，该数据模型是通过onShareAppMessage(options)返回的

WXML WXML（WeiXin Markup Language）是微信的一套标签语言，结合基础组件、事件系统，可以构建出页面的结构。 （小安娜：好像很厉害的样子，那基础组件、事件系统是什么？感觉更厉害，因为必须结合它们。） ，基础组件类似HTML中的标签，事件系统是JavaScript中的事件，可处理逻辑反应到界面上；wxml只是一个文件格式，如果没有组件和事件它没任何用处，又如果把组件、事件写在txt文档里面也没任何用处，所以没有谁更厉害，相辅相成的关系。 （小安娜：嗦嘎，就好像ap、ad、adc的关系，一起才最强） 用以下一些简单的例子来看看 WXML 具有什么能力： 数据绑定 WXML 中的动态数据均来自对应** Page 的 data 对象**。 简单绑定 数据绑定使用 Mustache 语法（双大括号）将变量包起来，可以作用于以下： （小安娜：等等，有没有点诚意，Mustache是什么都不知道！） ，Mustache是基于JavaScript实现的模板解析引擎，等等…总之它非常方便和好用。 （小安娜：我去，你自己也不知道是什么吧） 内容 <view> {{ message }} </view> Page({ data: { message: 'Hello MINA!' } }) 显示结果： （小安娜： <view> 代表什么意思，记得HTML中没这样的标签啊？）

在开发的很多电商类型的项目中，免不了会遇到三级联动选择地址信息，如果单纯的使用文本框给用户选择，用户体检可能就会差很多。今天我给大家整理了关于小程序开发利用picker-view组件和animation来实现省市区的三级联动 效果如图： 首先我觉的大家需要先去阅读下小程序有关picker-view和animation相关的api，然后再跟着这篇文章来理一下思路，一定会有深刻的理解。 文档连接传送门： https://developers.weixin.qq.com/miniprogram/dev/component/picker-view.html?search-key=picker-view 省市区mock数据传送门： https://github.com/18291907191/tools/blob/master/mock.js DOMO如下： 第一步：先布局wml页面： 1 <view class="picker-view" animation="{{animationAddressMenu}}" style="visibility:{{addressMenuIsShow ? 'visible':'hidden'}}"> 2 <!-- 确认取消按钮 --> 3 <view class='btn'> 4 <text catchtap="cityCancel">取消</text>

指南： 小程序宿主环境 程序与页面 app.json的pages字段，可以知道当前小程序的所有页面路径。 { "pages": ["pages/index/index", "pages/logs/logs"] } 这个配置说明在项目里定义了两个页面，字段的第一个页面是小程序的首页。 小程序启动后，app.js的APP实例，它里面的onLaunch的回调会被执行。 App({ onLaunch() { // 小程序启动之后 触发 } }) 看看小程序的一个页面是怎么写的， 首先，.json文件配置生成一个界面，接着，装载这个页面的WXML和WXSS文件，最后装载js文件。 js文件是由页面构造器Page（）生成，里面是各种对象，默认的是data对象和onLoad方法。 组件 通过写组件标签名显示组件。 在组件里写明属性传值，也可以写事件函数，来处理相关行为。 <map bindmarkertap="markertap" longitude="广州经度" latitude="广州纬度"></map> bindmarkertap就是一个事件，后面两个是属性。 API 微信小程序提供了很多内置的API。比如调用微信扫一扫功能， wx.scanCode({ success: (res) => { console.log(res) } }) 多数API的回调都是异步的，这句话其实我并不明白。

【推荐】2019 Java 开发者跳槽指南.pdf(吐血整理) >>> 前段时间收到一个消息，小程序模板消息发生了改版，小程序模板消息接口下线，正好项目中用到了小程序的模板消息推送，对项目小程序模板消息推送改造之后在这里做个总结。 以下是收到官方通知消息原文： 请注意，小程序模板消息接口将于2020年1月10日下线，开发者可使用订阅消息功能，基于微信的通知渠道，我们为开发者提供了可以高效触达用户的模板消息能力，以便实现服务的闭环并提供更佳的体验。 小程序模板消息能力在帮助小程序实现服务闭环的同时，也存在一些问题，如： 1. 部分开发者在用户无预期或未进行服务的情况下发送与用户无关的消息，对用户产生了骚扰； 2. 模板消息需在用户访问小程序后的 7 天内下发，不能满足部分业务的时间要求。 为提升小程序模板消息能力的使用体验，我们对模板消息的下发条件进行了调整，由用户自主订阅所需消息。 一次性订阅消息 一次性订阅消息用于解决用户使用小程序后，后续服务环节的通知问题。用户自主订阅后，开发者可不限时间地下发一条对应的服务消息；每条消息可单独订阅或退订。 这次调整较大，如果项目中有涉及到这部分的抓紧调整接口啦，具体消息参考以下文档。 官方：小程序模板消息能力调整通知 微信小程序官方开发文档 来源： oschina 链接： https://my.oschina.net/hp2017/blog