日本综合一区二区|亚洲中文天堂综合|日韩欧美自拍一区|男女精品天堂一区|欧美自拍第6页亚洲成人精品一区|亚洲黄色天堂一区二区成人|超碰91偷拍第一页|日韩av夜夜嗨中文字幕|久久蜜综合视频官网|精美人妻一区二区三区

RELATEED CONSULTING
相關咨詢
選擇下列產(chǎn)品馬上在線溝通
服務時間：8:30-17:00
你可能遇到了下面的問題
關閉右側工具欄

新聞中心

這里有您想知道的互聯(lián)網(wǎng)營銷解決方案
HarmonyOSJS分布式能力—學習筆記

HarmonyOSJS分布式能力—學習筆記

作者：木棉花HOS 2021-08-30 18:36:33

開發(fā)

前端

分布式

OpenHarmony JS也是具有分布式能力的，本文就以兩個小項目來分享JS的分布式拉起和分布式遷移♪(∇*),分布式拉起允許拉起一個本地或遠程的FA，拉起時可以傳遞參數(shù)。

創(chuàng)新互聯(lián)公司客戶idc服務中心，提供IDC機房托管、成都服務器、成都主機托管、成都雙線服務器等業(yè)務的一站式服務。通過各地的服務中心，我們向成都用戶提供優(yōu)質廉價的產(chǎn)品以及開放、透明、穩(wěn)定、高性價比的服務，資深網(wǎng)絡工程師在機房提供7*24小時標準級技術保障。

想了解更多內(nèi)容，請訪問：

51CTO和華為官方合作共建的鴻蒙技術社區(qū)

前言

JS也是具有分布式能力的，本文就以兩個小項目來分享JS的分布式拉起和分布式遷移(?*)

正文

這是從官網(wǎng)中找到的分布式API在FA生命周期中的位置圖，圖中的onStartContinuation()、onSaveData(OBJECT)、onRestoreData(OBJECT)和onCompleteContinuation(code)均為分布式能力接口

項目相同的操作：

1. 安裝和配置DevEco Studio 2.1 Release

DevEco Studio 2.1 Release下載、DevEco Studio 2.1 Release安裝

2. 創(chuàng)建一個Empty Java Phone應用

DevEco Studio下載安裝成功后，打開DevEco Studio，點擊左上角的File，點擊New，再選擇New Project，選擇Empty Ability(Java)選項，點擊Next按鈕。

分布式拉起將文件命名為Distributrd1，分布式遷移將文件命名為Distributrd2(文件名不能出現(xiàn)中文或者特殊字符，否則將無法成功創(chuàng)建項目文件)，選擇保存路徑，選擇API5，設備勾選Phonet，最后點擊Finish按鈕。

3. 準備工作

在entry>src>main>config.json文件中最下方"launchType": "standard"的后面添加以下代碼，這樣就可以實現(xiàn)去掉應用上方的標簽欄了。

config.json部分代碼：

  
 
 
 
    
   
  
  
  
  1. "name": "com.test.distributed1.MainAbility",
    2. 
   
  
  
  
  2.         "icon": "$media:icon",
    3. 
   
  
  
  
  3.         "description": "$string:mainability_description",
    4. 
   
  
  
  
  4.         "label": "$string:entry_MainAbility",
    5. 
   
  
  
  
  5.         "type": "page",
    6. 
   
  
  
  
  6.         "launchType": "standard",
    7. 
   
  
  
  
  7.         "metaData": {
    8. 
   
  
  
  
  8.           "customizeData": [
    9. 
   
  
  
  
  9.             {
    10. 
   
  
  
  
  10.               "name": "hwc-theme",
    11. 
   
  
  
  
  11.               "value": "androidhwext:style/Theme.Emui.Light.NoTitleBar",
    12. 
   
  
  
  
  12.               "extra": ""
    13. 
   
  
  
  
  13.             }
    14. 
   
  
  
  
  14.           ]
    15. 
   
  
  
  
  15.         }
    16. 
   
  
  
  
  16.       }
    17. 
   
  
  
  
  17.     ],
    18. 
   
  
  
  
  18.     "js": [
    19. 
   
  
  
  
  19.       {
    20. 
   
  
  
  
  20.         "pages": [
    21. 
   
  
  
  
  21.           "pages/index/index"
    22. 
   
  
  
  
  22.         ],
    23. 
   
  
  
  
  23.         "name": "default",
    24. 
   
  
  
  
  24.         "window": {
    25. 
   
  
  
  
  25.           "designWidth": 720,
    26. 
   
  
  
  
  26.           "autoDesignWidth": true
    27. 
   
  
  
  
  27.         }
    28. 
   
  
  
  
  28.       }
    29. 
   
  
  
  
  29.     ]
    30. 
   
  
  
  
  30.   }
    31. 
   
  
  
  
  31. }
    32.

