美文网首页工作生活
VUE HTTP 请求模块化

VUE HTTP 请求模块化

作者: 悟空_大师兄_ | 来源:发表于2019-07-03 13:53 被阅读0次

    数据加解密DES  md5

    config.js

    import CryptoJS from 'crypto-js';

    import md5 from 'js-md5';

    export const appKey = 'cb60158028a44b5234ce9ed1c03bc7acb0';

    export const calcuMD5 = (pwd) => { return md5(pwd) }

    export const encryptBy =(plaintText,CRYPTOJSKEY) =>{

        var plaintText = plaintText;

        var options = {

          mode: CryptoJS.mode.ECB,

          padding: CryptoJS.pad.Pkcs7

        };

        var key = CryptoJS.enc.Utf8.parse(CRYPTOJSKEY);

        var encryptedData = CryptoJS.DES.encrypt(plaintText, key, options);

        var encryptedBase64Str = encryptedData.toString();

        return encryptedBase64Str;

    }

    export const decryptBy = (encryptedBase64Str,CRYPTOJSKEY, type) => {

        var encryptedBase64Str = encryptedBase64Str;

        var options = {

          mode: CryptoJS.mode.ECB,

          padding: CryptoJS.pad.Pkcs7

        };

        var key = CryptoJS.enc.Utf8.parse(CRYPTOJSKEY);

        // 解密

        var decryptedData = CryptoJS.DES.decrypt(encryptedBase64Str, key, options);

        // 解密后,需要按照Utf8的方式将明文转位字符串

        var decryptedStr = decryptedData.toString(CryptoJS.enc.Utf8);

        return decryptedStr;

    }

    创建 http.js

    import axios from 'axios';

    import Qs from 'qs';

    import { appKey , calcuMD5 , decryptBy , encryptBy } from '../config';

    const BASE_URL = process.env.BASE_API; //域名路径

    const seedMd5 = calcuMD5("U2FsdGVkX189N3VRCrUckSMoQM98v8PB"); //加密MD5

    const formatParams = (data)=>{

        let arr = [];

        for (let name in data) {

            arr.push(encodeURIComponent(name) + "=" + encodeURIComponent(data[name]));

        }

        return arr.join("&");

    }

    axios.defaults.timeout = 15000; //超时时间

    export const httpService = (url,params,method) => {

        let slol = JSON.stringify(params);

        let data = encryptBy(slol, seedMd5); //加密参数

        let t = Date.parse(new Date()); //时间戳

        let fString = appKey + "&" + t + "&" + data;

        let sign = encryptBy(fString, seedMd5);

        let newParams = {

            data,

            appKey,

            t,

            sign,

            token:window.sessionStorage.token ? window.sessionStorage.token : ''

        }

        if(method === 'post')

        {

            return  new Promise((resolve, reject) => {

                axios.post(BASE_URL+url, Qs.stringify(newParams),{

                    headers: {

                        'Content-Type': 'application/x-www-form-urlencoded'

                    }

                    }).then(data=>{

                    data.data = JSON.parse(decryptBy(data.data,calcuMD5("U2FsdGVkXN32VRRCrUckSMoQM98v8PBHUHA")))

                    resolve(data.data);

                }).catch(error=>{

                    reject(error);

                });

            })

        }

        else

        {

            return  new Promise((resolve, reject) => {

                axios.get(BASE_URL+url+'?'+formatParams(params)).then(data=>{

                    resolve(data.data);

                }).catch(error=>{

                    reject(error);

                });

            })

        }

    }

    创建 相对http请求的调用的文件

    menber.js  

    import { httpService } from './httpService';

    /**

    * @name 登录

    * @param {*} params

    */

    export const login = (params) =>{

        return httpService('me.huha.platform.api.service.BUserLoginOutService.login/v1.0.0',params,'post');

    }

    使用时引用 

    import { login } from '../../api/member';

    使用

    async gofun() {

    const loginData = await login(data);

     if(loginData.retType !== 1) return this.$message.error(loginData.retMsg);

    this.$store.commit('userInfo',loginData,data);

    }

    相关文章

      网友评论

        本文标题:VUE HTTP 请求模块化

        本文链接:https://www.haomeiwen.com/subject/yhuqhctx.html