鸿蒙网络编程系列51-仓颉版使用Request部件下载文件到当地 ...

1. Request部件简介

鸿蒙体系提供了上传下载部件，即Request部件，封装了上传下载能力，方便了相关功能的开发。不过，在当前适配仓颉语言的Request部件中，只提供了基于代理（Agent）的上传下载能力，方便性也相对ArkTS语言差一些，毕竟是刚开始适配，以后应该会提供更丰富的功能。本文将使用仓颉语言基于Request部件实现文件下载功能，下载文件的服务端也是本系列第12篇文章《鸿蒙网络编程系列12-使用Request部件下载文件到当地示例》中使用的服务端，该服务端须要登录后才可以下载，本文也复用了本系列第41篇文章《鸿蒙网络编程系列41-仓颉版HttpRequest模拟登录示例》中演示的模拟登录能力，在获取登录后的cookie后，把该cookie做为Request部件首部的一部门，做为服务端答应下载的根据。
2. Request部件下载演示

本示例运行后的页面如图所示：

输入用户名、密码，然后输入服务端登录地址，单击“登录”按钮即可举行登录，如图所示：

登录乐成后，输入下载文件的地址以及当地文件名称，单击“下载”按钮即可举行下载，如图所示：

下载完毕后，还输出了文件的内容。
3. Request部件下载示例编写

下面详细先容创建该示例的步骤（确保DevEco Studio已安装仓颉插件）。
步骤1：创建[Cangjie]Empty Ability项目。
步骤2：在module.json5设置文件加上对权限的声明：

1. "requestPermissions": [
2.       {
3.         "name": "ohos.permission.INTERNET"
4.       }
5.     ]

复制代码

这里添加了访问互联网的权限。
步骤3：在build-profile.json5设置文件加上仓颉编译架构：

1. "cangjieOptions": {
2.       "path": "./src/main/cangjie/cjpm.toml",
3.       "abiFilters": ["arm64-v8a", "x86_64"]
4.     }

复制代码

步骤4：在index.cj文件里添加如下的代码：

