DEV Community

RogueYBJ
RogueYBJ

Posted on

Harmony-Free Hengong Network Network Library

Hello everyone, nice to meet you all! Today, we are going to talk about the HTTP data request function of the network in HarmonyOS. During the daily development process, the interaction between the app and the server is inevitable. Network requests are also a crucial part of app development and one of the most frequently used tasks in app development.

一、HTTP network requests consist of two crucial parts: the request parameters (options) and the response data (response).

1、The request parameters options contain several important parameters such as RequestMethod, header, and body, and these parameters are encapsulated.

1.1、The RequestMethod includes OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, and CONNECT, among which the most commonly used ones are POST and GET.

options.method == http.RequestMethod.GET
options.method == http.RequestMethod.POST
Enter fullscreen mode Exit fullscreen mode

1.2、The header of the request usually includes the verification signature token required by the server as well as the data type Content-Type, among other things.

HttpBase.baseHeader.set("Content-Type",this.contentType);
HttpBase.baseHeader.set("token",token);
Enter fullscreen mode Exit fullscreen mode

1.3、The body of the request typically contains the data required by the server. options.extraData

options.extraData = "data"
Enter fullscreen mode Exit fullscreen mode

1.4、The basic method for the request parameter options.

request(url:string,options:http.HttpRequestOptions){
    this.baseHeader.set("Content-Type",this.contentType);
    options.header = assign({},this.baseHeader,options.header??{})
    return this.httpRequest.request(url,options);
}
Enter fullscreen mode Exit fullscreen mode

2、The response parameter response contains several important parameters such as responseCode, result, and resultType, and these parameters are encapsulated.

2.1、responseCode - Response data status code. A status code of 200 indicates a successful response.

2.2、Result The corresponding data will have the data transmitted by the server when the status code is 200.

2.3、The response data types of resultType are STRING, OBJECT, and ARRAY_BUFFER.

2.4 Response data acquisition

request(url:string,options:http.HttpRequestOptions){
    this.baseHeader.set("Content-Type",this.contentType);
    options.header = assign({},this.baseHeader,options.header??{})
    return this.httpRequest.request(url,options,(err,data)=>{
        if (err) {
          rej(err)
        }else{
          if (data.responseCode == 200) {
            res(data)
          }else{
            rej(JSON.stringify(data.result))
          }
        }
    });
}
Enter fullscreen mode Exit fullscreen mode

二、Process the response data. While obtaining the data, it is also desired to perform some processing, and it is hoped that the data can be transformed into the form of a model for direct use.

1、Specify the type you want to obtain by passing in different T generics. The default generics are object | string | ArrayBuffer.

request<T = object | string | ArrayBuffer>
Enter fullscreen mode Exit fullscreen mode

2、Process the incoming T generic type and return the corresponding model type HttpResp< T >

request<T = object | string | ArrayBuffer>(url:string,options:http.HttpRequestOptions): Promise<HttpResp<T>> {
    return new Promise((res,rej)=>{
      this.httpRequest.request(url,options,(err,data)=>{
        if (err) {
          rej(err)
        }else{
          if (data.responseCode == 200) {
            let resp:HttpResp<T> = {
              responseCode: data.responseCode,
              code: data.responseCode,
              msg: "Request successful",
              data: data.result as T,
            }
            res(resp)
          }else{
            rej(JSON.stringify(data.result))
          }
        }
        this.finish()
      })
    });
}
Enter fullscreen mode Exit fullscreen mode

Note: The complete code has been submitted to the HarmonyOS Third-Party Library. Please use the following command to install it.

ohpm install @free/network
Enter fullscreen mode Exit fullscreen mode

Calling method

// GET request
Http.get<object>("url",new Map());
// POST request
Http.post<object>("url",new Map());
// Download Request
Http.download<string>("url");
// Uploading image request
Http.upImage<string>("url",{image:"file"});
// Get request for uploading multiple images
Http.upImages("url",[{image:"file"}]);
// Perform multiple asynchronous requests
Http.requests({url:"url1"},{url:"url2",resp:(resp)=>{}});
// Perform synchronous execution of multiple requests
Http.requestsAsync({url:"url1"},{url:"url2",resp:(resp)=>{}});
Enter fullscreen mode Exit fullscreen mode

If you like this content, please give a little heart!

Top comments (0)