4. 添加權限

在config.json中添加權限。

  
 
 
 
    
   
  
  
  
  1. "reqPermissions": [
    2. 
   
  
  
  
  2.     {
    3. 
   
  
  
  
  3.       "name": "ohos.permission.DISTRIBUTED_DATASYNC"
    4. 
   
  
  
  
  4.     }
    5. 
   
  
  
  
  5.   ],
    6.

 在MainAbility.java中動態(tài)申請權限。

  
 
 
 
    
   
  
  
  
  1. public class MainAbility extends AceAbility {
    2. 
   
  
  
  
  2.     @Override
    3. 
   
  
  
  
  3.     public void onStart(Intent intent) {
    4. 
   
  
  
  
  4.         super.onStart(intent);
    5. 
   
  
  
  
  5. 
   
  
  
  
  6.         // 動態(tài)判斷權限
    7. 
   
  
  
  
  7.         if (verifySelfPermission("ohos.permission.DISTRIBUTED_DATASYNC") != IBundleManager.PERMISSION_GRANTED) {
    8. 
   
  
  
  
  8.             // 應用未被授予權限
    9. 
   
  
  
  
  9.             if (canRequestPermission("ohos.permission.DISTRIBUTED_DATASYNC")) {
    10. 
   
  
  
  
  10.                 // 是否可以申請彈框授權(首次申請或者用戶未選擇禁止且不再提示)
    11. 
   
  
  
  
  11.                 requestPermissionsFromUser(new String[]{"ohos.permission.DISTRIBUTED_DATASYNC"}, 0);
    12. 
   
  
  
  
  12.             }
    13. 
   
  
  
  
  13.         }
    14. 
   
  
  
  
  14.     }
    15. 
   
  
  
  
  15. 
   
  
  
  
  16.     @Override
    17. 
   
  
  
  
  17.     public void onStop() {
    18. 
   
  
  
  
  18.         super.onStop();
    19. 
   
  
  
  
  19.     }
    20. 
   
  
  
  
  20. }
    21.

分布式拉起

效果圖

1. 實現(xiàn)界面布局

在index.hml中編寫以下代碼。

添加兩個button組件，類選擇器名均為btn，分別添加一個單擊事件，按鈕上的文本分別為“加1”和“拉起”。

  
 
 
 
    
   
  
  
  
    2. 
   
  
  
  
  2.     
    3. 
   
  
  
  
  3.         {{ title }}
    4. 
   
  
  
  
  4.     
    5. 
   
  
  
  
  5.     加1
    6. 
   
  
  
  
  6.     拉起
    7.

在index.css中編寫以下代碼。

添加類選擇器btn，并修改其屬性值。

  
 
 
 
    
   
  
  
  
  1. .container {
    2. 
   
  
  
  
  2.     flex-direction: column;
    3. 
   
  
  
  
  3.     justify-content: center;
    4. 
   
  
  
  
  4.     align-items: center;
    5. 
   
  
  
  
  5. }
    6. 
   
  
  
  
  6. 
   
  
  
  
  7. .title {
    8. 
   
  
  
  
  8.     font-size: 40px;
    9. 
   
  
  
  
  9.     color: #000000;
    10. 
   
  
  
  
  10.     opacity: 0.9;
    11. 
   
  
  
  
  11. }
    12. 
   
  
  
  
  12. 
   
  
  
  
  13. .btn {
    14. 
   
  
  
  
  14.     height: 60px;
    15. 
   
  
  
  
  15.     width: 100px;
    16. 
   
  
  
  
  16.     font-size: 40px;
    17. 
   
  
  
  
  17.     background-color: aquamarine;
    18. 
   
  
  
  
  18.     margin: 10px;
    19. 
   
  
  
  
  19. }
    20.

