<html>
<head>
<title> Javascript Fetch API </title>
</head>
<body>
<p> Javascript Fetch API </p>
<img src = "" id = "flower_data" width = 350 height = 350/>
<script>
//get the URL of the image request
let url = 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQ6Wdr0b-NynbbpYy7LfcpExp7HCNCwXi_TyPdIcZYgKWNKPZaKNT22LfPVuV9xsUVGt2Uid_zgjN068hCIuCC3moU_ZYa5tuP64VG24LBWYiLG07rJgKP6WaxzwP6pkvfzexXJLSiTIpioss7sJ7sfqJfs6YaFz6ZYoyl_XrN6yvAg5KD2QahfSRmIfac/w489-h256-rw/desktop%20image.png';
async function fetchData() {
//use fetch API method
let response_data = await fetch(url);
//converts image into blob method
const blob_data = await response_data.blob();
//display image in html tag
document.getElementById('flower_data').src = URL.createObjectURL(blob_data);
}
fetchData();
</script>
</body>
</html>