HarmonyOS NEXT

谜语大全的开发

2024-12-08 10:53:42
144次阅读
0个评论
最后修改时间：2024-12-08 11:04:43

HarmonyOS概念

发展历程

HarmonyOS应用开发

开发工具下载

面向HarmonyOS应用及元服务开发者提供的集成开发环境（IDE），助力高效开发。下载DevEco Studio 5.0.1 Release

下载地址：https://developer.huawei.com/consumer/cn/download/

基础知识

谜语大全的开发

接口地址： https://v2.alapi.cn/api/riddle

请求方法: [“get”，“post”]

请求参数：

名称 必填 类型 描述 示例
token true string 请求token，用户中心获取。 用户中心获取token
page false string 分页 1
num false string 获取数量，最大10 10
type string 获取谜语的类型 chengyumiyu

type 参数可以请求 /api/riddle/type 获取

返回参数:

名称 描述
title 谜语标题
content 谜语内容
answer 答案
type_name.type 分类 type
type_name.name 分类名
type_name.description 分类描述

返回数据

{
  "code": 200,
  "msg": "success",
  "data": [
    {
      "title": "八团",
      "content": "八团",
      "answer": "三五成群",
      "type": "chengyumiyu",
      "time": "2020-04-22 15:48:05",
      "type_name": {
        "type": "chengyumiyu",
        "name": "成语谜语",
        "desc": "顾名思义，成语谜指猜成语的谜语。"
      }
    },
    {
      "title": "伯乐改行·亥豕格",
      "content": "伯乐改行·亥豕格",
      "answer": "心不在焉",
      "type": "chengyumiyu",
      "time": "2020-04-22 15:48:05",
      "type_name": {
        "type": "chengyumiyu",
        "name": "成语谜语",
        "desc": "顾名思义，成语谜指猜成语的谜语。"
      }
    }
  ],
  "time": 1733622547,
  "usage": 0,
  "log_id": "724199212435996672"
}

转换后的模型

/**
 *
 * @author: 坚果派
 * @date: 2024/12/8
 * @phone：17752170152
 * website：nutpi.net
 * @organization：坚果派
 */
export class dirctory {
  code?: number = 0;
  msg?: string = "";
  data?: DirctoryData[] = [];
  time?: number = 0;
  usage?: number = 0;
  log_id?: string = "";
}

export class DirctoryDataType_name {
  type?: string = "";
  name?: string = "";
  desc?: string = "";
}

export class DirctoryData {
  title?: string = "";
  content?: string = "";
  answer?: string = "";
  type?: string = "";
  time?: string = "";
  type_name?: DirctoryDataType_name = new DirctoryDataType_name();
}

数据请求

HTTP请求

参考：https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/http-request-V5

涉及的接口如下表，具体的接口说明请参考API文档。

接口名 描述
createHttp() 创建一个http请求。
request() 根据URL地址，发起HTTP网络请求。
requestInStream()10+ 根据URL地址，发起HTTP网络请求并返回流式响应。
destroy() 中断请求任务。
on(type: 'headersReceive') 订阅HTTP Response Header 事件。
off(type: 'headersReceive') 取消订阅HTTP Response Header 事件。
once('headersReceive')8+ 订阅HTTP Response Header 事件，但是只触发一次。
on('dataReceive')10+ 订阅HTTP流式响应数据接收事件。
off('dataReceive')10+ 取消订阅HTTP流式响应数据接收事件。
on('dataEnd')10+ 订阅HTTP流式响应数据接收完毕事件。
off('dataEnd')10+ 取消订阅HTTP流式响应数据接收完毕事件。
on('dataReceiveProgress')10+ 订阅HTTP流式响应数据接收进度事件。
off('dataReceiveProgress')10+ 取消订阅HTTP流式响应数据接收进度事件。
on('dataSendProgress')11+ 订阅HTTP网络请求数据发送进度事件。
off('dataSendProgress')11+ 取消订阅HTTP网络请求数据发送进度事件。

