Подпапки в статических хостингах Azure - PullRequest
0 голосов
/ 21 июня 2019

Я хочу использовать хранилище файлов BLOB-объектов Azure для размещения статического веб-сайта.

Это прекрасно работает, если html-страница находится в корневой папке $ web-storage.

Но если я помещу веб-страницу в подпапку, относительные ссылки (например, на файлы CSS) больше не будут работать, поскольку они интерпретируются как корневые ссылки

<link href="css/bootstrap.css" rel="stylesheet">

index.html находитсяв "subfolder1"

Но вместо

https://blablabla.web.core.windows.net/subfolder1/css

оно разрешено до

https://blablabla.web.core.windows.net/css

Это ошибка Azure или недоразумение / ошибка в моем html?

1 Ответ

1 голос
/ 26 июня 2019

На самом деле $web - это специальный контейнер в хранилище общего назначения Azure V2, который является корневым путем, например www для сервера Apache HTTP или wwwroot для IIS для размещения всех статических папок и файлов. Все папки и их подпапки должны быть созданы в контейнере $web. Вы можете увидеть его информацию на портале Azure, как показано на рисунке ниже.

enter image description here

Вот мой пример создания двух папок a & b и их index.html в контейнере $web в Azure Storage Explorer.

enter image description here

Если получить доступ к моей основной конечной точке https://<account name>.z7.web.core.windows.net, индексная веб-страница моего статического веб-сайта будет примером веб-страницы Angular, как показано ниже,

enter image description here

Затем, чтобы получить доступ к подпапкам a и b, как вы хотите, индексная страница этих подпапок, как показано ниже.

index.html папки a

<html>
<body>
<h2>A</h2>
</body>
</html>

enter image description here

enter image description here

Надеюсь, это поможет понять структуру статического веб-сайта в хранилище общего назначения Azure V2.


Обновление для вашего комментария:

Я обновляю свой a/index.html файл и добавляю новый файл a/a.css, коды которого указаны ниже.

а / index.html

<html>
<head>
<link rel="stylesheet" type="text/css" href="a.css">
</head>
<body>
<h2>A</h2>
<span id='test'>Hello</span>
</body>
</html>

а / a.css

#test {
    color: red;
}

Существует некоторое поведение вплоть до реализации браузера.

В: Какая разница между http://host/a и http://host/a/? A: Чтобы получить к ним доступ в Chrome, два URL-адреса ответят одинаковым контентом с a/index.html. Однако их базовые пути различны: / для http://host/a, но /a/ для http://host/a/, что приведет к другому поведению при загрузке ресурса относительного пути a.css, как показано на рисунках ниже.

Рис 1.

enter image description here

Рис 2.

enter image description here

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...