Как мне получить директиву ng-include для работы с сетью доставки контента?
Можно ли получить директиву ng-include для работы с CDN?
В этом случае:
<div ng-include='http://cdn.somewebsite.com/templates/home.tpl.html'></div>
Поддомен cdn someebsite.com отображается через DNS/CName в сеть доставки контента.
Однако при загрузке основного сайта someebsite.com он не отображает шаблон. Я предполагаю, что внутренне он рассматривает это как междоменный вызов.
Есть ли какая-нибудь работа, чтобы получить шаблоны Angular на стороннем CDN и работать с локальным доменом?
Ответы
Ответ 1
Да, вы правы - проблема кросс-доменного вызова.
Официальные документы говорят:
По умолчанию URL-адрес шаблона ограничен тем же доменом и протоколом, что и документ приложения. Это делается путем вызова $sce.getTrustedResourceUrl на нем. Чтобы загрузить шаблоны из других доменов или протоколов, вы можете либо перечислить их в белый список, либо обернуть их как доверенные значения. Обратитесь к Angular Строгому контекстуальному экранированию.
и
Обратите внимание: в дополнение к этой политике применяются правила политики одинакового происхождения и политики совместного использования ресурсов (CORS) браузера и могут дополнительно ограничивать, успешно ли загружен шаблон. Это означает, что без правильной политики CORS загрузка шаблонов из другого домена не будет работать во всех браузерах.
Пример:
angular.module('myApp', []).config(function($sceDelegateProvider) {
$sceDelegateProvider.resourceUrlWhitelist([
// Allow same origin resource loads.
'self',
// Allow loading from outer templates domain.
'http://cdn.somewebsite.com/templates/**'
]);
});
Полезные ссылки:
Таким образом, ваша проблема может быть решена с помощью соответствующих параметров Angular, но не для всех браузеров.
Ответ 2
Возможно, вы можете немного изменить этот код. У меня есть клиентская интрасеть в datatbase и подключена к удаленному серверу API. Я использую приложение angular, чтобы вытащить HTML, но он является частью объекта JSON, поэтому, очевидно, это довольно специфично для моих собственных потребностей.
Я получаю полный контроль над атрибутами CORS моего сервера, поэтому я могу это сделать. Если вы попробуете Google или какой-нибудь другой сайт... вы застряли с iframe. (Я не знаю, что такое JW настолько строгое!)
Итак, вот что я делаю, чтобы получить удаленные данные HTML.
1
В моем контроллере я добавляю следующее:
<div ng-bind-html="content"></div>
то в коде я добавлю это
$http.get(url)
.then(function (data) {
$scope.content = $sce.trustAsHtml(data.data.PageData);
});
Что это. Просто не забывайте, что сайт в URL-адресе должен позволять вам получать данные через удаленную систему.
СЕЙЧАС: Просто для удовольствия я использовал IFRAME для доставки данных с других сайтов до того, как CORS был даже изобретен. Это был большой взлом. Перед AJAX я сделал бы крошечную форму на одной странице со всеми значениями форм, пустыми. На другой странице у меня будет iframe для этого и просто заполните эти поля ввода javascript и опубликуйте их обратно с помощью javascript, сохранив основную страницу без перезагрузки.
Если вам нужно больше контролировать свои данные, вы можете просто иметь скрытый iframe, разорвать HTML-код, который вы хотите от него, поместить в переменную и отбросить все, что хотите на своей странице.
Всегда есть какой-то способ, чтобы все было сделано.:)