[AI線上應用實戰] Bubble.io Backend Workflow 製作API

ECOE-avatar-img
發佈於資訊、程式 個房間
更新於 發佈於 閱讀時間約 3 分鐘

系列文章傳送門:[AI線上應用實戰] 如何快速建立你的AI線上應用 使用Bubble.io #Bubble.io教學


在傳統網頁或是應用程式架構中,會分成前端及後端,只要邏輯是涉及敏感資訊,例如金鑰、金流等,切記不要放在前端,以bubble.io來說,就是不要將相關workflow放在page workflow中。

舉個更詳細的例子:如果我們串接OpenAI API,並且希望動態切換金鑰(也就是沒辦法在API connector或是插件設定頁面中放入private金鑰,因為private key皆無法在程式執行時改動,即使是在backend也一樣),因此openai金鑰只能以public形式在bubble.io中使用,如果這樣的邏輯放在page workflow,無疑是將自己的金鑰暴露給大眾了。

因此,將這類涉及機敏或是高重複性的功能放在backend workflow是必要的。要在page workflow中使用backend workflow有兩種方式

  • 建立後端API workflow,在前端Schedule API workflow,此方法的缺點是沒辦法及時得到API回傳。必須用其他方式監控結果。常見的做法是前端用一個when邏輯,隨時監測API workflow dump的地方,如果有變化,就在前端更新
  • 建立後端API workflow,用plugin API connector串聯,並在前端使用。此方法的好處是可以及時拿到回傳,缺點是設定多一步

實際操作

建立後端API workflow

raw-image

設定API name及parameter

raw-image

設定API回傳,之後就可以開始寫API邏輯

raw-image


用plugin API connector串聯

首先在設定頁面建立token,並複製Workflow API root URL

raw-image

之後在plugin API connector中填寫該API,要注意這邊的參數要與剛剛設計backend API workflow的參數一致。

raw-image


之後就可以在前端使用,不管是用schedule、或是直接call api connector都可以





想要更有系統的學習嗎?

歡迎至Google BooksReadmoo購買《零基礎開發AI應用: Bubble實戰指南》。在本書中我們深入淺出的教您使用Bubble平台,並結合最新最潮的AI技術,讓你輕鬆完成你的創業夢。

raw-image



























