資料處理 - DataV

資料處理類節點包括頁面瀏覽節點、並行資料處理節點、串列資料處理節點、序列執行節點和WebSocket節點。本文介紹在藍圖編輯器中，配置資料處理類節點的方法。

頁面瀏覽節點

頁面導航節點，可用於實現頁面跳轉的功能，支援新開瀏覽器標籤頁跳轉或在當前標籤頁內跳轉，並支援頁面跳轉時帶入自訂參數。

使用情境：頁面導航節點在跳轉新頁面時使用較多。例如以下情境，單擊地圖上的一個地區，即可跳轉到已配置的地區下級頁面內。當單擊地圖地區時，可通過串列資料處理節點得到目前範圍的adcode欄位值，返回參數資料為return {adcode: data.area_id};，然後在瀏覽節點的配置面板中，設定好下級跳轉頁面連結地址為https://www.other-page.com，同時自訂帶入的參數變數名adcode，最後將串列資料處理返回的結果輸入頁面導航節點的開啟頁面即可。

添加頁面導航節點至畫布中，可查看頁面導航節點支援的事件或動作，以及配置參數。添加方式請參見使用邏輯節點。

頁面導航處理面板

參數	說明
連結地址	目標跳轉頁面的連結地址。
新開頁面	開啟開關，新開一個網頁頁面開啟跳轉連結地址；關閉開關，在原有網頁頁面開啟跳轉連結地址。
請求參數	跳轉頁面時可自訂請求參數的參數名和參數值內容。單擊右側的或表徵圖，添加或刪除一個請求參數。單擊或表徵圖配置多個請求參數的排列樣式。單擊表徵圖，即可複製當前選中請求參數配置內容並新增一個同樣配置的請求參數。

表格中僅提供其他配置中的參數說明，其他參數配置請參見公用參數說明。

輸出結果：無。

並行資料處理節點

並行資料處理節點，是使用並行方式來處理多個事件，各事件之間互不影響。

使用情境：並行資料處理節點在資料分發情境中使用較多。例如一個組件介面返回的資料為{name: '藍圖編輯器', version: 'v1.0' }，分發到2個通用標題組件中，一個取的是name欄位，另一個取的是version欄位。可以使用該節點新增兩個處理方法，一個為return [{value: data.name}]，另一個為return [{value: data.version}]。

添加並行資料處理節點至畫布中，可查看並行資料處理節點支援的事件或動作，以及配置參數。添加方式請參見使用邏輯節點。

並行資料處理面板

事件或動作	說明
處理方法	並行的資料處理方法。可在配置面板中添加多個處理方法，添加後，並行資料處理節點中顯示您添加的處理方法；不同處理方法可串連不同的上遊節點，實現資料平行處理。

參數	說明
處理方法	編寫JavaScript函數體，返回結果可為任意類型。

表格中僅提供其他配置中的參數說明，其他參數配置請參見公用參數說明。

輸出結果：每個處理方法對相應上遊節點的輸出結果進行計算後，得到的輸出結果。

串列資料處理節點

串列資料處理節點，是使用串列方式來處理一個事件。

使用情境：例如，小數0.835要轉換成整數百分比83%，可經過：單位轉換（83.5） -> 取整（83）-> 添加字串尾碼（83%），一系列串列操作完成。

添加串列資料處理節點至畫布中，可查看串列資料處理節點支援的事件或動作，以及配置參數。添加方式請參見使用邏輯節點。

串列資料處理面板

事件或動作	說明
處理方法	串列的資料處理方法。可在配置面板中添加多個處理方法，添加後，串列資料處理節點中顯示您添加的處理方法；各方法共同實現資料處理。

參數	說明
處理方法	編寫JavaScript函數體，返回結果可為任意類型。

表格中僅提供其他配置中的參數說明，其他參數配置請參見公用參數說明。

輸出結果：上遊節點的輸出結果經過所有處理方法計算後，得到的輸出結果。

序列執行節點

當您對下遊節點的動作執行有順序要求時，可使用序列執行節點，保證動作從上到下依次執行。

使用情境：例如，當您需要切換不同情境的資料面板時，每個情境有很多資料面板，先把情境A相關的資料面板切出，再把情境B相關的資料面板切進。可使用序列執行節點，對不同情境的資料面板進行分組，再按照先A後B的順序執行。

