2024-08-21|閱讀時間 ‧ 約 5 分鐘

[AI線上應用實戰] ToolBox Plugin 在Bubble.io前後端寫JS

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



在某些狀況下,難免會有一些需要高度客製化的場景、或是想要使用js(不管是自己寫還是想要使用既有的code or from chatgpt),這時候,Toolbox Plugin 就是必學的。


Toolbox Plugin分成Server side以及Client side。兩者有細微差異


Client Side

首先,要先在頁面裡加入js2bubble元件。

設定以下參數:

  • bubble_fn_suffix: 在你JS script要回傳結果給其他bubble元件的時候,callbubble_fn_[bubble_fn_suffix](result)。這樣就可以在APP的其他地方使用javascripttoBUbble.value來使用js回傳的結果(Publish value必須被勾起來)。
  • Trigger event: 如果勾選,JS呼叫bubble_fn_[bubble_fn_suffix](result)時,可以另起呼叫一個workflow
  • Multiple Outputs: 如果勾選,可以使用bubble_fn_[bubble_fn_suffix]({output1: ..., output2: ...,})的方式回傳,使得可以使用javascripttoBUbble.output1

接下來就可以在workflow中使用`run javascript:

var a = 10;
var b = 15;
result = a + b;
bubble_fn_add(result);
// or
bubble_fn_add({output1: ..});

之後如果要在其他地方使用js script的結果,可以使用像是javascripttoBUbble.output1來取得。

如果勾取Trigger Event, 就可以另設計一個workflow被呼叫



Server Side:

基本上更簡單,直接加入Server script模塊。

值得注意的是,script 必須以以下方式撰寫,否則會出錯。(不可以直接return,要把return包在一個function裡後呼叫該function)

var func(argument){
....
return ...;
}

func(argument);


分享至
成為作者繼續創作的動力吧!
© 2024 vocus All rights reserved.