uniapp 编译鸿蒙元服务（手把手包保姆级教学）

目录
一：预备开辟情况
二：元服务的 appid 注册 
2-1：点击我的应用
2-2：选择 HarmonyOS 点击新建发布
2-3：点击新增应用名称
2-4：点击新增后会跳到APP ID
2-5：点击选择一个所属项目
2-6：创建乐成
三：预备证书（真机运行的时间需要用到署名证书，不然会报错--没有署名无法安装）
3-1：此时就需要用到 DevEco-Studio 
3-2：Bundle name
3-3：点击 DevEco-Studio  顶部菜单栏中的 Build 选择 Generate Key and CSR
3-4：一样平常走到此处的都是第一次创建，那么我们就点击 New 新建一个文件
​编辑
3-5：此处的 CSR 文件的保存和操作方法同 p12 文件相同
3-6：获取 cer 文件
3-7：获取 profile 文件
四：预备署名
4-1: 打开 DevEco-studio
五：运行

---

如果看过文档的朋友应该知道，uniapp编译到鸿蒙元服务需要几个须要的条件：

• 目前仅支持 Vue3 项目编译到鸿蒙元服务平台，Vue2 项目升级 Vue3 项目请参考：Vue2 项目迁移到 Vue3。
  
• 目前仅支持鸿蒙 Next 真机，鸿蒙 ARM 模仿器开始内测，点击链接相识怎样申请。
  
• 目前支持鸿蒙5.0，鸿蒙 Next 的机型清单如下，查看 支持清单。
  

所以：当你预备开辟的时间首先你需要预备好 uniapp Vue3 的项目源码，一部支持 鸿蒙5.0 的华为手机，因为目前鸿蒙元服务并不支持使用 DevEco-studio 调试； 但是 DevEco-studio 还是需要先下载的，因为后续的开辟中需要用到。
一：预备开辟情况

• HBuilderX 4.34+ 下载地点
  
• DevEco-Studio 5.0.5.200+ 下载地点
  

二：元服务的 appid 注册 

在 华为 AppGallery Connect 完成元服务应用的注册，得到相关包名。
操作步骤如下：
2-1：点击我的应用

2-2：选择 HarmonyOS 点击新建发布

2-3：点击新增应用名称

2-4：点击新增后会跳到APP ID

选择元服务，填入应用名称，点击下一步

2-5：点击选择一个所属项目

然后确认，将会得到2-6

2-6：创建乐成

后续所需要的 APP ID 和 包名，从此处复制即可

三：预备证书（真机运行的时间需要用到署名证书，不然会报错--没有署名无法安装）

3-1：此时就需要用到 DevEco-Studio 

进入 DevEco-Studio 后，点击 Create Project
选择第一个
点击 NEXT，到 3-2 页面

3-2：Bundle name

留意：Bundle name 这一栏需要删除掉默认的，填写 步骤2-7 生成的包名
 然后点击 Finish

此时就打开了你新创建的项目
3-3：点击 DevEco-Studio  顶部菜单栏中的 Build 选择 Generate Key and CSR

此步骤用于生成 p12 文件 和 CSR 文件
3-4：一样平常走到此处的都是第一次创建，那么我们就点击 New 新建一个文件

点击新建后到这个窗口

Key stor file：需要你选择当前生成的 p12 文件存放的地点
password：设置一个密码（此密码需要记牢，后面需要用到）
Confierm password：确认你的密码
留意：选择 p12 文件的保存路径时默认给你的文件是没有 .p12 后缀，保存的时间你需要把 .p12 的后缀加上

点击 Save 后会自动回到 3-4 的页面，此时里面信息已经大致填写完成，只有 Alias 未填写，那么此处你可以填写你项目名称的缩写或是其他字符

然后点击 NEXT 
3-5：此处的 CSR 文件的保存和操作方法同 p12 文件相同

然后点击 Finish

弹出这个窗口就ok了！

此时你本地在你刚选择的目录就已经得到了 p12 和 csr 文件
3-6：获取 cer 文件

再次打开  AppGallery Connect 
点击 证书、APP ID 和 Profile

点击证书、新增证书

证书名称：填写没有要求，但是留意区分每个元服务的证书名称，以及调试和发布证书，不要搞混，定名的时间区分一下
证书类型：此处有两个一个调试证书，一个发布证书，调试的时间选调试证书就可以；
选取证书请求文件（CSR）：选择你在 步骤3-5 保存的 CSR 文件即可
然后点击提交
生成完成后，点击下载，下载完成是一个 cer 文件，保存后面需要用到
3-7：获取 profile 文件

点击 Profile ，点击 添加

应用名称：点击勾选你创建的应用名称
包名：勾选应用名称后包名会对应的自动填写
类型：在证书那一项你选择的是调试证书，那么此处对应就勾选调试

勾选证书类型后，选择证书处点击选择对应的证书
选择设备：此时就需要用到你预备的 鸿蒙5.0 的华为手机，需要先使用数据线连接到你的开辟设备上，在 Hauilber X 菜单栏中都选运行到小程序，选择 鸿蒙元服务（此时会提示你--没有署名无法安装）；继续往下走流程；
注：可以下载 Hauilber X - Alpha 版本，这个虽然不是正式版，但是开辟元服务的话用这个版本会比力好，因为元服务是新出的，问题可能会比力多，修复好的 bug 会先上到这个版本上。
以上全部填写完成后点击右上角的添加
填写完成后同样点击下载，下载饿完成后是一个 p7b 文件，保存到本地

四：预备署名

4-1: 打开 DevEco-studio

点击顶部菜单栏的 File 然后 点击 Project Structure...

点开后弹出这个窗口

点击 Project，选择 Signing Configs
点击 sign in 登陆你的华为 AGC 后台账号 
登陆后到这个页面

