【Miro】Miro入门

Miro入门

创建APP

https://miro.com/app/dashboard/ → 右上角头像 →「Settings」→「Your apps」→「Create new app」
会提示需要创建Team（如果本来没有加到Team中去应该创建完账号可以自己创建Team）
创建Team默认为「Dev team」

填写「App Name」，其中「Expire user authorization token」我理解的是可以对已发放的令牌进行失效管理，从而更加安全
创建结束后有一个「App Publication Status」是可以发布你的App，让别人也来使用，但是如果没有这个打算那么保持现状不用管就行了
「Permissions」中设置权限，我只希望能够控制添加组件并且阅览页面所以选了「boards:read」和「boards:write」之后点击下方蓝色「Install app and get OAuth token」按钮来获取Access Token

和Web SDK的区别

感觉重要的主要是这个表

特点/需求 Miro Web SDK Miro REST APIs

通过 UI 扩展点与白板上的用户进行实时交互
示例：显示带有自定义表单的面板 ✅ ❌

访问白板上的item ✅ ✅

访问团队数据 ❌ ✅

访问组织数据 ❌ ✅

第三方产品集成从Miro白板启动从第三方工具启动

在浏览器或Miro原生应用中打开白板白板必须开放 (online) 白板可以开放也可以不开放(online or offline)

后台托管非必须必须

语言 Typescript/JavaScript 任意

特点/需求	Miro Web SDK	Miro REST APIs
通过 UI 扩展点与白板上的用户进行实时交互示例：显示带有自定义表单的面板	✅	❌
访问白板上的item	✅	✅
访问团队数据	❌	✅
访问组织数据	❌	✅
第三方产品集成	从Miro白板启动	从第三方工具启动
在浏览器或Miro原生应用中打开白板	白板必须开放 (online)	白板可以开放也可以不开放(online or offline)
后台托管	非必须	必须
语言	Typescript/JavaScript	任意

代码控制

快速开始

官方文档

可以直接通过沙盒填写自己的Access Token以及必要参数(required)，选择所需语言（Shell/Node.js/Ruby/PHP/Python）点击「Try It!」按钮直接运行

代码控制（python）

只把我用过的记一下（不过App card我没用过）

准备

import requests
TOKEN = "YOUR_ACCESS_TOKEN"

注意事项

在使用REST API的时候，每一次调用就是开了一个访问请求，开得太多不关闭的话就会出现占用资源太多导致报错的情况出现

raise ConnectionError(e, request=request)
requests.exceptions.ConnectionError: HTTPSConnectionPool(host='api.miro.com', port=443): Max retries exceeded with url: (报错的URL) (Caused by NameResolutionError("<urllib3.connection.HTTPSConnection object at 0x000001BABF9570D0>: Failed to resolve 'api.miro.com' ([Errno 11002] getaddrinfo failed)"))

故要使用with让请求自动关闭

session = requests.Session()
with session.get(url, headers=headers) as response:
    [处理代码]

创建白板

方法一：

可以自己手动建好之后把白板ID存下来，创建好后点进白板界面
```
https://miro.com/app/board/{board_id}/
```
括号里的就是白板ID

方法二

url = "https://api.miro.com/v2/boards"
headers = {
    "accept": "application/json",
    "content-type": "application/json",
    "authorization": "Bearer " + TOKEN
}
with session.get(url, headers=headers) as response:
    response.raise_for_status()  # 检查是否有请求异常
    board_id = response.text['id']

App card和普通card

App card：可以把第三方的应用中的数据显示在card中，像是预览卡的感觉，详情示例请看 → App card官方介绍
普通card：可以显示title的card

新建App card

# 需要已经拿到board_id

url = "https://api.miro.com/v2/boards/" + board_id + "/app_cards"

