酷应用开发

酷应用介绍

酷应用是一种全新的场景化应用，将应用功能与钉钉内多产品场景融合，打造沉浸式使用体验，开创全新交互方式，提升数据赋能能力，从人找应用到应用找人，打造场景化协同新体验。

将复杂功能解构，重新按场景融合

酷应用是一种基于沉浸式、场景化、网络协同和数据普惠理念的全新应用形态。不同于传统TOB应用，由比较复杂的功能、单据、流程和报表组成
酷应用使用非常轻量化的方式，将复杂功能、流程和报表解构，碎片化、千人千面化，让这些功能出现在高频的协作场景中
比如单聊、群聊、日程、文档、搜索、工作台等。

酷应用开发

1. 项目搭建，与开发H5页面类似，使用umi3+antd-mobile搭建一个H5页面，ding-desgin组件和功能较少
2. 在钉钉微应用中新建一个需要的应用

3. 将网站地址转为AppLink协议的链接填入对应入口，对前端来说，把相应的功能做成路由级页面，在需要的地方配置 转换地址

4. 实现免登 npm install dingtalk-jsapi

graph LR
A[dingtalkjsapi获取免登码] --> D[通过免登码从后端获取token] --> 本地存储token --> B[登录成功]
B --> C{token是否过期}
C -->|是| A
C -->|否| B
服务端存储的系统用户和钉钉用户的映射 --> D

调试方法

推荐微应用调试工具-RC版，其他的使用效果没那么理想open.dingtalk.com/document/re…

IOS兼容问题

IOS 100vh

解决

@supports (-webkit-touch-callout: none) {
    height: -webkit-fill-available;
 }

会产生新问题，无法使用calc计算高度，修改为

useEffect(() => {
    const getHeight = () => {
      setHeight(window.innerHeight);
    };
    window.addEventListener('resize', getHeight);
    return () => {
      window.removeEventListener('resize', getHeight);
    };
}, []);