1. package ohos_app_cangjie_entry
3. import ohos.base.*
4. import ohos.component.*
5. import ohos.state_manage.*
6. import ohos.state_macro_manage.*
7. import std.collection.HashMap
8. import ohos.net.http.*
9. import ohos.file_picker.*
10. import ohos.ability.getStageContext
11. import ohos.ability.*
12. import ohos.file_fs.*
13. import ohos.request.agent.*
14. import ohos.request.agent.Progress as agentProgress
18. @Entry
19. @Component
20. class EntryView {
21.     @State
22.     var title: String = '仓颉版Request部件下载示例';
23.     //连接、通讯历史记录
24.     @State
25.     var msgHistory: String = ''
26.     //首页地址
27.     @State
28.     var downloadUrl: String = ""
29.     //登录地址
30.     @State
31.     var loginUrl: String = ""
32.     //用户名
33.     @State
34.     var loginName: String = "zhanglei"
35.     //密码
36.     @State
37.     var passwd: String = "HarmonyOS"
39.     @State
40.     //保存到的本地文件名称
41.     var localFileName: String = "demo.txt"
42.     //cookie中传递的sessionid
43.     var sessionId: String = ""
44.     let scroller: Scroller = Scroller()
46.     func build() {
47.         Row {
48.             Column {
49.                 Text(title).fontSize(14).fontWeight(FontWeight.Bold).width(100.percent).textAlign(TextAlign.Center).
50.                     padding(10)
52.                 Flex(FlexParams(justifyContent: FlexAlign.Start, alignItems: ItemAlign.Center)) {
53.                     Text("用户名：").fontSize(14)
55.                     TextInput(text: loginName).onChange({
56.                         value => loginName = value
57.                     }).width(100).fontSize(11).flexGrow(1)
59.                     Text("密码：").fontSize(14)
61.                     TextInput(text: passwd).onChange({
62.                         value => passwd = value
63.                     }).width(100).fontSize(11).setType(InputType.Password).flexGrow(1)
64.                 }.width(100.percent).padding(10)
66.                 Flex(FlexParams(justifyContent: FlexAlign.Start, alignItems: ItemAlign.Center)) {
67.                     Text("登录地址：").fontSize(14).width(80)
69.                     TextInput(text: loginUrl).onChange({
70.                         value => loginUrl = value
71.                     }).width(100).fontSize(11).flexGrow(1)
73.                     Button("登录").onClick {
74.                         evt => login()
75.                     }.width(70).fontSize(14).flexGrow(0)
76.                 }.width(100.percent).padding(10)
78.                 Flex(FlexParams(justifyContent: FlexAlign.Start, alignItems: ItemAlign.Center)) {
79.                     Text("下载文件地址：").fontSize(14)
81.                     TextInput(text: downloadUrl).onChange({
82.                         value => downloadUrl = value
83.                     }).width(100).fontSize(11).flexGrow(1)
84.                 }.width(100.percent).padding(10)
86.                 Flex(FlexParams(justifyContent: FlexAlign.End, alignItems: ItemAlign.Center)) {
87.                     Text("本地文件名称：").fontSize(14)
89.                     TextInput(text: localFileName).onChange({
90.                         value => localFileName = value
91.                     }).width(100).fontSize(11).flexGrow(1)
93.                     Button("下载").onClick {
94.                         evt => downloadFile()
95.                     }.width(70).fontSize(14)
96.                 }.width(100.percent).padding(10)
98.                 Scroll(scroller) {
99.                     Text(msgHistory).textAlign(TextAlign.Start).padding(10).width(100.percent).backgroundColor(0xeeeeee)
100.                 }.align(Alignment.Top).backgroundColor(0xeeeeee).height(300).flexGrow(1).scrollable(
101.                     ScrollDirection.Vertical).scrollBar(BarState.On).scrollBarWidth(20)
102.             }.width(100.percent).height(100.percent)
103.         }.height(100.percent)
104.     }
106.     //下载文件
107.     func downloadFile() {
108.         let header = HashMap<String, String>(
109.             ("Accept-Encoding", "gzip, deflate, br"),
110.             ("Cookie", 'sessionid=' + this.sessionId),
111.             ("User-Agent",
112.                 "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36")
113.         );
115.         let localFilePath = globalContext.getOrThrow().filesDir + "/" + this.localFileName
116.         let config = Config(
117.             action: DOWNLOAD,
118.             url: downloadUrl,
119.             headers: header,
120.             saveas: localFilePath,
121.             overwrite: true
122.         )
123.         try {
124.             let task = create(getStageContext(globalContext.getOrThrow()), config)
125.             task.on("completed", CompletedCallback(this))
127.             task.start()
128.         } catch (e: BusinessException) {
129.             this.msgHistory += "下载文件异常：" + e.toString() + "\r\n"
130.         }
131.     }
133.     //在日志中显示指定信息
134.     func addMsgInfo(info: String) {
135.         this.msgHistory += info
136.     }
138.     //输出下载的文件内容
139.     func showDownloadFileInfo() {
140.         let localFilePath = globalContext.getOrThrow().filesDir + "/" + this.localFileName
141.         let content = FileFs.readText(localFilePath)
142.         msgHistory += "下载的文件内容：" + content + "\r\n"
143.     }
145.     //下载文件请求的响应函数
146.     func saveFileResponse(err: ?BusinessException, response: ?HttpResponse) {
147.         if (let Some(e) <- err) {
148.             msgHistory += "请求失败：" + e.message + "\r\n"
149.         }
151.         if (let Some(resp) <- response) {
152.             msgHistory += "响应码：${resp.responseCode.getValue()}\r\n"
154.             let localFilePath = globalContext.getOrThrow().filesDir + "/" + this.localFileName
155.             if (FileFs.access(localFilePath)) {
156.                 FileFs.unlink(localFilePath)
157.             }
158.             match (resp.result) {
159.                 case HttpData.ARRAY_DATA(value) =>
160.                     let file = FileFs.open(localFilePath, mode: CREATE.mode | READ_WRITE.mode)
161.                     FileFs.write(file.fd, value)
162.                     FileFs.close(file)
164.                     //输出文件内容
165.                     let content = FileFs.readText(localFilePath)
166.                     msgHistory += "文件内容${content}\r\n"
167.                 case _ => msgHistory += "响应的数据不是二进制类型\r\n"
168.             }
169.         }
170.     }
172.     //登录
173.     func login() {
174.         //http请求对象
175.         let httpRequest = createHttp();
176.         //请求的登录名和密码参数
177.         let params = "username=" + loginName + "&password=" + passwd
179.         let header = HashMap<String, String>(("Content-Type", "application/x-www-form-urlencoded"));
180.         let opt = HttpRequestOptions(
181.             method: RequestMethod.POST,
182.             extraData: HttpData.STRING_DATA(params),
183.             header: header,
184.             expectDataType: HttpDataType.STRING
185.         )
187.         httpRequest.request(loginUrl, dealWithResponse, options: opt)
188.     }
190.     //登录的响应处理函数
191.     func dealWithResponse(err: ?BusinessException, response: ?HttpResponse) {
192.         if (let Some(e) <- err) {
193.             msgHistory += "请求失败：" + e.message + "\r\n"
194.         }
196.         if (let Some(resp) <- response) {
197.             msgHistory += "响应码：${resp.responseCode.getValue()}\r\n"
199.             var findResult = false
200.             //从setCookie列表中查找名称为sessionid的cookie对应的值
201.             for (setCookieItem in resp.setCookie) {
202.                 let cookie = setCookieItem.split(";")
203.                 for (cookieItem in cookie) {
204.                     let kvItem = cookieItem.split("=")
205.                     if (kvItem[0].trimAscii() == "sessionid") {
206.                         sessionId = kvItem[1]
207.                         findResult = true
208.                         break;
209.                     }
210.                 }
211.                 if (findResult) {
212.                     msgHistory += "sessionId = ${sessionId}\r\n"
213.                     break
214.                 }
215.             }
216.         } else {
217.             msgHistory += "响应为空\r\n"
218.         }
219.     }
220. }
222. //下载完成的回调
223. class CompletedCallback <: Callback1Argument<agentProgress> {
224.     let parent: EntryView
225.     public init(parent: EntryView) {
226.         this.parent = parent
227.     }
228.     public open func invoke(progress: agentProgress): Unit {
229.         parent.addMsgInfo("下载完毕\r\n")
230.         parent.showDownloadFileInfo()
231.     }
232. }