request接口开发步骤

  1. 从@kit.NetworkKit中导入http命名空间。
  2. 调用createHttp()方法，创建一个HttpRequest对象。
  3. 调用该对象的on()方法，订阅http响应头事件，此接口会比request请求先返回。可以根据业务需要订阅此消息。
  4. 调用该对象的request()方法，传入http请求的url地址和可选参数，发起网络请求。
  5. 按照实际业务需要，解析返回结果。
  6. 调用该对象的off()方法，取消订阅http响应头事件。
  7. 当该请求使用完毕时，调用destroy()方法主动销毁。
// 引入包名
import { http } from '@kit.NetworkKit';
import { BusinessError } from '@kit.BasicServicesKit';

@Entry
@Component
struct Index {
  getData() {
    //2. 每一个httpRequest对应一个HTTP请求任务，不可复用
    let httpRequest = http.createHttp();
    // 用于订阅HTTP响应头，此接口会比request请求先返回。可以根据业务需要订阅此消息
    // 3.从API 8开始，使用on('headersReceive', Callback)替代on('headerReceive', AsyncCallback)。 8+
    httpRequest.on('headersReceive', (header) => {
      console.info('header: ' + JSON.stringify(header));
    });
    httpRequest.request(
      //4. 填写HTTP请求的URL地址，可以带参数也可以不带参数。URL地址需要开发者自定义。请求的参数可以在extraData中指定
      "EXAMPLE_URL",
      {
        method: http.RequestMethod.POST, // 可选，默认为http.RequestMethod.GET
        // 开发者根据自身业务需要添加header字段
        header: {
          'Content-Type': 'application/json'
        },
        // 当使用POST请求时此字段用于传递请求体内容，具体格式与服务端协商确定
        extraData: "data to send",
      }, (err: BusinessError, data: http.HttpResponse) => {
      if (!err) {
        
        // 5.data.result为HTTP响应内容，可根据业务需要进行解析
        console.info('Result:' + JSON.stringify(data.result));
        console.info('code:' + JSON.stringify(data.responseCode));
        // data.header为HTTP响应头，可根据业务需要进行解析
        console.info('header:' + JSON.stringify(data.header));
        console.info('cookies:' + JSON.stringify(data.cookies)); // 8+
        // 当该请求使用完毕时，调用destroy方法主动销毁
        httpRequest.destroy();
      } else {
        console.error('error:' + JSON.stringify(err));
        
        // 6.取消订阅HTTP响应头事件
        httpRequest.off('headersReceive');
        // 7.当该请求使用完毕时，调用destroy方法主动销毁
        httpRequest.destroy();
      }
    }
    );





  }

  build() {
  }
}

补充请求地址后

// 引入包名
import { http } from '@kit.NetworkKit';
import { BusinessError } from '@kit.BasicServicesKit';

@Entry
@Component
struct Index {
  aboutToAppear(): void {
    this.getData()
  }

  getData() {
    //2. 每一个httpRequest对应一个HTTP请求任务，不可复用
    let httpRequest = http.createHttp();
    // 用于订阅HTTP响应头，此接口会比request请求先返回。可以根据业务需要订阅此消息
    // 3.从API 8开始，使用on('headersReceive', Callback)替代on('headerReceive', AsyncCallback)。 8+
    httpRequest.on('headersReceive', (header) => {
      console.info('header: ' + JSON.stringify(header));
    });
    httpRequest.request(
      //4. 填写HTTP请求的URL地址，可以带参数也可以不带参数。URL地址需要开发者自定义。请求的参数可以在extraData中指定
      "https://v2.alapi.cn/api/riddle",
      {
        method: http.RequestMethod.POST, // 可选，默认为http.RequestMethod.GET
        // 开发者根据自身业务需要添加header字段
        header: {
          'Content-Type': 'application/json'
        },
        // 当使用POST请求时此字段用于传递请求体内容，具体格式与服务端协商确定
        extraData: {

          num: "1",
          page: "1",
          token: "你的token",
          type: "chengyumiyu"


        },
      }, (err: BusinessError, data: http.HttpResponse) => {
      if (!err) {

        // 5.data.result为HTTP响应内容，可根据业务需要进行解析
        console.info('Result:' + JSON.stringify(data.result));
        console.info('code:' + JSON.stringify(data.responseCode));
        // data.header为HTTP响应头，可根据业务需要进行解析
        console.info('header:' + JSON.stringify(data.header));
        console.info('cookies:' + JSON.stringify(data.cookies)); // 8+
        // 当该请求使用完毕时，调用destroy方法主动销毁
        httpRequest.destroy();
      } else {
        console.error('error:' + JSON.stringify(err));

        // 6.取消订阅HTTP响应头事件
        httpRequest.off('headersReceive');
        // 7.当该请求使用完毕时，调用destroy方法主动销毁
        httpRequest.destroy();
      }
    }
    );


  }

