Pull to refresh

JavaScript Dynamic Content shim для Windows JavaScript Apps

Reading time 1 min
Views 5.2K
Посвящается разработчикам, которые пытались заставить популярные веб-фрейморки, такие как AngularJS, KnockoutJS, Ember.js и другие, работать внутри Windows Store JavaScript приложения, но столкнулись с непониманием рантайма в лице ошибки ниже.



Это такая фича, которая запрещает динамически модифицировать HTML/DOM контент, используя некоторые методы, делая приложения более секьюрными, но при этом делает невозможным использование более или менее сложных веб-фреймворков, которые активно используют такие фичи (например, innerHTML).

Решение есть


Прошу любить и жаловать — JavaScript Dynamic Content shim for Windows Store apps, специальная JS библиотека от Microsoft Open Technologies, которую достаточно включить в html файл.

Пример для AngularJS




1. Создаем Windows Store JavaScript приложение



2. Добавляем тестовое AngularJS приложение

Скачиваем исходный код github.com/ccoenraets/angular-directory. Читаем описание приложения, если нужно/интересно.

Переносим папку client как есть в только что созданное Windows Store приложение (Show All Files -> Include In Project).



3. Добавляем winstore-jscompat.js
Выкачиваем и добавляем winstore-jscompat.js в свой проект.



Не забываем включить библиотеку в client/index.html:



4. Выставляемый client/index.html в качестве стартовой страницы и запускаем





5. Финальный штрих

Видно, что приложение работает, но картинки не подгружаются. Это специальная логика AngularJS, которая помечает специфичный для Windows Store App ms-appx:// протокол как unsafe.



Чиним в client/js/app.js:


6. В итоге

Tags:
Hubs:
+26
Comments 3
Comments Comments 3

Articles