探究小程序插件

前段时间,微信释放了小程序插件功能。有了它,小程序开发者就可以通过这个功能,强化自身小程序能力;小程序服务提供商也可以用它,为开发者、用户提供强大的小程序功能支持,进一步拓展小程序能力。小程序插件功能的推出将大大促进小程序生态发展。

今天, 我们一起探究下微信小程序插件功能。

什么是微信小程序插件

插件一组由js和自定义组件封装的代码库,插件无法单独使用、也无法预览,必须被其他小程序应用嵌入,才能使用。

插件可以是:

  • 提供查询快递信息的服务
  • 提供查询天气的服务
  • 提供打车(滴滴)的服务 - 可以使用滴滴提供的组件,直接嵌入自己的小程序,实现打车功能)
  • 提供外卖(美团外卖)的服务 - 例如每个餐厅需要的小程序风格都不一样,但他都需要外卖功能,那这时就可以给餐厅都定制一个小程序,在外卖部分的功能可以直接使用美团外卖提供的外卖插件

除了可以做这些方面还有很多很多,但小程序插件目前限制了开放范围及服务类目(开放类目)

组件和插件的区别:组件是组件,插件是插件,插件是可以直接提供服务的,组件是给开发者的轮子提高开发效率的,这是两回事。

如何开发小程序插件?

新建插件的操作非常简单。只需要在微信开发者工具中新建小程序项目,并选择「建立插件快速启动模板」即可,开发者工具就会自动创建插件项目。

需要注意的是,新建项目时,需要确保选择的项目目录是空目录,否则不会显示「建立插件快速启动模板」选项。

填写名称和插件AppID后,进入小程序项目。 

在文件 project.config.json 中,我们看到代码如下:

{
   "miniprogramRoot": "./miniprogram",
   "pluginRoot": "./plugin",
   "compileType": "plugin",
   "setting": {
       "newFeature": true
},
   "appid": ".....",
   "projectname": "videoPlayer",
   "condition": {}
}
  • miniprogramRoot:配置小程序的根目录,可以使用小程序来测试编写的插件
  • pluginRoot:插件相关代码所在的根目录
  • compileType:项目的编译类型,必须配置为 plugin,在上传代码的时候才会以插件的方式上传到腾讯服务器

在 plugin/plugin.json 文件中,代码如下:

{
 "publicComponents": {
   "hgPlayer": "components/player/player"
 },
 "main": "index.js"
}
  • publicComponents:配置的是插件可以给使用的小程序提供哪些组件,一个插件可以定义很多个组件,组件和组件之间相互引用,但是小程序只能使用在publicComponents里配置的组件。
  • main:定义入口文件,在入口文件 index.js 中定义小程序可以使用插件的那些接口。

在 plugin/index.js 文件中,代码如下:

var data = require('./api/data.js')
module.exports = {
 getData: data.getData,
 setData: data.setData
}

在 plugin/index.js 定义了对外抛出接口为 getData 和 setData,小程序在使用这个插件的时候,只能使用到插件提供的这两个接口,插件的其他接口(或方法)小程序无法使用。

做好以上配置后,就可以开始在 plugin/components 编写组件代码了,例如我写了我的播放器组件,代码如下:

player.js:
Component({
 data: {
   myData:[]
 }
})

player.wxml:
<view class="section tc">
 <video id="myVideo" src="..."  enable-danmu danmu-btn controls>
 </video>
</view>

值得注意的是:

编写组件是调用 Component() 定义组件代码,和App() 、Page()一样的道理。

在组件能能够调用的微信API受限,比如说不能调用 wx.login() 获取用户信息,具体限制在:https://mp.weixin.qq.com/debug/wxadoc/dev/framework/plugin/api-limit.html

代码编写完毕后,注意在 plugin/plugin.json 文件配置:

{
 "publicComponents": {
   "hgPlayer": "components/player/player"
 },
 "main": "index.js"
}

表示使用该插件的小程序,可以使用 hgPlayer 这个组件,组件hgPlayer对应的代码是 "components/player/player"

配置好后,就可以上传插件代码到腾讯服务器,进入微信小程序开发者后台提交审核,腾讯审核通过后,第三方小程序就可以使用我们编写的这个插件了。

注:

1.开通插件功能条件:企业、媒体、政府及其他组织主体的小程序,个人小程序不行。一个小程序只能开通一个插件。

2.填写开发信息并开发限制:填写了小程序插件基本信息和头像就不能修改

3.提交审核、发布限制:在开发类目内才能提交官方文档说“插件发布后才可以被其他小程序搜索并添加”。

4.管理插件使用申请24小时内选择”通过“或”拒绝“申请方使用插件。

这个小程序开发文档有详情说明,文档里面有三处地方,我贴出来:

介绍小程序插件功能

小程序插件开发讲解

小程序插件在开发者工具中的使用

以上内容整理来源于微信开发者社区和网络,如有侵权请联系我们~

原文发布于微信公众号 - 极乐技术社区(wxapp-union)

原文发表时间:2018-03-20

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏渠道合作伙伴技术圈

基于腾讯云COS对象存储的文件存储网关部署 单目录挂载1PB!

另外设置两块硬盘时记住,元数据存储盘比缓存盘大1.5倍(该处一次性设置不可更改的)

75610
来自专栏Jerry的SAP技术分享

微信程序开发系列教程(三)使用微信API给微信用户发文本消息

这个系列的第二篇教程,介绍的实际是被动方式给微信用户发文本消息,即微信用户关注您的公众号时,微信平台将这个关注事件通过一个HTTP post发送到您的微信消息服...

3722
来自专栏Golang语言社区

go实现一个简单的游戏服务器框架(lotou)起源

https://github.com/sydnash/lotou 目前代码比较粗糙,欢迎各种改进建议。 最近一直想学习一些关于游戏服务器的知识,显示看了一下云...

36512
来自专栏快乐八哥

在Linux Mint上安装node.js和npm

1.安装Node.js 前端开发过程中,很多项目使用npm的http-server的模块来运行一个静态的服务器,我个人在Dell的笔记本上安装的是Linux M...

2537
来自专栏技术小黑屋

为Android程序申请权限注意

Android系统提供为程序提供了权限申请,即在manifest中使用uses-permission来申请即可.实现起来非常简单,但是有些问题会随之浮出水面. ...

2051
来自专栏北京马哥教育

Linux 命令大全,都在这里!

糖豆贴心提醒,本文阅读时间3分钟,文末有秘密! ? 编辑 | 糖豆 图 | 来源网络 ? 1、文件管理catchattrchgrpchmodchow...

3776
来自专栏开源项目

码云周刊:当测试拿起自动化测试工具,开发仿佛看见一场悲剧正在上演!

类型:自动化测试 虽然之前小一做过几年开发,但当时对于在公司兴起的自动化测试概念还不是很清楚,觉得是一种很神秘的东西,后来通过向业内资深的测试工程师朋友咨询才恍...

3949
来自专栏FreeBuf

挖洞经验|雅虎小企业服务平台Luminate身份认证漏洞

对内容管理系统的开发来说,一个重要和关键的步骤就是账户的身份认证实现。身份认证功能可以管理用户登录行为和会话,作出有效的登录访问控制。通常,这种认证功能一般由用...

3164
来自专栏tiane12

Linux/CentOS定期清空指定目录脚本

2524
来自专栏开源优测

移动测试Appium工作原理

移动测试Appium工作原理 介绍 Appium是一个开源工具,用于自动化iOS、Android设备和Windows桌面平台上的原生、移动Web和混合应用。 "...

5567

扫码关注云+社区

领取腾讯云代金券