使用 JavaScript 整批匯出 Dify Workflows

問題

Dify 可以在 Browser 上手動將 Workflow 匯出成 yml 檔案。
那麼，有辦法整批匯出嗎?

解法

上網查了一下，找到了Batch Import and Export of Dify Workflows Using JavaScript這個方式最容易。
直接在 Browser 的 Console 模擬手動的方式來匯出，程式如下:

const token = localStorage.getItem('console_token'); // 從 Local Storage 取得 Token

// 從目前瀏覽器的網址中動態取得網域和 tagIDs
const origin = window.location.origin; // 取得目前頁面的網域 (如 http://localhost)
const urlParams = new URLSearchParams(window.location.search);

// 發送第一個 API 請求取得 myList
const apiUrl = `${origin}/console/api/apps?page=1&limit=100&name=&is_created_by_me=false`;
fetch(apiUrl, {
    method: 'GET',
    headers: {
        'Authorization': `Bearer ${token}`, // 包含 Token
        'Content-Type': 'application/json'
    }
})
    .then(response => {
        if (!response.ok) {
            throw new Error('Network response was not ok');
        }
        return response.json(); // 自動解析 JSON 為 JavaScript 物件
    })
    .then(data => {
        const myList = data["data"]; // 假設資料結構是 { "data": [...] }
        console.log('成功取得資料:', myList);

        // 遍歷 myList 並發送請求
        myList.forEach(item => {
            const id = item["id"]; // 取得每個項目的 ID
            const name = item["name"]; // 檔案名稱改為 item["name"]
            const exportUrl = `${origin}/console/api/apps/${id}/export?include_secret=false`;

            // 發送請求到 export URL
            fetch(exportUrl, {
                method: 'GET',
                headers: {
                    'Authorization': `Bearer ${token}`,
                    'Content-Type': 'application/json'
                }
            })
                .then(response => {
                    if (!response.ok) {
                        throw new Error(`Export request failed for ID ${id}: ${response.statusText}`);
                    }
                    return response.json();
                })
                .then(exportData => {
                    console.log(`Export 成功 - ID: ${id}`, exportData);

                    // 僅取出 exportData["data"]
                    const dataToSave = exportData["data"];

                    // 將 JSON 物件轉成非雙引號格式的文字，去掉最外層的引號
                    const jsonString = JSON.stringify(dataToSave, null, 2)
                        .replace(/\\n/g, '\n') // 替換 \n 為實際換行符
                        .slice(1, -1); // 去掉最外層的雙引號

                    // 將資料儲存到本地檔案
                    const blob = new Blob([jsonString], { type: 'application/x-yaml' });
                    const fileName = `${name}.yml`; // 使用 .yaml 作為檔案名稱
                    const link = document.createElement('a');
                    link.href = URL.createObjectURL(blob);
                    link.download = fileName;
                    link.click();
                    URL.revokeObjectURL(link.href); // 清理 URL 物件
                })
                .catch(error => {
                    console.error(`Export 失敗 - ID: ${id}`, error);
                });
        });
    })
    .catch(error => {
        console.error('發送 API 請求時發生錯誤:', error);
    });

目前 Dify 1.5 版本中，並沒有 tagIDs 的參數，所以我將它從 url 中移除，並將limit設定為100，
所以目前每頁最多可以匯出 100 個workflow。
再加上&is_created_by_me=false參數。

整批匯出 Workflows

開啟 Dify 網頁，登入後，按 F12 打開開發者工具，點到 主控台 ，然後將程式碼貼上去就可以了，如下圖所示:

• 註: 如果發生 401 的錯誤，請重新整理網頁後，再將 Javascript 貼上去執行一次就可以了。
• 註: 如果要匯出下一頁的資料，請修改 url 中 page 的值，將它改成 2。

參考資源

Batch Import and Export of Dify Workflows Using JavaScript