  build() {

    Column() {
      Button("请求数据").onClick(() => {

        this.getData()
      })
    }
  }
}

完整代码

// 引入包名
import { http } from '@kit.NetworkKit';
import { BusinessError } from '@kit.BasicServicesKit';
import { dirctory, DirctoryData } from '../model/dirctory';
import { it } from '@ohos/hypium';

@Entry
@Component
struct Index {
  @State DirctoryData: DirctoryData[] = []

  aboutToAppear(): void {
    this.getData()
  }

  getData() {
    //2. 每一个httpRequest对应一个HTTP请求任务，不可复用
    let httpRequest = http.createHttp();
    // 用于订阅HTTP响应头，此接口会比request请求先返回。可以根据业务需要订阅此消息
    // 3.从API 8开始，使用on('headersReceive', Callback)替代on('headerReceive', AsyncCallback)。 8+
    httpRequest.on('headersReceive', (header) => {
      console.info('header: ' + JSON.stringify(header));
    });
    httpRequest.request(
      //4. 填写HTTP请求的URL地址，可以带参数也可以不带参数。URL地址需要开发者自定义。请求的参数可以在extraData中指定
      "https://v2.alapi.cn/api/riddle",
      {
        method: http.RequestMethod.POST, // 可选，默认为http.RequestMethod.GET
        // 开发者根据自身业务需要添加header字段
        header: {
          'Content-Type': 'application/json'
        },
        // 当使用POST请求时此字段用于传递请求体内容，具体格式与服务端协商确定
        extraData: {

          num: "1",
          page: "1",
          token: "你的token",
          type: "chengyumiyu"


        },
      }, (err: BusinessError, data: http.HttpResponse) => {
      if (!err) {

        // 5.data.result为HTTP响应内容，可根据业务需要进行解析
        console.info('Result:' + JSON.stringify(data.result));
        console.info('code:' + JSON.stringify(data.responseCode));


        let dirctory: dirctory = JSON.parse(data.result.toString())

        this.DirctoryData = dirctory.data!
        // data.header为HTTP响应头，可根据业务需要进行解析
        console.info('header:' + JSON.stringify(data.header));
        console.info('cookies:' + JSON.stringify(data.cookies)); // 8+
        // 当该请求使用完毕时，调用destroy方法主动销毁
        httpRequest.destroy();
      } else {
        console.error('error:' + JSON.stringify(err));

        // 6.取消订阅HTTP响应头事件
        httpRequest.off('headersReceive');
        // 7.当该请求使用完毕时，调用destroy方法主动销毁
        httpRequest.destroy();
      }
    }
    );


  }

  build() {

    Column() {
 
      ForEach(this.DirctoryData, (item: DirctoryData) => {

        Text(item.title)
        Text(item.content)
        Text(item.answer)
      })
    }
  }
}

远场通讯

Remote Communication Kit（远场通信服务）是华为提供的HTTP发起数据请求的NAPI封装。应用通过Remote Communication Kit可便捷快速地向服务器发起数据请求。

参考：https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/remote-communication-introduction-V5

1.导入模块。

import { rcp } from '@kit.RemoteCommunicationKit';
import { BusinessError } from '@kit.BasicServicesKit';

2.创建会话，会话发起post请求。"http://www.example.com"请根据实际情况替换为想要请求的URL地址。

