Question

我正在设计一个显示API图像的功能。 API返回普通image/jpeg。如果需要，我可以更改API以返回图像的字符串。如何以<img>或<canvas？

显示此图片

  function getPhoto() {
    var username = document.getElementById('username').value
    var password = document.getElementById('password').value
    var base_url = encodeURI(document.getElementById('base_url').value)
    var xhttp = new XMLHttpRequest();
    xhttp.open("POST", "http://api.reteps.tk/getPowerschoolPhoto", true);
    xhttp.setRequestHeader('Content-type', 'application/x-www-form-urlencoded');
    xhttp.send(`base_url=https://${base_url}&username=${username}&password=${password}`);
    console.log("Image:"+xhttp.IMAGE); // show the image???
  }

Answer 1

您可以像这样设置图像src属性：

$('#myImg').attr('src', RESULT_OF_YOUR_API_CALL);

查看这个小提琴：https://jsfiddle.net/1hu6e6a3/

显示从api收到的图像

1 个答案: