鸿蒙原生应用开发案例每日一言
鸿蒙应用开发案例每日一言
相信喜欢古诗词的大家或多或少都听说过一款名为“西窗烛”的应用，打开这个应用，就会在主界面上显示出一句经典的古诗词，并且只要动动手指就能切换到下一句。
在HarmonyOS中，我们可以使用HTTP网络请求来实现这一简单的功能，下面来演示此功能的一个实例。
【开发环境】
win10+DevEco Studio+openHarmony Api10
（前排提醒，Api10目前不支持在Previewer中使用网络请求，如果没有开发板之类的能够联网的实体设备的话，请使用Api9进行测试）
【免费的在线API接口】
ALAPI：大家可以网上找对应接口
（我们将使用HTTP网络请求模块从这个免费的API接口中请求格式为json的数据，具体使用方法将在下文贴出）
【核心代码】
关于HTTP数据请求的详细说明以及功能实现可以参考以下，
HarmonyOS开发者学堂：https://developer.huawei.com/consumer/cn/training/course/slightMooc/C101682414573574868[2]
OpenHarmony应用开发文档：https://docs.openharmony.cn/pages/v4.0/zh-cn/application-dev/connectivity/http-request.md/[3]
本文只列出使用到的代码。
首先，我们需要在src/main/module.json5中的module字段下为应用申请ohos.permission.INTERNET权限：
"requestPermissions": [
{
"name": "ohos.permission.INTERNET"
}
]
之后，在实现http网络请求功能的ets页面上添加http模块：
import http from '@ohos.net.http';
最后，到了HTTP请求功能的具体实现：
@State content: string = '内容'
@State author: string = '作者'
//第一步，创建一个HTTP请求任务
let httpRequest = http.createHttp()
//第二步，向目标接口请求数据，"url"部分填写对应api接口的url
let promise = httpRequest.request("url",{
method: http.RequestMethod.POST
});
//第三步，接受到json数据后从中提取内容
promise.then((data) => {
this.content = JSON.parse(`${data.result}`).data.content;
this.author = JSON.parse(`${data.result}`).data.author;
})
具体的如何取得所需Api接口的url，我们在上文提到的网站中能够找到它所提供的接口地址：
在拿到地址后并不能直接使用，我们需要注册账号，到网站后台拿到能够使用的token，组成一个“‘地址’+‘?token=’+'token码”的字符串，才是一个完整的url。
检测生成的url是否正确，可以在浏览器地址栏中直接输入此url，如果显示一个有内容的json，那么就说明能够使用了。
【完整代码】
import http from '@ohos.net.http';
//import router from '@ohos.router';
@Entry
@Component
struct SayingPage {
@State content: string = '内容'
@State author: string = '作者'
aboutToAppear() {
let httpRequest = http.createHttp()
//这里使用了我自己的token码，免费版的，每天只能请求二百次
let promise = httpRequest.request("https://v2.alapi.cn/api/mingyan?token=换成自己的",{
method: http.RequestMethod.POST
});
promise.then((data) => {
this.content = JSON.parse(`${data.result}`).data.content;
this.author = JSON.parse(`${data.result}`).data.author;
})
}
build() {
Stack() {
//在这里我在页面上方放置了一个小的返回按钮
//如果想要使用的话请在src/main/resources/base/media中添加back.png文件
//和在url中填写另一个页面的地址
// Image($r('app.media.back'))
// .height(30)
// .width(30)
// .onClick(() => {
// router.pushUrl({
// url: "pages/SwitchPage"
// })
// })
// .position({
// x: '5%',
// y: '3%'
// })
// .zIndex(1)
Row() {
Column() {
Text(' '+this.content)
.fontSize(30)
.fontWeight(FontWeight.Bold)
Row() {
Blank()
Text('——' + this.author)
.fontSize(20)
}.width('100%').margin({
top: '10%',
bottom: '20%'
})
Button() {
Text('刷新').fontColor(Color.White)
}.onClick(() => {
let httpRequest = http.createHttp()
let promise = httpRequest.request("https://v2.alapi.cn/api/mingyan?token=GdueeuQNDxxmQPUL",{
method: http.RequestMethod.POST
});
promise.then((data) => {
this.content = JSON.parse(`${data.result}`).data.content;
this.author = JSON.parse(`${data.result}`).data.author;
})
}).height('8%').width('60%')
}
.width('95%')
}
.opacity(0.9)
.backgroundColor(Color.White)
.borderRadius(10)
.height('98%').padding({
left: '5%',
right: '5%'
})
}.width('100%').height('100%')
.linearGradient({
direction: GradientDirection.RightTop,
colors: [[0xff00fff8, 0.0], [0xff6200ff, 0.5], [0xffff00e5, 1.0]]
})
}
}
【实现效果】
以上，就是HTTP数据请求模块在HarmonyOS上的简单实现啦，都看到这里了，麻烦各位点个赞，先在这里谢过大家了！
参考资料
[1]
https://www.alapi.cn/api/view/7: https://gitee.com/link?target=https%3A%2F%2Fwww.alapi.cn%2Fapi%2Fview%2F7
[2]
https://developer.huawei.com/consumer/cn/training/course/slightMooc/C101682414573574868: https://developer.huawei.com/consumer/cn/training/course/slightMooc/C101682414573574868
[3]
https://docs.openharmony.cn/pages/v4.0/zh-cn/application-dev/connectivity/http-request.md/: https://docs.openharmony.cn/pages/v4.0/zh-cn/application-dev/connectivity/http-request.md/