复制代码

步骤5：编译运行，可以使用模拟器大概真机。
步骤6：按照本文第2部门“Request部件下载演示”操纵即可。
4. 代码分析

本示例的关键部门有三处，第一处是关于模拟登录获取sessionid，并且把cookie应用到Request部件的首部中，代码如下

1. let header = HashMap<String, String>(
2.             ("Accept-Encoding", "gzip, deflate, br"),
3.             ("Cookie", 'sessionid=' + this.sessionId),
4.             ("User-Agent",
5.                 "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36")
6.         );
8.         let localFilePath = globalContext.getOrThrow().filesDir + "/" + this.localFileName
9.         let config = Config(
10.             action: DOWNLOAD,
11.             url: downloadUrl,
12.             headers: header,
13.             saveas: localFilePath,
14.             overwrite: true
15.         )

复制代码

第二部门是关于下载任务的回调，这是和ArkTS语言示例差别较大的地方，该回调类须要实现Callback1Argument接口，代码如下：

1. //下载完成的回调
2. class CompletedCallback <: Callback1Argument<agentProgress> {
3.     let parent: EntryView
4.     public init(parent: EntryView) {
5.         this.parent = parent
6.     }
7.     public open func invoke(progress: agentProgress): Unit {
8.         parent.addMsgInfo("下载完毕\r\n")
9.         parent.showDownloadFileInfo()
10.     }
11. }

复制代码

第三部门是命名空间的问题，因为Callback1Argument接口包罗一个Progress类型的参数，该类型和ohos.component.*命名空间的Progress类型有冲突，以是这里重命名为agentProgress类型，导入代码如下：

1. import ohos.request.agent.Progress as agentProgress

复制代码

（本文作者原创，除非明白授权克制转载）
本文源码地址：
https://gitee.com/zl3624/harmonyos_network_samples/tree/master/code/http/RequestFileDownload4Cj
本系列源码地址：
ument接口包罗一个Progress类型的参数，该类型和ohos.component.*命名空间的Progress类型有冲突，以是这里重命名为agentProgress类型，导入代码如下：

1. import ohos.request.agent.Progress as agentProgress

复制代码

（本文作者原创，除非明白授权克制转载）
本文源码地址：
https://gitee.com/zl3624/harmonyos_network_samples/tree/master/code/http/RequestFileDownload4Cj
本系列源码地址：
https://gitee.com/zl3624/harmonyos_network_samples

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