码代码时遇到的小插曲

1. 后端需要的参数是 对象里包含一个数组,但传值之后发现数据格式不正确

在这里插入图片描述
经查找之后发现是在发送请求时的 Content-Type 设置的数据格式 与后端的要求不一致的原因🐷😂,后端需要的时 json 格式
而我写的是

export const postRequest = (url, params) => {
    let accessToken = getStore("accessToken");
    let csrfTOKEN = Cookies.get('csrftoken');
    return axios({
        method: 'post',
        // url: `${base}${Prxfix}${url}`,
        url: `${base}${url}`,
        data: params,
        transformRequest: [function (data) {
            let ret = '';
            for (let it in data) {
                ret += encodeURIComponent(it) + '=' + encodeURIComponent(data[it]) + '&';
            }
            ret = ret.substring(0, ret.length - 1);
            return ret;
        }],
        headers: {
        	😡
            'Content-Type': 'application/x-www-form-urlencoded', 
            'authorization': accessToken,
            'X-CSRFToken': csrfTOKEN
        }
    });
};

解决方法
😍❤
修改请求的 Content-Type
修改后

export const postRequestJson = (url, params) => {
    let accessToken = getStore("accessToken");
    let csrfTOKEN = Cookies.get('csrftoken');
    return axios({
        method: 'post',
        url: `${base}${url}`,
        data: params,
        headers: {
        	😘
            'Content-Type': 'application/json',
            'authorization': accessToken,
            'X-CSRFToken': csrfTOKEN
        }
    })
};

2.导出数据,以excel 表格的形式

1)后端返回的表格的地址
2)前端通过创建 a 标签下载

在这里插入图片描述


var a = document.createElement('a')
a.id = 'download'
a.style.display = 'none'
// res.result 为后端返回的 excel表的 地址
a.href = res.result
document.body.appendChild(a)
a.click()

3.批量导出文档,包括图片,excel表格,word 文档 等等

1)发送请求后,后端返回的是 二进制编码文件
2)前端创建一个a标签

在这里插入图片描述

在这里插入图片描述

/*
 * @param {*} path  批量导出的接口
 * @param {*} params  接口时需传递的参数
 * @param {*} file_name 批量导出时的文件名
 * @param {*} useAxios 是否使用 axios
 */
function batchDownload (path, params, file_name, useAxios = true) {
	if (useAxios) {
		return axios({
			method: 'get',
			url: path,
			params,
			responseType: 'blob'
		}).then((res) => {
			if (!res) {
				return 
			}
			let url = window.URL.createObjectURL(new Blob([res], {type: res.type}))
			let a = document.createElement('a')
			a.style.display = 'none'
			a.href = url
			a.target = '_blank'
			if (file_name) {
				a.setAttribute('download', file_name)
			}
			document.body.appendChild(a)
			a.click()
		})
	}
}

batchDownload(‘.../archive/pack_download’, {}, '文件名')

4.Vue 项目在 IE 浏览器打开报错,其他浏览器无问题

vue 项目在 ie 浏览器打开时,登录系统后,页面跳转报错,报错信息如下
events.js:292
throw er; // Unhandled ‘error’ event
^

Error: read ECONNRESET
at TCP.onStreamRead (internal/stream_base_commons.js:205:27)
Emitted ‘error’ event on Socket instance at:
at emitErrorNT (internal/streams/destroy.js:92:8)
at emitErrorAndCloseNT (internal/streams/destroy.js:60:3)
at processTicksAndRejections (internal/process/task_queues.js:84:21) {
errno: ‘ECONNRESET’,
code: ‘ECONNRESET’,
syscall: ‘read’
}
在这里插入图片描述

解决办法: npm config set proxy=http://10.69.4.40:808 把 http://10.69.4.40:808 改成自己的端口号

  • 3
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值