HarmonyOS实现登录页面（七）封装（DevEco Studio）

新建文件夹http

文件夹创建成功

http中创建js文件http.js

js文件创建成功

http.js代码

/**
 *  send http request util file
 */

import http from '@ohos.net.http';

const Base_Url = 'http://nja5ih.natappfree.cc'


export default{
    get(url, fn){
        // 每一个httpRequest对应一个http请求任务，不可复用
        let httpRequest = http.createHttp();
        let options = {
            method: http.RequestMethod.GET,
            // 开发者根据自身业务需要添加header字段
            header: {
                'Content-Type': 'application/json'
            }
        }
        // http://cmn8ut.natappfree.cc/api/login
        httpRequest.request(
            // ***填写http请求的url地址，可以带参数也可以不带参数。URL地址需要开发者自定义。请求的参数可以在extraData中指定***
            Base_Url + url,
            options,
            (err, data) => {//err成功与否，data后台服务器返回的结果
            if (!err) {//成功
                //data.result >> 数据类型：String >> 为了后续的操作，需将data.result转成JSON对象
                fn(JSON.parse(data.result));
            } else {//失败
                console.info('error:' + JSON.stringify(err));
                // 当该请求使用完毕时，调用destroy方法主动销毁。
                httpRequest.destroy();//对象销毁
            }
        }
        );
    },
    post(url, parmas, fn){
        // 每一个httpRequest对应一个http请求任务，不可复用
        let httpRequest = http.createHttp();
        let options = {
            method: http.RequestMethod.POST,
            // 开发者根据自身业务需要添加header字段
            header: {
                'Content-Type': 'application/json'
            },
            extraData: parmas
        }
        // http://cmn8ut.natappfree.cc/api/login
        httpRequest.request(
            // ***填写http请求的url地址，可以带参数也可以不带参数。URL地址需要开发者自定义。请求的参数可以在extraData中指定***
            Base_Url + url,
            options,
            (err, data) => {//err成功与否，data后台服务器返回的结果
                if (!err) {//成功
                    fn(JSON.parse(data.result));
                } else {//失败
                    console.info('error:' + JSON.stringify(err));
                    // 当该请求使用完毕时，调用destroy方法主动销毁。
                    httpRequest.destroy();//对象销毁
                }
            }
        );
    }
}

login.js代码

import router from '@ohos.router'
import prompt from '@ohos.prompt';
import HttpUtil from '../../http/http.js';

export default {
    data: {
        user:{
            username:'',
            password:''
        }
    },
    onInit() {
    },
    changeUsername(event){//通过方法获得输入框的值
        this.user.username = event.value;
    },
    changePassword(event){//通过方法获得输入框的值
        this.user.username = event.value;
    },
    login(){
        console.log("user:" + JSON.stringify(this.user));
        //send http request
        /**
         * Result:{"data":{"dingNumber":"未绑定","email":"1234e45432@qq.com","id":1,
         * "nickname":"神里凌华","password":"","phone":"123345653434","qqNumber":"2354754345",
         * "signature":"aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa","stuNumber":"zz-2002-001",
         * "username":"z","wechat":"zzhasid"},"message":"login success","operate":true}
         */
        HttpUtil.post('/api/login', this.user, (result) => {
            if(result.operate){//成功跳转到首页

                this.$app.$def.globalParams.user = result.data; // result.data > {"nickname":"神里凌华","password":"", ...}

                router.push({
                    url:'pages/main/main'
                });
            }else{
                prompt.showToast({
                    message: result.message
                })
            }
        });
    }
}