对应的文件选择上传上去，点击ok
然后在你的 Hbuilder X 里的 Vue3 项目根目录下建立一个名为 harmony-mp-configs 文件夹，然后建立一个名为 build-profile.json5 的文件，把我下面的代码复制进去

1. {
2.   "app": {
3.     "signingConfigs": [
4.       {
5.         "name": "default",
6.         "type": "HarmonyOS",
7.         "material": {
8.           "storeFile": "...",
9.           "certpath": "...",
10.           "profile": "...",
11.           "keyAlias": "...",
12.           "storePassword": "...",
13.           "keyPassword": "...",
14.           "signAlg": "SHA256withECDSA"
15.         }
16.       },
17.       {
18.         "name": "release",
19.         "type": "HarmonyOS",
20.         "material": {
21.           "storeFile": "...",
22.           "certpath": "...",
23.           "profile": "...",
24.           "keyAlias": "...",
25.           "storePassword": "...",
26.           "keyPassword": "...",
27.           "signAlg": "SHA256withECDSA"
28.         }
29.       }
30.     ],
31.     "products": [
32.       {
33.         "name": "default",
34.         "signingConfig": "default",
35.         "compatibleSdkVersion": "5.0.0(12)",
36.         "runtimeOS": "HarmonyOS",
37.         "buildOption": {
38.           "strictMode": {
39.             "caseSensitiveCheck": true,
40.             "useNormalizedOHMUrl": false
41.           }
42.         }
43.       }
44.     ],
45.     "buildModeSet": [
46.       {
47.         "name": "debug"
48.       },
49.       {
50.         "name": "release"
51.       }
52.     ]
53.   },
54.   "modules": [
55.     {
56.       "name": "entry",
57.       "srcPath": "./entry",
58.       "targets": [
59.         {
60.           "name": "default",
61.           "applyToProducts": [
62.             "default"
63.           ]
64.         }
65.       ]
66.     }
67.   ]
68. }

复制代码

同时在 DevEco-studio 左侧找到 build-oprofile.json5 的文件，复制 4-16 行，替换掉上边 signingConfigs 里边的内容

然后在你刚才新建的 harmony-mp-configs 目录下，按照 entry/src/main/module.json5 次序新建文件夹和 module.json5 文件，把下图 DevEco-studio 中的  module.json5 文件复制过去，同样的 resources 文件和 module.json5 文件平级复制过去，AppScope 文件和上面 entry 文件平级复制过去。        

将这段代码复制替换掉 modules.json5 里边的代码

1. {
2.   "module": {
3.         "srcEntry": "./ets/abilitystage/AbilityStage.ets", // 此时页面有两个 srcEntry
4.         "metadata": [
5.                 {
6.                         "name": "appgallery_privacy_hosted",
7.                         "value": "1" // 默认开启系统隐私弹窗，建议开启无需编写页面
8.                 },
9.                 {
10.                 "name": "app_id",
11.                         "value": "" // 填写实际应用的 app_id，在 华为AGC 后台查看
12.                 },
13.                 {
14.                         "name": "client_id",
15.                         "value": "" // 填写实际应用的 client_id,在 华为AGC 后台查看
16.                 }
17.         ],
18.         "requestPermissions": [
19.           {
20.             "name": "ohos.permission.INTERNET",
21.             "reason": "$string:app_name",
22.             "usedScene": {
23.               "abilities": ["FromAbility"],
24.               "when": "inuse"
25.             }
26.           }
27.         ],
28.         "dependencies": [
29.                 {
30.                         "bundleName": "com.huawei.hms.ascf",
31.                         "moduleName": "ascf",
32.                         "versionCode": 100000
33.                 }
34.         ],
35.     "name": "entry",
36.     "type": "entry",
37.     "description": "$string:module_desc",
38.     "mainElement": "EntryAbility",
39.     "deviceTypes": [
40.       "phone",
41.       "tablet"
42.     ],
43.     "deliveryWithInstall": true,
44.     "installationFree": false,
45.     "pages": "$profile:main_pages",
46.     "abilities": [
47.       {
48.         "name": "EntryAbility",
49.         "srcEntry": "./ets/entryability/EntryAbility.ets",
50.         "description": "$string:EntryAbility_desc",
51.         "icon": "$media:layered_image",
52.         "label": "$string:EntryAbility_label",
53.         "startWindowIcon": "$media:startIcon",
54.         "startWindowBackground": "$color:start_window_background",
55.         "exported": true,
56.         "skills": [
57.           {
58.             "entities": [
59.               "entity.system.home"
60.             ],
61.             "actions": [
62.               "action.system.home"
63.             ]
64.           }
65.         ]
66.       }
67.     ],
68.   }
69. }

复制代码

其中的 app_id 和 client_id 从华为 AGC 后台可以查看到
查看步骤如下
进入华为 AGC 后台，点击 我的项目 ，选择你的元服务项目，找到 应用

选择这两项，对应的复制进 app_id 和 client_id

同时此处需要添加一个 公钥指纹 

点击后在弹窗选择你对应的证书即可自动生成
五：运行

到此处基本预备工作就已经全部完成
拿出数据线连接你的开辟电脑和测试手机，在 Hbuilder X 里边点击 运行 ➡️ 运行到小程序 ➡️ 鸿蒙元服务，然后革新一下找到你的测试手机勾选，然后运行就可以。
（博主也是首次开辟，如流程有问题请见谅，提出问题，我会及时更正；首次操作流程确实稍微贫苦些，但是耐烦走通一遍后基本你就可以记清所有的操作流程了）

免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！更多信息从访问主页：qidao123.com:ToB企服之家，中国第一个企服评测及商务社交产业平台。