Send image to browser as a PHP post response

So, I'm making a post request with CURL:

<?php

$url = 'http://url/to/site';

$data = array(
  "tk" => $_GET["tk"]
);

$ch = curl_init($url);
//seteamos la petición
curl_setopt($ch, CURLOPT_POST, 1);
curl_setopt($ch, CURLOPT_POSTFIELDS, $data);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
curl_setopt($ch, CURLOPT_FAILONERROR, true);

$response = curl_exec($ch);

if (curl_errno($ch)) {
  $response = curl_error($ch);
}

curl_close($ch);
echo $response;

and in the other site I'm doing a database search with the tk, and then sending a response:

$bs = new lecRed; //lecRed it's a class I created and used before

$tk = $_POST["tk"];

$rspta = $bs->searchByTK($tk)->fetchObject();//here I retrieve the info from the DB
$arr = array(
  "id"      => $rspta->ide,
  "name"  => $rspta->name,
  "adsc"  => $rspta->adsc,
  "pic" => $rspta->pic
);

echo "<h1>ID: " . $arr["id"] . "</h1>";
echo "<h1>NAME: " . $arr["name"] . "</h1>";
echo "<h1>ADSC: " . $arr["adsc"] . "</h1>";

So far it is working fine. But now I want to "echo" the image. I have the image in the server (in the same route as the last php file).

I tried doing:

echo "<img src='".$arr["pic"]."' />";

but it didn't worked. I also tried:

$file = 'img/' . $arr["pic"];
$type = 'image/jpeg';
header('Content-Type:' . $type);
header('Content-Length: ' . filesize($file));
readfile($file);

but it only shows this weird characters:

I tried this:

$file = 'img/' . $arr["pic"];

if (file_exists($file)) {
  header('Content-Description: File Transfer');
  header('Content-Type: application/octet-stream');
  header('Content-Disposition: attachment; filename=' . basename($file));
  header('Content-Transfer-Encoding: binary');
  header('Expires: 0');
  header('Cache-Control: must-revalidate, post-check=0, pre-check=0');
  header('Pragma: public');
  header('Content-Length: ' . filesize($file));
  ob_clean();
  flush();
  readfile($file);
  exit;
}

but it's more of the same.

I also tried using de gd library:

header('content-type: image/jpeg');
$image_file_path = "img/" . $arr["pic"];

switch (pathinfo($image_file_path)['extension']) {
  case 'png':
    $image = imagecreatefrompng($image_file_path);
    break;
  case 'gif':
    $image = imagecreatefromgif($image_file_path);
    break;
  default:
    $image = imagecreatefromjpeg($image_file_path);
}

echo imagejpeg($image);
imagedestroy($image);

But nothing worked. I ran out of options. Anyone have any idea?

One solution is to use a "Data URL": <img src="data:...

> https://www.w3docs.com/snippets/html/how-to-display-base64-images-in-html.html
>
> Images encoded with Base64 can be embedded in HTML by using the <img>
> tag. This can help to increase the page load time for smaller images
> by saving the browser from making additional HTTP requests.
>
> Base64 encoding and Data URL go hand-in-hand, as Data URLs reduce the
> number of HTTP requests that are needed for the browser to display an
> HTML document.
>
> The <img> tag has a src attribute and contains the Data URL of the
> image. A Data URL is composed of two parts, which are separated by a
> comma. The first part specifies a Base64 encoded image, and the second
> part specifies the Base64 encoded string of the image.
>
> <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4
> //8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==" alt="Red dot" />

This link has several examples, using PHP base64_encode():

• https://stackoverflow.com/a/70022975/421195