添加序列執行節點至畫布中，可查看序列執行節點支援的事件或動作，以及配置參數。添加方式請參見使用邏輯節點。

序列執行面板

事件或動作	說明
執行	輸入上遊節點的輸出結果，用於該節點的結果計算。
資料處理	序列執行節點的資料處理方法。可在配置面板中添加多個處理方法，添加後，序列執行節點中顯示您添加的處理方法；各方法按照順序進行資料處理。

參數	說明
處理方法	編寫JavaScript函數體，返回結果支援任意類型。可疊加，每個處理方法獨立計算，輸入均為上一個節點的輸出結果，輸出為每個處理方法自己的計算結果，相互不影響。

表格中僅提供其他配置中的參數說明，其他參數配置請參見公用參數說明。

輸出結果：每個處理方法按照順序，對上遊節點的輸出結果進行計算後，得到的輸出結果。

WebSocket節點

WebSocket節點為屏間通訊節點。每個訊息由訊息名稱和資料群組成，訊息名稱在配置項中自訂，資料為上一個節點的輸出結果。

使用情境：WebSocket節點用於多端之間的命令和資料轉送。例如大屏與移動端、大屏與觸控螢幕端的資料轉送等。

添加WebSocket節點至畫布中，可查看WebSocket節點的配置參數。添加方式請參見使用邏輯節點。

參數	說明
socket服務地址	socket後端服務的地址。我們提供了DataV-WS工具包供您選擇，具體操作請參見如何使用DataV-WS服務。
螢幕ID	該WebSocket節點所在螢幕的ID號，自訂輸入。
螢幕名稱	該WebSocket節點所在螢幕的名稱，自訂輸入。
分組	WebSocket節點訊息只在同socket服務下的同分組中進行廣播。一般同一專案約定一個分組名稱。
接收訊息	該WebSocket節點接收來自其他端的訊息名稱。單擊右側的或表徵圖，添加或刪除一個接受訊息。單擊或表徵圖配置多個接收訊息的排列樣式。單擊表徵圖，即可複製當前選中接收訊息配置內容並新增一個同樣配置的接收訊息。
發送訊息	該WebSocket節點發送到其他端的訊息名稱。單擊右側的或表徵圖，添加或刪除一個發送訊息。單擊或表徵圖配置多個發送訊息的排列樣式。單擊表徵圖，即可複製當前選中發送訊息配置內容並新增一個同樣配置的發送訊息。

表格中僅提供其他配置中的參數說明，其他參數配置請參見公用參數說明。

輸出結果：無。

自建WebSocket節點服務說明

如果您已經建立了WebSocket節點服務，那麼您無需編寫任何前端代碼，即可將服務接入DataV提供的WebSocket節點中。前提是您的Webocket服務符合以下格式。

配置樣本

註冊訊息

WebSocket節點發送訊息格式如下。

{
  event: "register",
  data: {
    sid: 407194,                                      //螢幕的ID
    name: "資料來源受控模式測試",                        //螢幕的名稱
    group: "預設分組"                                 //預設分組
  },
  callback: "callback_15832235175585251131307383912" //當前註冊時間戳記，自動產生
}

WebSocket節點服務擷取註冊訊息之後，需返回如下訊息才能成功註冊。

{
  event: "callback_15832235175585251131307383912",   //返回與之前同樣的註冊時間戳記
  data: {
    isError: false,                                  //置為false
    data: "ok"
  }
}

發送訊息

WebSocket節點發送訊息格式如下。

{
  event: 'broadcast',
  data: {
    event: "發送出去的訊息1",                         //發送訊息名稱
    data: {}                                         //data為任意格式
  }
}

接收訊息

WebSocket節點接收訊息格式如下。

{
  event: "broadcast_接收到的訊息1",                  //broadcast_${接收訊息名稱}
  data: {}                                          //data為任意格式
}

無法正常串連WebSocket的服務端時，可根據以下步驟排查問題

WS服務不能直接在HTTPS協議下訪問，需要用WSS服務，在使用自己的SSL認證去代理WS服務地址後，才能在HTTPS下訪問。
使用功能鍵F12，開啟瀏覽器調試頁面，查看瀏覽器network頁簽下的WS標籤串連提示資訊，檢查是否因跨域未配置以及在串連返回的response的header裡是否有設定Sec-WebSocket-Protocol為echo-protocol。
串連成功後，根據文檔中的訊息格式傳遞參數即可。