美文网首页
原生Ajax发送文件流

原生Ajax发送文件流

作者: 王二麻子88 | 来源:发表于2022-04-12 09:22 被阅读0次
/**
* @param url
* @param param 参数对象(包含文件):param.file(el-upload)/param.target.files[0](input[file])
* @param cb 发送成功的回调函数
*/
export function requestImport(url, param, cb, queryStr) {
    var file
    // 加上param.raw,有的组件取回的文件对象,属性值放在raw而非file里
    if (param.file || param.raw) {
        file = param.file || param.raw
    } else {
        file = param.target.files[0]
    }
    var fullUrl = url + `?token=${Cookies.get('token')}`
    // 设置全路径
    if (fullUrl.indexOf('http://') !== 0 && fullUrl.indexOf('https://') !== 0) {
        fullUrl = process.env.VUE_APP_BASE_API + fullUrl
    }

    var xhr = new XMLHttpRequest()
    xhr.open('POST', fullUrl + (queryStr || ''))
    xhr.setRequestHeader('Authorization', Cookies.get('token'))
    xhr.overrideMimeType('application/octet-stream')
    var chunks = file.slice(0, file.size)
    this.$utils.getFileBinary(chunks, function (binary) {
        if (xhr.sendAsBinary) {
            xhr.sendAsBinary(binary)
        } else {
            xhr.send(binary)
        }
    })

    xhr.onreadystatechange = function (e) {
        if (xhr.readyState === 4) {
            if (xhr.status === 200) {
                var resp = JSON.parse(xhr.responseText)
                if (typeof cb === 'function') {
                    cb.call(this, resp)
                }
            }
        }
    }
}

相关文章

  • 原生Ajax发送文件流

  • Django中的Ajax

    一、原生Ajax 二、Jquery中的Ajax 1、$.ajax():type为POST时,表示发送数据,type...

  • 工作总结3.0

    一、通用 ajax 原生ajax封装 ajax自定义header跨域问题 问题原因添加自定义header会导致发送...

  • php 发送与接收流文件

    php 发送与接收流文件 sendStreamFile.php 把文件以流的形式发送 receiveStreamF...

  • Ajax的高级--应用部分

    Ajax工作方式是向客户端进行发送数据。发送表单和文件是Ajax的两个常见的用途。表单的数据发送是很多的,在...

  • 前端-04-ajax

    1.概述 实际工作中jquery提供的ajax无法满足要求,常自行封装 发送ajax请求-原生 post请求 用户...

  • 原生js发送ajax请求

  • Ajax请求

    原生Ajax请求 一、创建XMLHttpRequest对象 二、准备发送请求-配置发送请求的一些行为 第一个参数:...

  • 导出,下载文件

    使用Iframe标签 发送ajax 返回 文件名 ··· public void exportData(@Requ...

  • 基于JQuery的ajax前后端数据交互

    打开页面即发送请求 像后台发送内容(不包含文件) PS:上边两种ajax写法作用相同,第一种是简写 向后台发送文件...

网友评论

      本文标题:原生Ajax发送文件流

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