Как изменить ajax src atributte без нового запроса? - PullRequest
0 голосов
/ 16 мая 2018

Я пытаюсь создать iframe с системой, которая использует HTTP-аутентификацию. Я использую этот код:

<iframe id="dashboard"></iframe>
<script type="text/javascript">
                            $.ajax(
                                {
                                    url: \'https://mysystem.xxxx/\',
                                    beforeSend: function(xhr) {
                                    xhr.withCredentials = true;

                                    xhr.setRequestHeader(
                                    "Authorization", "Basic Z2Vxxxxxxxxxxx=="
                                    );
                                    },
                                     success: function(data) {
                                    $(\'#dashboard\').attr(\'src\', \'https://mysystem.xxxx\');
                                    $(\'#dashboard\').contents().find(\'html\').html(data);
                                    }

                                }
                            );
                        </script>

С этим кодом, когда страница загружается, она генерирует три запроса к системе:

  • OPTIONS -> Проверяет параметры CORS; это нормально.
  • GET -> Содержит заголовок аутентификации. Система возвращает 200 и отправляет данные.
  • Other GET -> Без заголовка авторизации. Затем система возвращает «401». Это проблема.

Если я уберу эту строку:

$(\'#dashboard\').attr(\'src\', \'https://mysystem.xxxx\');

Страница загружается, но статическое содержимое iframe (images, css, js) возвращает 404.

1 Ответ

0 голосов
/ 16 мая 2018

Вы можете сделать ваши изображения, CSS, JS активы с абсолютными путями, например: https://somedomain.com/path/to/image.jpg. Таким образом, вам не нужно предоставлять iframe src.

Обновление

Предположим, что ваш сервер возвращает вам data в виде строки, вы можете искать и заменять все относительные пути на абсолютные.

const data = `<link rel="/css/relative/path" /><body><img src="/some/relative/path"/>
<img src="https://some-other-abs.com" /></body>`;

const absData = data.replace(/(?:rel|src)="([^"]+)"/g, function(group, match) {
  if (!match.startsWith('http')) {
    return group.replace(match, `http://example.com${match}`);
  }
  return group;
})
console.log(absData);
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...