2. 實現(xiàn)分布式拉起

在index.js中編寫以下代碼。

分布式拉起允許拉起一個本地或遠程的FA，拉起時可以傳遞參數(shù)。添加按鈕點擊事件distributed()通過FeatureAbility.startAbility(OBJECT)方法拉起一個FA，無回調結果，允許以顯式的方式，拉起遠程或本地的FA。

其中OBJECT為RequestParams類型的參數(shù)，包含必填的bundleName(要啟動的包名。需和abilityName配合使用，區(qū)分大小寫)、abilityName(要啟動的ability名，區(qū)分大小寫)和選填的entities(希望被調起的FA所歸屬的實體列表，如果不填，默認查找所有實體列表。需配合action使用)、action(在不指定包名及ability名的情況下，可以通過傳入action值從而根據(jù)Operation的其他屬性啟動應用)、deviceType(默認0: 從本地以及遠端設備中選擇要啟動的FA。1: 從本地設備啟動FA。有多個FA滿足條件的情況下，將彈框由用戶選擇設備)、data(指定要傳遞給對方的參數(shù)，需要可被序列化)、flag(拉起FA時的配置開關，如是否免安裝等)、url(拉起FA時，指定打開的頁面的url。默認直接打開首頁)。

  
 
 
 
    
   
  
  
  
  1. export default {
    2. 
   
  
  
  
  2.     data: {
    3. 
   
  
  
  
  3.         title: "0"
    4. 
   
  
  
  
  4.     },
    5. 
   
  
  
  
  5.     onInit() {
    6. 
   
  
  
  
  6.         
    7. 
   
  
  
  
  7.     },
    8. 
   
  
  
  
  8.     distributed(){
    9. 
   
  
  
  
  9.         let target = {
    10. 
   
  
  
  
  10.             bundleName: "com.test.distributed1",
    11. 
   
  
  
  
  11.             abilityName: "com.test.distributed1.MainAbility"
    12. 
   
  
  
  
  12.         };
    13. 
   
  
  
  
  13.         let result = FeatureAbility.startAbility(target);
    14. 
   
  
  
  
  14.     },
    15. 
   
  
  
  
  15. }
    16.

3. 實現(xiàn)帶數(shù)據(jù)傳遞的分布式拉起

定義一個全局變量sum，并初始化為0。添加一個按鈕點擊事件plus()實現(xiàn)加1功能。

在FeatureAbility.startAbility(OBJECT)中添加一個參數(shù)data并實例化sum。

因為所有在data中設置的字段，在對端FA中均可以直接在 this下拿到，所以在生命周期事件onInit()中通過this.number取得該值。

  
 
 
 
    
   
  
  
  
  1. var sum = 0;
    2. 
   
  
  
  
  2. 
   
  
  
  
  3. export default {
    4. 
   
  
  
  
  4.     data: {
    5. 
   
  
  
  
  5.         title: "0"
    6. 
   
  
  
  
  6.     },
    7. 
   
  
  
  
  7.     onInit() {
    8. 
   
  
  
  
  8.         sum = this.number;
    9. 
   
  
  
  
  9.         this.title = sum;
    10. 
   
  
  
  
  10.     },
    11. 
   
  
  
  
  11.     distributed(){
    12. 
   
  
  
  
  12.         let actionData = {
    13. 
   
  
  
  
  13.             number: sum
    14. 
   
  
  
  
  14.         };
    15. 
   
  
  
  
  15.         let target = {
    16. 
   
  
  
  
  16.             bundleName: "com.test.distributed1",
    17. 
   
  
  
  
  17.             abilityName: "com.test.distributed1.MainAbility",
    18. 
   
  
  
  
  18.             data: actionData
    19. 
   
  
  
  
  19.         };
    20. 
   
  
  
  
  20.         let result = FeatureAbility.startAbility(target);
    21. 
   
  
  
  
  21.     },
    22. 
   
  
  
  
  22.     plus(){
    23. 
   
  
  
  
  23.         sum++;
    24. 
   
  
  
  
  24.         this.title = sum;
    25. 
   
  
  
  
  25.     }
    26. 
   
  
  
  
  26. }
    27.

分布式遷移

效果圖

1. 實現(xiàn)界面布局