留言
avatar-img
留言分享你的想法!
avatar-img
ECOE的沙龍
4會員
41內容數
ECOE的沙龍的其他內容
2025/02/03
付費工具:Mathpix 可以用螢幕矩形截圖的方式快速將數學公式、表格轉乘latex,用於latex文件或是Markdown,但月費蠻高的 免費替代品pix2tex 原始碼: https://github.com/lukas-blecher/LaTeX-OCR 精準度比mathpix差
Thumbnail
2025/02/03
付費工具:Mathpix 可以用螢幕矩形截圖的方式快速將數學公式、表格轉乘latex,用於latex文件或是Markdown,但月費蠻高的 免費替代品pix2tex 原始碼: https://github.com/lukas-blecher/LaTeX-OCR 精準度比mathpix差
Thumbnail
2024/12/31
在購買電腦支架時,常常需要考量電腦主機的重量,一台電腦具體而言多重呢? 以筆者的主機為例 機殼: 8kg (MONTECH 君主 Air 1000 Silent 靜音版 ATX) 顯示卡: 0.753kg (GeForce RTX™ 3060 VENTUS 3X 12G OC) 主機板: 1.
2024/12/31
在購買電腦支架時,常常需要考量電腦主機的重量,一台電腦具體而言多重呢? 以筆者的主機為例 機殼: 8kg (MONTECH 君主 Air 1000 Silent 靜音版 ATX) 顯示卡: 0.753kg (GeForce RTX™ 3060 VENTUS 3X 12G OC) 主機板: 1.
2024/11/15
(詳細API參考: Advanced Reference) 使用GPU是AI研究、工程中不可或缺的一部份, VRAM 使用對於深度學習和高性能計算領域至關重要。有效分析和管理 VRAM 使用能幫助我們提升模型效率,避免不必要的記憶體(內存)溢出問題。 本文將帶你快速上手 NVIDIA 的 Nsi
Thumbnail
2024/11/15
(詳細API參考: Advanced Reference) 使用GPU是AI研究、工程中不可或缺的一部份, VRAM 使用對於深度學習和高性能計算領域至關重要。有效分析和管理 VRAM 使用能幫助我們提升模型效率,避免不必要的記憶體(內存)溢出問題。 本文將帶你快速上手 NVIDIA 的 Nsi
Thumbnail
看更多
你可能也想看
Thumbnail
每年4月、5月都是最多稅要繳的月份,當然大部份的人都是有機會繳到「綜合所得稅」,只是相當相當多人還不知道,原來繳給政府的稅!可以透過一些有活動的銀行信用卡或電子支付來繳,從繳費中賺一點點小確幸!就是賺個1%~2%大家也是很開心的,因為你們把沒回饋變成有回饋,就是用卡的最高境界 所得稅線上申報
Thumbnail
每年4月、5月都是最多稅要繳的月份,當然大部份的人都是有機會繳到「綜合所得稅」,只是相當相當多人還不知道,原來繳給政府的稅!可以透過一些有活動的銀行信用卡或電子支付來繳,從繳費中賺一點點小確幸!就是賺個1%~2%大家也是很開心的,因為你們把沒回饋變成有回饋,就是用卡的最高境界 所得稅線上申報
Thumbnail
全球科技產業的焦點,AKA 全村的希望 NVIDIA,於五月底正式發布了他們在今年 2025 第一季的財報 (輝達內部財務年度為 2026 Q1,實際日曆期間為今年二到四月),交出了打敗了市場預期的成績單。然而,在銷售持續高速成長的同時,川普政府加大對於中國的晶片管制......
Thumbnail
全球科技產業的焦點,AKA 全村的希望 NVIDIA,於五月底正式發布了他們在今年 2025 第一季的財報 (輝達內部財務年度為 2026 Q1,實際日曆期間為今年二到四月),交出了打敗了市場預期的成績單。然而,在銷售持續高速成長的同時,川普政府加大對於中國的晶片管制......
Thumbnail
※ 什麼是Web API API 就是後端開出來讓前端來用的介面,讓前端與後端可以溝通。 API流程: 終端使用者用任何一種裝置進入瀏覽器。 瀏覽器透過 API 向後端發出請求,請求查詢或修改資料。 後端透過 API 收到前端的請求後,取得資料並回應給前端。 前端渲染畫面,終端使用者
Thumbnail
※ 什麼是Web API API 就是後端開出來讓前端來用的介面,讓前端與後端可以溝通。 API流程: 終端使用者用任何一種裝置進入瀏覽器。 瀏覽器透過 API 向後端發出請求,請求查詢或修改資料。 後端透過 API 收到前端的請求後,取得資料並回應給前端。 前端渲染畫面,終端使用者
Thumbnail
記錄一下 API 串接的四種方式 www
Thumbnail
記錄一下 API 串接的四種方式 www
Thumbnail
API 是軟體串接的根本、資料互拋的媒介。它普遍出現在我們生活應用中,就是交換資訊的管道。透過 API 將不同軟體的資訊整合分享,既能將不同軟體的資料呈現在你的既有軟體,也能擴充新功能!現在 NoCode 自動化工具內含已整合好 API 的眾多軟體模組,讓你不用寫程式,選取想整合的軟體就能完成串接!
Thumbnail
API 是軟體串接的根本、資料互拋的媒介。它普遍出現在我們生活應用中,就是交換資訊的管道。透過 API 將不同軟體的資訊整合分享,既能將不同軟體的資料呈現在你的既有軟體,也能擴充新功能!現在 NoCode 自動化工具內含已整合好 API 的眾多軟體模組,讓你不用寫程式,選取想整合的軟體就能完成串接!
Thumbnail
上一篇我們有介紹「【Postman工具箱】 Mock Server簡介」,相信對於Mock Server的用途應該都具備一些基本概念了,那這次就來介紹一套免費開源的工具庫「Mockoon」並附帶安裝架設的方法,讓我們簡單輕鬆的上架我們的模擬API Server。 系統開發的過程中,假設前/後端分離的
Thumbnail
上一篇我們有介紹「【Postman工具箱】 Mock Server簡介」,相信對於Mock Server的用途應該都具備一些基本概念了,那這次就來介紹一套免費開源的工具庫「Mockoon」並附帶安裝架設的方法,讓我們簡單輕鬆的上架我們的模擬API Server。 系統開發的過程中,假設前/後端分離的
Thumbnail
相信有在開發Web應用的朋友應該對於Postman這套工具相當熟悉, 這套工具可以協助我們在產品尚未完成之前可以先進行一些基本的介接測試,甚至我們可以使用Postman去呼叫雲端的API,像是Google的語音辨識、文字翻譯、字典查詢…,這類大廠相信也都開放許多標準API(Application P
Thumbnail
相信有在開發Web應用的朋友應該對於Postman這套工具相當熟悉, 這套工具可以協助我們在產品尚未完成之前可以先進行一些基本的介接測試,甚至我們可以使用Postman去呼叫雲端的API,像是Google的語音辨識、文字翻譯、字典查詢…,這類大廠相信也都開放許多標準API(Application P
Thumbnail
其實要為專案建立操作介面的方式很多,除了網頁之外,還能另外寫個專門的手機 APP 連線,或是乾脆升級算法,讓我們能隨口喊一聲「嘿OO!」就搞定,不過⋯
Thumbnail
其實要為專案建立操作介面的方式很多,除了網頁之外,還能另外寫個專門的手機 APP 連線,或是乾脆升級算法,讓我們能隨口喊一聲「嘿OO!」就搞定,不過⋯
Thumbnail
講完 get 來講 post,那這兩個 call api 的方法有什麼差別呢?先記得一個原則,要傳遞機密的資料用 post,如果要傳遞的參數被別人知道也無所謂就用 get post 是傳遞資料到後台,資料不會顯示在 url 上,get 是傳遞參數到後台,參數會直接顯示在 url 上和後端的終端上,像
Thumbnail
講完 get 來講 post,那這兩個 call api 的方法有什麼差別呢?先記得一個原則,要傳遞機密的資料用 post,如果要傳遞的參數被別人知道也無所謂就用 get post 是傳遞資料到後台,資料不會顯示在 url 上,get 是傳遞參數到後台,參數會直接顯示在 url 上和後端的終端上,像
Thumbnail
你想像有一個黑盒子,它會跟你說輸入一個input,而會得出什麼Output,而你要把這個Input傳遞給黑盒子是透過http的方式
Thumbnail
你想像有一個黑盒子,它會跟你說輸入一個input,而會得出什麼Output,而你要把這個Input傳遞給黑盒子是透過http的方式
Thumbnail
這篇文章要教你如何透過權限控管,保護 FastAPI 生成的 API 文件,讓使用者需要經過授權才能進去
Thumbnail
這篇文章要教你如何透過權限控管,保護 FastAPI 生成的 API 文件,讓使用者需要經過授權才能進去
追蹤感興趣的內容從 Google News 追蹤更多 vocus 的最新精選內容追蹤 Google News