DCloud_UNI_CHB
DCloud_UNI_CHB
  • 发布:2019-09-03 21:16
  • 更新:2023-11-08 15:52
  • 阅读:33933

uni-app开发多端之钉钉小程序

分类:uni-app

经常有开发者咨询uni-app是否支持钉钉小程序

答案当然是支持!

本文通过将hello uni-app发布到钉钉小程序,演示如何使用uni-app开发钉钉小程序

扩展钉钉小程序平台

创建hello uni-app项目后,在项目根目录下新增或修改package.json,在根节点下新增如下扩展配置:

"uni-app": {  
    "scripts": {  
        "mp-dingtalk": {   
            "title":"钉钉小程序",   
            "env": {   
                "UNI_PLATFORM": "mp-alipay"   
            },  
            "define": {   
                "MP-DINGTALK": true   
            }  
        }  
    }  
}

运行到模拟器

HBuilderX会根据package.json的扩展配置,在运行菜单下,生成钉钉小程序菜单,如下图:

点击钉钉小程序菜单,开始编译,编译成功后,会自动打开支付宝开发者工具,展开左侧钉钉菜单,选择第三方个人应用,如下图:

然后点击右上角打开项目,选择编译目录(类似:%Project_root%/unpackage/dist/dev/mp-alipay/,注意:钉钉小程序复用支付宝小程序的编译目录),在接下来的界面中,注意修改项目名称,并特别注意修改项目类型为“钉钉 - 第三方个人应用”

项目导入后,支付宝开发者工具会进行编译载入,并在右侧模拟器上显示,如下:

在右侧模拟器上可以点击各页面进行测试。

发行到钉钉开放平台

同样,HBuilderX会根据package.json的扩展配置,在发行 -> 自定义发行菜单下,生成钉钉小程序菜单,如下图:

点击钉钉小程序菜单,开始编译,编译成功后,会自动打开支付宝开发者工具,展开左侧钉钉菜单,选择第三方个人应用,如下图:

然后点击右上角打开项目,选择编译目录(类似:%Project_root%/unpackage/dist/build/mp-alipay/,注意发行时是build目录,不是dev目录),在接下来的界面中,注意修改项目名称,并特别注意修改项目类型为“钉钉 - 第三方个人应用”

项目导入后,支付宝开发者工具会进行编译载入,并在右侧模拟器上显示,如下:

上传需登录后才能操作,使用手机端的钉钉App,扫码登录,

登录成功后,左上角选择关联的小程序(需提前在钉钉开放平台创建小程序),如下图:

点击支付宝开发者工具右上角的“上传”按钮,将代码上传到钉钉开放平台,上传成功后,即可在钉钉开放平台中进行版本发布,可设置为预览版,或直接提交审核:

注意:钉钉小程序的审核发布,需首先完成“钉钉组织认证”和“服务商认证”,提醒开发者提早完成认证,否则无法审核通过。

API调用

钉钉大部分api都是uni通用的API,hello uni-app是可以直接在钉钉里跑的。
如果你需要调用钉钉的专有API,和其他端开发也一样,在钉钉端可直接调用dd的API,当然要跨端的话,需要写在条件编译里。

5 关注 分享
DCloud_uniCloud_WYQ sonicsunsky 1***@163.com 3***@qq.com DCloud_UNI_HRK

要回复文章请先登录注册

尘雨雾录

尘雨雾录

回复 DCloud_UNI_CHB :
你理解错了,一个页面内,我写了// #ifdef MP-ALIPAY和// #ifdef MP-DINGTALK两个代码块。我选择支付宝小程序环境编译的时候,// #ifdef MP-DINGTALK下的代码块不会被编译进来。
但是我选择钉钉小程序环境后,// #ifdef MP-ALIPAY下的代码块会被编译进来。
我用的就是最新的HBuilder X
2019-09-30 09:13
DCloud_UNI_CHB

DCloud_UNI_CHB (作者)

回复 尘雨雾录 :
钉钉属于阿里小程序的子集,你可以判断条件修改为 ifdef mp-alipay && mp-dingtalk
2019-09-29 17:34
尘雨雾录

尘雨雾录

有一个bug,我在页面内同时写判断钉钉环境和判断支付宝环境,支付宝的那个判断条件语句内的代码,也会被编译到钉钉环境下
2019-09-28 19:55
lijunshuai

lijunshuai

回复 lijunshuai :
已解决
2019-09-06 08:41
lijunshuai

lijunshuai

package.json中加上那段代码报错:missing semicolon,请问这是什么原因
2019-09-05 22:28