Как работать со специальными символами в json при асинхронном запросе?

Пытаюсь получить строку из MySQL таблицы, которая содержит символ перевода строки \n. При передаче через асинхронный запрос этой строки (использую json) - получаю null в xhr.response. Обычные строки передаются нормально - но стоит появиться хоть одному специальному символу - получаю null;

Что я могу сделать чтобы и null не получать и понимать где в тексте перевод строки???

P.S. 5я и 6я строки в таблице содержат символ перевода строки \n

Структура папок

.
├── app
│   ├── core
│   │   └── Router.php
│   └── view
│       └── default.php
├── index.php
└── js
    └── test.js

Код

index.php

<?php
    require_once __DIR__ . '/app/core/Router.php';

    $router = new Router;
    $router->getPage();

Router.php

<?php
    class Router {
        public array $request;

        public function __construct() {
            $this->request = explode('/', $_SERVER['REQUEST_URI']);
        }

        public function getPage(): void {
            switch($this->request[1]) {
                case 'test':
                    $mysql = new mysqli('localhost', 'root', 'KisaragiEki4', 'Test');
                    $query = <<<END
                    select some_text from test where id = 6
                    END;
                    $data = $mysql->query($query);
                    foreach($data as $row) {
                        echo <<<END
                        {
                            "some_text": "{$row['some_text']}"
                        }
                        END;
                    }
                    break;
                default:
                    include_once __DIR__ . '/../view/default.php';
                    break;
            }
        }
    }

default.php

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
    </head>
    <body>
        <h1>Я стартовая страница</h1>
        <button class="button" onclick="getMysqlData();">button</button>
        <template class="template">
            <p></p>
        </template>
        <script src="js/test.js"></script>
    </body>
</html>

test.js

function getMysqlData() {
    let xhr = new XMLHttpRequest();
    xhr.open('GET', 'test');
    xhr.send();
    xhr.responseType = 'json';
    xhr.onload = () => {
        alert(xhr.response);
        let template = document.querySelector('.template');
        let element = template.content.cloneNode(true);
        text = xhr.response['some_text'];
        element.append(text);
        document.body.append(element);
    };
}

Содержание таблицы в MySQL

mysql> select * from test;
+----+-------------+
| id | some_text   |
+----+-------------+
|  1 | hello       |
|  2 | hello       |
|  3 | hello       |
|  4 | hello
      |
|  5 | hello
hello |
|  6 | hi
hello    |
+----+-------------+
6 rows in set (0,00 sec)

Ответы (0 шт):