console 命令行工具 X clear

console

var eleAppend = document.getElementById("forAppend");

window.URL = window.URL || window.webkitURL;

if (typeof history.pushState == "function") {
    var xhr = new XMLHttpRequest();
    xhr.open("get", "https://xcimg.szwego.com/o_1ecm6bnep1l3qfon1nh3t3lps7i.jpg", true);
    xhr.responseType = "blob";

    xhr.onload = function () {
        console.log('xhr: ', this);
        if (this.status == 200) {
            var blob = this.response;
            var imgSRC = URL.createObjectURL(blob);
            var img = document.createElement("img");
            img.onload = function (e) {
                URL.revokeObjectURL(img.src); // 清除释放
            };
            img.src = imgSRC;
            eleAppend.appendChild(img);
        }
    };
    xhr.send();
} else {
    eleAppend.innerHTML = '<p style="color:#cd0000;">浏览器不给力，请更换浏览器后重试</p>';
};


// 获取远端图片

var getImg = () => {
    let url = '20200820/i1597910826_6994_0?imageMogr2/auto-orient/thumbnail/!310x310r/quality/100/format/jpg';
    let req = {
        method: 'get',
        baseURL: 'https://xcimg.szwego.com/',
        url,
        responseType: 'blob'
    };
    let onResponse = (res) => {
        console.log('response: ', res.data);
        let img = document.getElementById("planets");
        img.width = 200;
        // res.data.pipe(fs.createWriteStream('ada_lovelace.jpg'))
        img.src = URL.createObjectURL(res.data);
        img.onload = function (e) {
            console.log('width', this.width, this.height);
            console.log('naturalWidth', this.naturalWidth, this.naturalHeight);
            URL.revokeObjectURL(img.src); // 清除释放
        };
    };

    //get...
    axios(req).then(onResponse).catch((e) => { console.log('error ', e); });
};
setTimeout(() => {
    getImg();
}, 200);

<!DOCTYPE html>
<html>

<head>
	<meta charset="utf-8">
	<title>菜鸟教程(runoob.com)</title>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
</head>

<body>
	<div id="forAppend" class="demo"></div>

	<img id="planets" src="10.jpg" >
    </img>

</body>
</html>