const session = rcp.createSession();
session.post("http://www.example.com/post", "data to send").then((response) => {
  console.info(`Response succeeded: ${response}`);
}).catch((err: BusinessError) => {
  console.error(`Response err: Code is ${err.code}, message is ${JSON.stringify(err)}`);
});

完整代码

// 引入包名
import { http } from '@kit.NetworkKit';
import { BusinessError } from '@kit.BasicServicesKit';
import { dirctory, DirctoryData } from '../model/dirctory';
import { it } from '@ohos/hypium';
import { rcp } from '@kit.RemoteCommunicationKit';

@Entry
@Component
struct Index {
  @State DirctoryData: DirctoryData[] = []

  aboutToAppear(): void {
    this.getRcpData()
  }

  getRcpData() {
    const session = rcp.createSession();
    session.post("https://v2.alapi.cn/api/riddle", {
      num: "1",
      page: "1",
      token: "你的token",
      type: "chengyumiyu"
    }).then((response) => {
      let dirctory: dirctory = JSON.parse(response.toString()!)
      this.DirctoryData = dirctory.data!
      console.info(`Response succeeded: ${response}`);
    }).catch((err: BusinessError) => {
      console.error(`Response err: Code is ${err.code}, message is ${JSON.stringify(err)}`);
    });
  }
  

  getHttpData() {
    //2. 每一个httpRequest对应一个HTTP请求任务，不可复用
    let httpRequest = http.createHttp();
    // 用于订阅HTTP响应头，此接口会比request请求先返回。可以根据业务需要订阅此消息
    // 3.从API 8开始，使用on('headersReceive', Callback)替代on('headerReceive', AsyncCallback)。 8+
    httpRequest.on('headersReceive', (header) => {
      console.info('header: ' + JSON.stringify(header));
    });
    httpRequest.request(
      //4. 填写HTTP请求的URL地址，可以带参数也可以不带参数。URL地址需要开发者自定义。请求的参数可以在extraData中指定
      "https://v2.alapi.cn/api/riddle",
      {
        method: http.RequestMethod.POST, // 可选，默认为http.RequestMethod.GET
        // 开发者根据自身业务需要添加header字段
        header: {
          'Content-Type': 'application/json'
        },
        // 当使用POST请求时此字段用于传递请求体内容，具体格式与服务端协商确定
        extraData: {

          num: "1",
          page: "1",
          token: "你的token",
          type: "chengyumiyu"


        },
      }, (err: BusinessError, data: http.HttpResponse) => {
      if (!err) {

        // 5.data.result为HTTP响应内容，可根据业务需要进行解析
        console.info('Result:' + JSON.stringify(data.result));
        console.info('code:' + JSON.stringify(data.responseCode));


        let dirctory: dirctory = JSON.parse(data.result.toString())

        this.DirctoryData = dirctory.data!
        // data.header为HTTP响应头，可根据业务需要进行解析
        console.info('header:' + JSON.stringify(data.header));
        console.info('cookies:' + JSON.stringify(data.cookies)); // 8+
        // 当该请求使用完毕时，调用destroy方法主动销毁
        httpRequest.destroy();
      } else {
        console.error('error:' + JSON.stringify(err));

        // 6.取消订阅HTTP响应头事件
        httpRequest.off('headersReceive');
        // 7.当该请求使用完毕时，调用destroy方法主动销毁
        httpRequest.destroy();
      }
    }
    );


  }

  build() {

    Column() {

      ForEach(this.DirctoryData, (item: DirctoryData) => {

        Text(item.title)
        Text(item.content)
        Text(item.answer)
      })
    }
  }
}

Axios

创建项目

image-20241208101450322

image-20241208101506794

添加权限

因为本次开发的应用是需要请求网络数据的，所以需要请求网络权限。

  "requestPermissions": [
      {
        "name": "ohos.permission.INTERNET"
      }
    ],

image-20241208101703071

收藏0赞0

请 登录 后评论。没有帐号？ 注册 一个。

坚果

  • 15回答
  • 15粉丝
  • 9关注
相关话题
版权所有©坚果派 陇ICP备2024014515号-1联系我们