将接口请求返回图片渲染到Dom上(原生Ajax请求)

最新推荐文章于 2024-03-28 16:46:54 发布

CHANGEAA

最新推荐文章于 2024-03-28 16:46:54 发布

阅读量555

点赞数

分类专栏： javascript ajax请求文章标签： ajax

本文链接：https://blog.csdn.net/qq_43588993/article/details/118682828

版权

javascript 同时被 2 个专栏收录

5 篇文章 0 订阅

订阅专栏

ajax请求

1 篇文章 0 订阅

订阅专栏

需求：登录需要验证码
此处传一个id到后端请求，返回一张验证码图片，登录的时候将此id和验证码提交到后端进行验证。

使用原生Ajax请求

    let uid = new Date().valueOf();
    let xmlhttp;
    xmlhttp=new XMLHttpRequest();
    xmlhttp.open("GET", utilsConfig.serverDomainUrl + '/Account/GetVerifyCode?code='+uid,true);	//拼接上id参数
    xmlhttp.responseType = "blob";	
    xmlhttp.onload = function(){
        if (this.status == 200) {
            var blob = this.response;
            var img = document.createElement("img");
            img.onload = function(e) {
                window.URL.revokeObjectURL(img.src); 
            };
            img.src = window.URL.createObjectURL(blob);
            $(".codeImg").html(img);	//将图片渲染到dom上
        }
    }
    xmlhttp.send();