jq ajax处理blob格式的图片验证码

用jq的ajax对接图片验证码接口时,怎么处理返回的blob数据流并渲染到img标签上呢

方法如下:

处理blob数据流方法有两种:

1、 设置 xhrFields: { responseType: blob }

2、 或设置 contentType: false, xhr: function () { var xhr = new XMLHttpRequest() xhr.responseType = blob return xhr }

$(function () {
    //图片验证码接口
    myAjax(/act/image-code, {
        _platform_: act_ios,
        userAccount: 13632300000
    }, function (res) {
        let url = window.URL || window.webkitURL
        let codeImgUrl = url.createObjectURL(res)
        $(img).attr("src", codeImgUrl);
    })


    /**
     * 请求公共配置 ============================
     * @param {string} url 接口请求地址
     * @param {object} option 提交的参数
     * @param {function} callback 响应回调
     */

    function myAjax(url, option, callback) {
        var formData = new FormData();

        for (var item in option) {
            formData.append(item, option[item])
        }

        $.ajax({
            url: url,
            type: POST,
            data: formData,
            processData: false,
            // xhrFields: {
            //     responseType: blob
            // },
            contentType: false,
            xhr: function () {
                var xhr = new XMLHttpRequest()
                xhr.responseType = blob
                return xhr
            },
            success: function success(res) {
                callback && callback(res);
            },
            error: function error(err) {
                console.log(接口错误)
            }
        });

    }
});
经验分享 程序员 微信小程序 职场和发展