Xutils Post请求带加载弹框

本文介绍了一种基于XUtils的Android网络请求实现方案,包括加载提示框的显示与隐藏、网络状态检查、POST请求发送及JSON数据解析等关键步骤。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

Android开发时我们需要使用到网络请求,大部分请求需要一个加载圈提示用户正在加载,我做了一个粗糙的请求加载供大家参考。

public class XutilsHttpPost {
    //加载弹框
    private  Dialog dialog;
    //弹框内的布局
    private  RelativeLayout view;
    //弹框显示页面
    private Context context;
    public XutilsHttpPost() {
        context = null;
    }
    //构造方法(参数可以传null,传null时与上一个构造方法相同,代表该请求不显示加载弹框)
    public XutilsHttpPost(Context context) {
        this.context=context;
    }
    //弹框操作(弹框操作只能在主线程里进行,切记!)
    private Handler handler = new Handler(){
        @Override
        public void handleMessage(Message msg) {
            super.handleMessage(msg);
            //判断是否需要创建弹框
            if (dialog == null&&context!=null){
                //弹框样式很粗糙可以改变
                dialog = new Dialog(context,R.style.customDialog);
                //创建显示内容
                view = new RelativeLayout(context);
                view.setGravity(Gravity.CENTER);
                ProgressBar progressBar = new ProgressBar(MyApplication.getContext());
                view.addView(progressBar);
                dialog.setContentView(view);
            }
            //判断弹框是否需要显示以及开启或者关闭
            if (context != null) {
                if (dialog.isShowing())
                    dialog.dismiss();
                else
                    dialog.show();
            }
        }
    };


    //判断网络是否连接:返回值 -1:没有网络  1:WIFI网络2:wap网络3:net网络
    public int GetNetype()
    {
        int netType = -1;
        ConnectivityManager connMgr = (ConnectivityManager) MyApplication.getContext().getSystemService(Context.CONNECTIVITY_SERVICE);
        NetworkInfo networkInfo = connMgr.getActiveNetworkInfo();
        if(networkInfo==null)
        {
            return netType;
        }
        int nType = networkInfo.getType();
        if(nType==ConnectivityManager.TYPE_MOBILE)
        {
            if(networkInfo.getExtraInfo().toLowerCase().equals("cmnet"))
            {
                netType = 3;
            }
            else
            {
                netType = 2;
            }
        }
        else if(nType==ConnectivityManager.TYPE_WIFI)
        {
            netType = 1;
        }
        return netType;
    }
    /**
     * 返回jsonobject的接口(这里只有成功后返回数据的参数,可以加一个成功或失败的参数)
     */
    public interface GetJson{
        void getjson(JSONObject obj);
    }

    /**
     * 请求方法
     * @param uri 路径
     * @param params 参数 (只是将RequestParams封装了一下方便查看参数内容)
     * public class MParams extends RequestParams {
    *private Map<String,String> map;
    *
    *public MParams() {
    *map = new HashMap<String, String>();
    *}
    *public void add(String name, String value){
    *addBodyParameter(name,value);
    *map.put(name,value);
    *}

     *@Override
     *public String toString() {
     *return map.toString();
     *}
     *}
     * @param getJson 接收接口
     */
    public void Post(final String uri, final MParams params, final GetJson getJson){
        if (GetNetype() == -1){
            ToastUtil.show("请检查网络是否开启!");
            return;
        }

        //默认传入用户Token
        params.add("token", UserInfo.Token);//"26245f1ae9114772b2449630ed3185f8");
        //传入了超时时间
        HttpUtils http = new HttpUtils(20000);
        http.send(HttpRequest.HttpMethod.POST,
                uri,
                params,
                new RequestCallBack<String>() {

                    @Override
                    public void onStart(){
                        if (context != null)
                        handler.sendMessage(new Message());
                    }

                    @Override
                    public void onLoading(long total, long current, boolean isUploading) {
                        if (isUploading) {

                        } else {

                        }
                    }

                    @Override
                    public void onSuccess(ResponseInfo<String> responseInfo) {
                        if (context != null)
                            handler.sendMessage(new Message());
                        L.d("返回参数》",responseInfo.result+"《");
                        //判断返回数据是否为空
                        if (responseInfo.result.length() != 0) {
                            try {
                                JSONObject jsonObject = JSONObject.parseObject(responseInfo.result);
                                if (!jsonObject.getBoolean("success")) {
                                    ToastUtil.show(jsonObject.getString("message"));
                                }
                                //将数据传入页面
                                getJson.getjson(jsonObject);
                            } catch (JSONException e) {
                                L.d("异常",e.getMessage());
                                ToastUtil.show("返回参数格式错误");
                                L.d("请求路径-----》" + uri);
                                L.d("返回参数-----》" + responseInfo.result);
                            }
                        }else {
                            L.d("收到参数为空");
                        }
                    }

                    @Override
                    public void onFailure(HttpException error, String msg) {
                        if (context != null)
                            handler.sendMessage(new Message());
                        ToastUtil.show("网络请求失败");
                        L.d("请求路径-----》" + uri+"?"+params.toString());
                        L.d("————————————————————错误信息————————————",msg);
                        L.d("————————————————————网络请求失败errorCode————————————",""+error.getExceptionCode());
                    }
                });
    }

}
样式比较粗糙,希望能给大家提供思路。