payload = { "data": {
    	# 数组，每个元素表示一个自定义字段
        "fields": [
            {
                # 自定义字段的填充颜色
                "fillColor": "#2fa9e3",
                # 字段中icon的形状,"square"/"round"(Default)
                "iconShape": "square",
                # 字体颜色
                "textColor": "#1a1a1a",
                # icon链接
                "iconUrl": "https://cdn-icons-png.flaticon.com/512/5695/5695864.png",
                # 点击或鼠标悬停该字段时的文本
                "tooltip": "Completion status indicator",
                # 显示内容
                "value": "Status: in progress"
            }
        ],
    	# card的描述
        "description": "Sample app card description",
    	# card的显示文本
        "title": "sample app card item",
    	# card是否已连接并与源同步的状态，当源被删除时，状态将返回disabled
    	# "disconnected"(Default)/connected/disabled
        "status": "disconnected"
    } 
    """
    "style": { "fillColor": 填充颜色 },
    "position": {位置信息
        "x": x轴坐标,
        "y": y轴坐标
    },
    "geometry": {大小信息
        "height": 高度,
        "width": 宽度
    },
    "parent": { "id": 父亲item id }
    """}
headers = {
    "accept": "application/json",
    "content-type": "application/json",
    "authorization": "Bearer " + TOKEN
}

with session.post(url, json=payload, headers=headers) as response:
    response.raise_for_status()  # 检查是否有请求异常
    result = json.loads(response.text)
    print(result)

效果：

新建普通card

# 需要已经拿到board_id

url = "https://api.miro.com/v2/boards/" + board_id + "/app_cards"

payload = {
    "data": {
        # 通过用户ID把卡片和用户相关联
        "assigneeId": "USER_ID",
        "description": "sample card description",
        # 添加时间字段
        "dueDate": "2023-10-12T22:00:55.000Z",
        # card的显示文本
        "title": "sample card item"
    },
    # 边框颜色
    "style": { "cardTheme": "#2d9bf0" },
    "position": {
        "x": 100,
        "y": 100
    },
    "geometry": {
        "height": 60,
        "width": 320
    }
}
headers = {
    "accept": "application/json",
    "content-type": "application/json",
    "authorization": "Bearer " + TOKEN
}

with session.post(url, json=payload, headers=headers) as response:
    response.raise_for_status()  # 检查是否有请求异常
    result = json.loads(response.text)
    print(result)

效果：

创建连线（connector）

url = "https://api.miro.com/v2/boards/" + board_id + "/connectors"
payload = {
    "startItem": {"id": 起始card的id},
    "endItem": {"id": 结尾card的id},
    "captions": [{"content": 连线上的文字}]
}
headers = {
    "accept": "application/json",
    "content-type": "application/json",
    "authorization": "Bearer " + TOKEN
}
with session.post(url, json=payload, headers=headers) as response:
    response.raise_for_status()  # 检查是否有请求异常
    result = json.loads(response.text)
    print(result)

还可以更改箭头类型和线的粗细，详情参照 Create connector

获得item信息

获得该白板上所有item的信息

url = "https://api.miro.com/v2/boards/" + board_id + "/items"
headers = {
    "accept": "application/json",
    "authorization": "Bearer " + TOKEN
}  
with session.get(url, headers=headers) as response:
    response.raise_for_status()  # 检查是否有请求异常
    # result["data"]是list类型 可以使用for遍历获得信息
    # 获得item的id的话是result["data"]中各元素的'id'字段
    result = json.loads(response.text)
    return result
-----------------------------------
# RESPONSE示例可以去https://developers.miro.com/reference/get-items看

获取特定item的信息（需要先知道该item的id）

url = "https://api.miro.com/v2/boards/" + board_id + "/cards/" + item_id
headers = {
    "accept": "application/json",
    "authorization": "Bearer " + TOKEN
}
with session.get(url, headers=headers) as response:
    response.raise_for_status()  # 检查是否有请求异常
    result = json.loads(response.text)
    return result

更新card信息（需要先知道该card的id）

这里用更改文本内容做示例，更多的去 Update card item 查看

url = "https://api.miro.com/v2/boards/" + board_id + "/cards/" + card_id
payload = {"data": {"title": context}}
headers = {
    "accept": "application/json",
    "content-type": "application/json",
    "authorization": "Bearer " + TOKEN
}
with session.patch(url, json=payload, headers=headers) as response:
    if response.status_code == 200:
        print("successfully")

删除item（需要先知道该item的id）

url = "https://api.miro.com/v2/boards/" + board_id + "/items/" + item_id
headers = {
    "accept": "application/json",
    "authorization": "Bearer " + TOKEN
}
with session.delete(url, headers=headers) as response:
    if response.status_code == 200:
        print("successfully")

posted @ 2024-06-13 15:16 「『』」阅读(654) 评论(0) 收藏举报

刷新页面返回顶部

Twilight Theater