HarmonyOS 鸿蒙Next 网络请求loading

发布于 1周前 作者 htzhanglong 来自 鸿蒙OS

HarmonyOS 鸿蒙Next 网络请求loading

有没有网络请求的全局loading解决方案?

2 回复

import LoadingDialog from '[@lyb](/user/lyb)/loading-dialog'

export class RequestLoading {

  constructor() {

    this.initLoading()

  }

  public initLoading() {

    // 配置全局参数

    LoadingDialog.setGlobalSettings((setting) => {

      // setting.tintColor = Color.Black

      // setting.textColor = Color.Black

      // setting.backgroundColor = Color.Transparent

    })

  }

  public showLoading() {

    LoadingDialog.showLoading({ msg: '加载中...',})

  }

  public hideLoading() {

    LoadingDialog.hide()

  }

}

//AxiosRequest.ets

//AxiosRequest.ets

import {AxiosHttpRequest,errorHandler} from './AxiosHttp'

import { AxiosError, AxiosRequestHeaders, AxiosResponse } from '[@ohos](/user/ohos)/axios';

import { BusinessError } from '[@kit](/user/kit).BasicServicesKit';

import { RequestLoading } from '../requestLoading/RequestLoading';

const loadingInstance:RequestLoading = new RequestLoading()

/**

 * axios请求客户端创建

 */

const axiosClient = new AxiosHttpRequest({

  baseURL: "/api",

  timeout: 10 * 1000,

  checkResultCode: false,

  headers: {

    'Content-Type': 'application/json'

  } as AxiosRequestHeaders,

  interceptorHooks: {

    requestInterceptor: async (config) => {

      // 在发送请求之前做一些处理,例如打印请求信息

      axiosClient.config.showLoading = config.showLoading

      if (config.showLoading) {

        loadingInstance.showLoading()

      }

      if (config.checkLoginState) {

        // let hasLogin = await StorageUtils.get(StorageKeys.USER_LOGIN, false)

        // LogUtils.debug('网络请求Request 登录状态校验>>>', `${hasLogin.toString()}`);

        // if (hasLogin) {

        //   return config

        // } else {

        //   if (config.needJumpToLogin) {

        //     Router.push(RoutePath.TestPage)

        //   }

        //   throw new AxiosError("请登录")

        // }

      }

      return config;

    },

    requestInterceptorCatch: (err:BusinessError) => {

      if (axiosClient.config.showLoading) {

        loadingInstance.hideLoading()

      }

      return err;

    },

    responseInterceptor: (response:AxiosResponse) => {

      //优先执行自己的请求响应拦截器,在执行通用请求request的

      if (axiosClient.config.showLoading) {

        loadingInstance.hideLoading()

      }

      if(response.data.Response?.Result?.token) {

        AppStorage.setOrCreate('token',response.data.Response?.Result?.token)

      }

      // LogUtils.debug('网络请求响应Response:', `\n${JsonUtils.stringify(response.data)}`);

      if (response.status === 200) {

        return Promise.resolve(response.data);

      } else {

        return Promise.reject(response);

      }

    },

    responseInterceptorCatch: (error:BusinessError) => {

      if (axiosClient.config.showLoading) {

        loadingInstance.hideLoading()

      }

      // LogUtils.error("网络请求响应异常", error.toString())

      errorHandler(error);

      return Promise.reject(error);

    },

  }

});

export default axiosClient;

针对您提到的HarmonyOS 鸿蒙Next 网络请求出现loading的问题,这通常与网络请求的处理、响应速度或系统资源分配有关。以下是一些可能的检查点和优化方向:

  1. 网络状态:首先确认设备的网络连接稳定且信号良好。尝试切换网络环境(如从Wi-Fi切换到移动数据)看是否有改善。

  2. 请求配置:检查网络请求的超时设置是否合理,过短的超时时间可能导致请求在等待服务器响应时被提前终止。

  3. 服务器响应:确认服务器端响应速度正常,没有服务器端的瓶颈或故障导致响应延迟。

  4. 系统资源:查看设备是否运行了过多的后台应用或服务,这些可能会占用网络带宽或CPU资源,影响网络请求的处理速度。

  5. 代码优化:检查网络请求的代码实现,确保使用了高效的网络库和正确的异步处理机制。

  6. 日志分析:利用鸿蒙系统提供的日志工具,分析网络请求过程中的日志信息,查找可能的错误或异常。

如果问题依旧没法解决请联系官网客服,官网地址是:https://www.itying.com/category-93-b0.html 。希望这些建议能帮助您解决问题。

回到顶部