В первой части этой серии мы создали отвечающее всем требованиям онлайн приложение для Windows 8 и проверили его работоспособность. Во второй и последней части мы сосредоточим все внимание на работе с сервером и контентом. Мы будем рассматривать механизм добавления статей с помощью приложения, изучим протокол транспортного уровня и создадим живой контент хост.
В итоге у вас появится отличная система управления контентом на бесплатном хостинге, где вы сможете публиковать и корректировать статьи. При этом наше приложение, основанное на HTML5, практически будет готово к размещению на Windows Store.
Настройка контент хоста с помощью веб-браузера.
Мы будем использовать имеющиеся в наличии бесплатные инструменты и серверную систему управления контентом (CMS) с открытым исходным кодом. Размещение контента будет осуществляться на бесплатном аккаунте веб-сайта Azure, поэтому весь рабочий цикл будет бесплатным. Основная цель заключается в создании всех необходимых компонентов с минимальными усилиями. При этом человек может полностью разобраться со всем рабочим циклом веб-разработки, ориентированной на Microsoft, и в дальнейшем сможет вносить нужные изменения.
Вы можете завершить процесс прямо с вашего любимого браузера.
Вот пример того, как приложения представляются на Windows Store. Приложение используется датским мебельным дизайнером Фритсом Хансеном в качестве каталога, с указанием данных по продуктам, загруженным с его веб-сайта.
Статьи переносятся как JSON.
В Windows Store файл приложения /js/data.js, группы и статьи, которые будут отображаться в приложении, извлекаются с контент сервера благодаря использованию JSON:
var jsonGroup = {
Key: "Group Key", // key
Title: "Group title", // title
SubTitle: "Group sub title", // subtitle
GroupViewImage: "URL", // image - used in tile views
Image: "URL", // image - big group view image
Description: "HTML" // html - a group description
};
var jsonArticle = {
GroupKey: "Group Key", // key of group article belongs to
Title: "Article title", // title
SubTitle: "Article sub title", // subtitle
GroupViewImage: "URL", // image - used in tile views
Image: "URL", // image - big article lead image
Description: "HTML", // html - the actual article
Url: "URL" // url - for share charm
}Метод, используемый приложением для извлечения данных, является довольно грубым. Изначально, приложением загружаются все статьи, а затем кэшируются в локальной файловой системе. Приложение автоматически обновляет статьи после каждого запуска или использует кэшированное содержимое, если контент сервер недоступен.
Для создания собственного контент хоста, вы должны организовать структуру, аналогичную той, которая описана ниже. Для достижения целей данной статьи, мы будем использовать различные онлайн сервисы и готовые наработки, что позволит достаточно быстро создать контент хост с возможностью управления содержимым и требуемыми конечными точками JSON.
Запуск на веб-сайте Azure композитной C1 системы управления CMS.
Windows Azure является «облачной» платформой Microsoft, которая с одной стороны предлагает хостинг и инструменты для создания крупномасштабных веб-приложений, а с другой стороны обеспечивает легкий доступ к веб-приложениям. В нашем случае мы пойдём самым простым путём — т.е. воспользуемся веб-сайтами Azure.
Azure позволяет бесплатное размещение до 10 веб-сайтов. Выполнить настройки контент хоста на этой платформе довольно легко. Мы создали композитную C1, систему управления CMS с открытым исходным кодом, работающую на .NET Web.
Примечание: я являюсь членом основной команды, работающей с композитной C1 системой, поэтому мой выбор CMS не совсем беспристрастен. Благодаря очень хорошему знанию CMS я смог создать все необходимые для этой статьи инструменты, которые позволяют организовать удобный просмотр, так что, пожалуйста, потерпите.
Если вы не хотите использовать «облачный» маршрут, вы можете скачать композитную C1 систему или исходный код из CodePlex.
Windows Azure: подписавшись на первый Time
Если ранее вы ещё не размещали веб-сайт на Azure, то нужно будет выполнить регистрацию, которая займет около пяти минут. Вам будет предложена 90-дневная бесплатная пробная версия, но пользование веб-сайтом, который вы создадите на Azure, останется бесплатным даже после истечения 90-дневного термина.
Подпишитесь для получения аккаунта на Windows Azure.
Для завершения регистрации, вам необходимо будет указать номер мобильного телефона и номер кредитной карты. Не нужно паниковать: до тех пор, пока вы не решите обновить проект веб-сайта или не начнёте активно использовать различные платные услуги Windows Azure, с вас никогда не возьмут плату.
Внимание, имейте ввиду, что бесплатный вариант имеет ограничения по трафику и использованию процессора, и вы не сможете настроить доменное имя веб-сайта, если не внесли оплату, однако, с целью передачи данных в приложение можно использовать имя хоста наподобие my-content-host.azurewebsites.net.
Порядок действий, которые необходимо выполнить для регистрации:
- Перейдите на страницу Windows Azure для получения пробной версии.
- Нажмите кнопку «Try it now» (попробовать прямо сейчас).
- Войдите, используя Microsoft аккаунт.
- В мастере регистрации укажите вашу страну и нажмите кнопку «Next» (далее).
- На следующей странице укажите номер вашего мобильного телефона и нажмите кнопку «Send text message» (отправить текстовое сообщение).
- Введите шестизначный код, который вы получите в виде текстового сообщения на свой телефон и нажмите кнопку «Verify code» (проверить код), а затем «Next».
- Заполните данные касательно вашей кредитной карты, адреса и нажмите «Next».
Создание веб-сайта на Azure.
Если у вас есть доступ к странице управления Windows Azure, то можно создать экземпляр Azure веб-сайта:
- Запуск страницы управления.
- Нажмите кнопку «New» (создать новый) в нижней панели инструментов.
- Выберите «Compute» (обработать), затем «Web Site» (веб-сайт), затем «From Gallery» (из галереи).
- Выберите «.NET CMS Composite C1» и нажмите продолжить.
- Укажите имя и место для вашего сайта, и завершите работу мастера.
Совокупность всех этих шагов позволяет создать веб-сайт. Благодаря возможности предварительного просмотра веб-сайтов в режиме «Free» (свободный) можно оценить работоспособность сайта и если всё нормально, то вы увидите URL.
Представление всех отчётов о готовности сайта может занять полминуты. Когда проверка будет выполнена, вы сможете запустить сайт, нажав на URL.
После запуска веб-сайта, появится мастер CMS настроек.
Мастер CMS настроек.
Далее вы должны выполнить пошаговые инструкции мастера CMS настроек; по умолчанию установлены лишь основные опции, такие как язык контента и инициализация веб-сайта. Выберите «Open Cph — Razor» (открыть Cph — Razor) веб-сайт, если предполагаете использовать Twitter Bootstrap и хотите посмотреть на ASP.NET Razor.
После завершения работы мастера вы увидите окно администрирования CMS (консоль C1) и экран приветствия:
Добро пожаловать в консоль C1. Это именно то место, где вы сможете управлять контентом, настройками веб-сайта, устанавливать пакеты расширений и делать многие другие вещи.
Установка расширений для приложения.
С помощью консоли C1, вы можете установить два пакета расширений, — созданные специально для нашего приложения — которые позволяют получить дополнительные функциональные возможности, …
Если вы хотите прочитать полностью статью, посетите сайт наших спонсоров