### 在 Vue3 中使用 Axios 或 Fetch 发送参数的 POST 请求 在 Vue3 项目中,发送有参数的 POST 请求可以通过 Axios 或 Fetch API 实现。以下是两种方式的具体实现方法。 #### 使用 Axios 发送 POST 请求 Axios 是一个基于 Promise 的 HTTP 客户端,可以轻松地发起网络请求。以下是一个使用 Axios 发送参数的 POST 请求的示例: ```javascript // src/utils/axios.js import axios from 'axios'; // 创建 Axios 实例并设置默认配置 const axiosInstance = axios.create({ baseURL: 'https://api.example.com', // 设置基础 URL timeout: 5000, // 超时时间 headers: { 'Content-Type': 'application/json' } // 设置请求头 }); // 添加请求拦截器 axiosInstance.interceptors.request.use( config => { const token = localStorage.getItem('token'); // 获取存储的 token if (token) { config.headers['Authorization'] = `Bearer ${token}`; // 添加 token 到请求头 } return config; }, error => { return Promise.reject(error); } ); // 添加响应拦截器 axiosInstance.interceptors.response.use( response => { return response.data; // 返回响应数据 }, error => { console.error('请求失败:', error); // 全局错误处理 return Promise.reject(error); } ); export default axiosInstance; ``` 在组件中使用 Axios 实例发送 POST 请求: ```javascript <script> import axiosInstance from '@/utils/axios'; // 引入 Axios 实例 export default { methods: { async submitData() { const data = { key: 'value' }; // 要发送的数据 try { const response = await axiosInstance.post('/submit', data); // 发起 POST 请求 console.log('数据提交成功:', response); // 处理响应 } catch (error) { console.error('数据提交失败:', error); // 捕获错误 } } } }; </script> ``` 上述代码中,`axiosInstance.post('/submit', data)` 方法用于发送 POST 请求[^1],其中 `/submit` 是目标接口路径,`data` 是需要传递的参数。 --- #### 使用 Fetch API 发送 POST 请求 Fetch 是浏览器内置的 API,也可以用来发送网络请求。以下是使用 Fetch 发送参数的 POST 请求的示例: ```javascript <script> export default { methods: { async submitDataWithFetch() { const url = 'https://api.example.com/submit'; // 目标接口 URL const data = { key: 'value' }; // 要发送的数据 const options = { method: 'POST', // 请求方法 headers: { 'Content-Type': 'application/json' // 设置请求头 }, body: JSON.stringify(data) // 将数据序列化为 JSON 字符串 }; try { const response = await fetch(url, options); // 发起请求 if (!response.ok) { throw new Error('网络响应错误'); } const result = await response.json(); // 解析响应数据 console.log('数据提交成功:', result); // 处理响应 } catch (error) { console.error('数据提交失败:', error); // 捕获错误 } } } }; </script> ``` 上述代码中,`fetch(url, options)` 方法用于发送 POST 请求[^4],其中 `options` 对象包含请求方法、请求头和请求体。 --- #### 配置 Axios 作为全局实例 为了方便在 Vue3 项目中使用 Axios,可以将其配置为全局实例。以下是配置方法: ```javascript // main.js import { createApp } from 'vue'; import App from './App.vue'; import axios from 'axios'; // 设置 Axios 默认配置 axios.defaults.baseURL = 'https://api.example.com'; // 基础 URL axios.defaults.headers.common['Content-Type'] = 'application/json'; // 全局请求头 // 创建 Vue 应用实例 const app = createApp(App); // 将 Axios 挂载到全局对象上 app.config.globalProperties.$axios = axios; app.mount('#app'); ``` 在组件中可以直接通过 `this.$axios` 使用 Axios: ```javascript <script> export default { methods: { async submitData() { const data = { key: 'value' }; try { const response = await this.$axios.post('/submit', data); console.log('数据提交成功:', response); } catch (error) { console.error('数据提交失败:', error); } } } }; </script> ``` --- #### 总结 - 使用 Axios 可以通过创建实例或挂载到全局对象上简化 POST 请求的实现。 - Fetch API 是原生支持的解决方案,无需额外依赖,但功能相对简单。 - 根据项目需求选择合适的工具和实现方式。 ---
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值