創(chuàng)建一個名為Distributed2的Empty JS Phone空應用。

在index.hml中編寫以下代碼。

添加兩個button組件，類選擇器名均為btn，分別添加一個單擊事件，按鈕上的文本分別為“加1”和“遷移”。

  
 
 
 
    
   
  
  
  
    2. 
   
  
  
  
  2.     
    3. 
   
  
  
  
  3.         {{ title }}
    4. 
   
  
  
  
  4.     
    5. 
   
  
  
  
  5.     加1
    6. 
   
  
  
  
  6.     拉起
    7.

在index.css中編寫以下代碼。

添加類選擇器btn，并修改其屬性值。

  
 
 
 
    
   
  
  
  
  1. .container {
    2. 
   
  
  
  
  2.     flex-direction: column;
    3. 
   
  
  
  
  3.     justify-content: center;
    4. 
   
  
  
  
  4.     align-items: center;
    5. 
   
  
  
  
  5. }
    6. 
   
  
  
  
  6. 
   
  
  
  
  7. .title {
    8. 
   
  
  
  
  8.     font-size: 40px;
    9. 
   
  
  
  
  9.     color: #000000;
    10. 
   
  
  
  
  10.     opacity: 0.9;
    11. 
   
  
  
  
  11. }
    12. 
   
  
  
  
  12. 
   
  
  
  
  13. .btn {
    14. 
   
  
  
  
  14.     height: 60px;
    15. 
   
  
  
  
  15.     width: 100px;
    16. 
   
  
  
  
  16.     font-size: 40px;
    17. 
   
  
  
  
  17.     background-color: aquamarine;
    18. 
   
  
  
  
  18.     margin: 10px;
    19. 
   
  
  
  
  19. }
    20.

2. 實現(xiàn)分布式遷移

在index.js中編寫以下代碼。

分布式遷移提供了一個主動遷移接口及一系列頁面生命周期回調，以支持將本地業(yè)務無縫遷移到指定設備中。添加按鈕點擊事件distributed()通過FeatureAbility.continueAbility()方法主動進行FA遷移的入口。

其中onStartContinuation()為FA發(fā)起遷移時的回調，在此回調中應用可以根據(jù)當前狀態(tài)決定是否遷移。返回值為Boolean類型，true表示允許進行遷移，false表示不允許遷移。

onSaveData(OBJECT)為保存狀態(tài)數(shù)據(jù)的回調，開發(fā)者需要往參數(shù)對象中填入需遷移到目標設備上的數(shù)據(jù)。參數(shù)為可被序列化的自定義數(shù)據(jù)。

onRestoreData(OBJECT)為恢復發(fā)起遷移時onSaveData方法保存的數(shù)據(jù)的回調，用于恢復應用狀態(tài)的對象，其中的數(shù)據(jù)及結構由onSaveData決定。

onCompleteContinuation(code)為遷移完成的回調，在調用端被觸發(fā)，表示應用遷移到目標設備上的結果。參數(shù)為遷移完成的結果。0：成功，-1：失敗。

  
 
 
 
    
   
  
  
  
  1. export default {
    2. 
   
  
  
  
  2.     data: {
    3. 
   
  
  
  
  3.         title: "0"
    4. 
   
  
  
  
  4.     },
    5. 
   
  
  
  
  5.     onStartContinuation() { // 判斷當前的狀態(tài)是不是適合遷移
    6. 
   
  
  
  
  6.         console.info("onStartContinuation被調用,適合遷移");
    7. 
   
  
  
  
  7.         return true;
    8. 
   
  
  
  
  8.     },
    9. 
   
  
  
  
  9. 
   
  
  
  
  10.     onCompleteContinuation(code) { // 遷移操作完成，code返回結果
    11. 
   
  
  
  
  11.         if(code == 0){
    12. 
   
  
  
  
  12.             console.info("onCompleteContinuation(code)被調用,遷移成功");
    13. 
   
  
  
  
  13.         } else if(code == -1){
    14. 
   
  
  
  
  14.             console.info("onCompleteContinuation(code)被調用,遷移失敗");
    15. 
   
  
  
  
  15.         }
    16. 
   
  
  
  
  16.     },
    17. 
   
  
  
  
  17.     onSaveData(saveData) { // 數(shù)據(jù)保存到savedData中進行遷移。
    18. 
   
  
  
  
  18.         console.info("onSaveData(saveData)被調用");
    19. 
   
  
  
  
  19.     },
    20. 
   
  
  
  
  20.     onRestoreData(restoreData) { // 收到遷移數(shù)據(jù)，恢復。
    21. 
   
  
  
  
  21.         console.info("onRestoreData(restoreData)被調用");
    22. 
   
  
  
  
  22.     },
    23. 
   
  
  
  
  23.     distributed(){
    24. 
   
  
  
  
  24.         let result =  FeatureAbility.continueAbility();
    25. 
   
  
  
  
  25.     }
    26. 
   
  
  
  
  26. }
    27.

