ThunderCat

1) Валидация на клиенте не отменяет обязательность проверки данных на бэкенде.
2) Флаг. После успешной проверки вы устанавливаете проверочную переменную в тру и делаете субмит форме, перед превентДефаулт проверяете эту переменную, и возвращаете тру из листенера если вы отправляете форму обычной отправкой с перезагрузкой, или вызываете функцию, которая отправляет все данные аяксом в случае аякс отправки соответственно.

Я же пытаюсь запросом через AJAX сделать тоже самое, но получаю вот это:

Ну так а что ты хотел получить то? Получил содержимое файла гиф.

Подскажите, как мне получить в response не текст,

Никак, респонс в любом случае умеет получать только текст.

а отобразить именно картинку, которая получается в php.

Либо возвращать линк на сохраненный на своем сервере файл, либо кодировать в бэйс64, ну и после уже создавать имг с срц=респонс.

Вообще слабо понимаю зачем там аякс, тупо вместе где должна быть картинка ставите линк на свой файл с запросом к апи, и туда же гетом передаете ваши дата и код. Типа:

<div class="contact-info">
      <h3 class="text-center mt-mobile-2">Результат</h3>
           <div class="rounded bg-white shadow-dark padding-10 text-center">
                  <div id="barcode">
                       <img src="/mybarcodeapigetter.php?data=ABC-abc-1239&code=Code128">
                  </div>
    	   </div>                        
</div>

Тут вообще отдельная ржака:

foreach ($_GET as $key => $value) {
    $result_get = $result_get . $key . "=" . $value . "&";
}

Ещё парочку, пробовал типа такого, но для нормального функционала он платный.

Платно там Timeline View, Vertical Resource View, и Printer-friendly rendering, что из этого вам критично необходимо?

если запросы генерируются скриптом и контент получается аяксом - просто добавляете заголовок, и в фетч и в xht для этого есть средства. Если же речь идет о переходе по ссылкам - то никак, этим рулит браузер.

Ajax, как я понял, существует для передачи данных на сервер и обработки ответа от него.

Важное уточнение - без перезагрузки страницы. То есть как раз поведение противоположное тому что вам надо.

Знаю, что можно сохранять их, например, в локальном хранилище или куках, но... Выглядит это не особо профессионально :D.

Зависит от целей и задач передачи. Если данные чисто информационного характера, не влияющие на функционал серверной части, то хранение в куках или локалстораже оправдано (например некоторая кастомизация внешнего вида станиц на основе жс и переменных из локального хранилища). Защищенные данные обычно хранят на стороне сервера, например в сессии.

А для передачи пользовательских данных обычно используются формы (пример - логин или регистрация), которые передают от одной страницы в другую зашифрованные данные либо как параметры урл (метод гет), либо через заголовки и тело запроса (метод пост).

открываем инструменты разработчика - нетворк, делаем клик, смотрим что и куда ушло, какой код вернуло, что попало в респонс и что ушло в пэйлоад. После этого думаем, что пошло не так, правим, наслаждаемся заслуженными аплодисментами...

скорее всего вам нужно что-то типа фетч прогресс, а в пхп сделать цикл c выводом данных, и заменить die на echo.