3. 實現(xiàn)帶數(shù)據(jù)傳遞的分布式遷移

定義一個序列化continueAbilityData，其中的number為0。添加一個按鈕點擊事件plus()實現(xiàn)加1功能。

在onSaveData(saveData)函數(shù)中將序列化continueAbilityData保存到savedData中進行遷移。在onRestoreData(restoreData)函數(shù)中將遷移的數(shù)據(jù)顯示出來。

  
 
 
 
    
   
  
  
  
  1. export default {
    2. 
   
  
  
  
  2.     data: {
    3. 
   
  
  
  
  3.         title: "0",
    4. 
   
  
  
  
  4.         continueAbilityData: {
    5. 
   
  
  
  
  5.             number: 0
    6. 
   
  
  
  
  6.         }
    7. 
   
  
  
  
  7.     },
    8. 
   
  
  
  
  8.     onStartContinuation() { // 判斷當前的狀態(tài)是不是適合遷移
    9. 
   
  
  
  
  9.         console.info("onStartContinuation被調用,適合遷移");
    10. 
   
  
  
  
  10.         return true;
    11. 
   
  
  
  
  11.     },
    12. 
   
  
  
  
  12. 
   
  
  
  
  13.     onCompleteContinuation(code) { // 遷移操作完成，code返回結果
    14. 
   
  
  
  
  14.         if(code == 0){
    15. 
   
  
  
  
  15.             console.info("onCompleteContinuation(code)被調用,遷移成功");
    16. 
   
  
  
  
  16.         } else if(code == -1){
    17. 
   
  
  
  
  17.             console.info("onCompleteContinuation(code)被調用,遷移失敗");
    18. 
   
  
  
  
  18.         }
    19. 
   
  
  
  
  19.     },
    20. 
   
  
  
  
  20.     onSaveData(saveData) { // 數(shù)據(jù)保存到savedData中進行遷移。
    21. 
   
  
  
  
  21.         var data = this.continueAbilityData;
    22. 
   
  
  
  
  22.         Object.assign(saveData, data)
    23. 
   
  
  
  
  23.         console.info("onSaveData(saveData)被調用");
    24. 
   
  
  
  
  24.     },
    25. 
   
  
  
  
  25.     onRestoreData(restoreData) { // 收到遷移數(shù)據(jù)，恢復。
    26. 
   
  
  
  
  26.         this.continueAbilityData = restoreData;
    27. 
   
  
  
  
  27.         this.title = this.continueAbilityData.number;
    28. 
   
  
  
  
  28.         console.info("onRestoreData(restoreData)被調用");
    29. 
   
  
  
  
  29.     },
    30. 
   
  
  
  
  30.     distributed(){
    31. 
   
  
  
  
  31.         let result =  FeatureAbility.continueAbility();
    32. 
   
  
  
  
  32.     },
    33. 
   
  
  
  
  33.     plus(){
    34. 
   
  
  
  
  34.         this.continueAbilityData.number++;
    35. 
   
  
  
  
  35.         this.title = this.continueAbilityData.number;
    36. 
   
  
  
  
  36.     }
    37. 
   
  
  
  
  37. }
    38.

寫在最后

本項目會長期更新 ，希望隨著鴻蒙一同成長變強的既有我們，也有正在看著這個項目的你。明年3月，深大校園內(nèi)的木棉花會盛開，那時，鴻蒙也會變的更好，愿這花開，有你我的一份。


新聞標題：HarmonyOSJS分布式能力—學習筆記
分享網(wǎng)址：http://www.dlmjj.cn/article/dpshsep.html