Приложения Магазина Windows — JavaScript и передача данных в элемент управления WebView

Чтобы использовать веб-приложение, введите токен в текстовое поле на странице приветствия и нажмите кнопку «Подтвердить». 

Если токен действителен, пользователю предоставляется URI, который затем можно использовать для отслеживания своего времени с помощью представления таймера запуска / остановки в веб-приложении. 

Проблема, которую мы собираемся решить в этом блоге, заключается в следующем: 

Я знаю, что с помощью JavaScript страница, загруженная в элемент управления WebBrowser, может взаимодействовать с кодом C #, когда включена опция ObjectForScripting, но есть ли у нас доступ к аналогичной функции в приложении Магазина Windows при использовании элемента управления WebView? 

ScriptNotify и AllowedScriptNotifyUris

Оказывается, что JavaScript-код страницы, загруженной в элемент управления WebView, может вызывать код C # страницы, если вы установили событие ScriptNotify. 

В соответствии с документацией Microsoft о событии ScriptNotify (
http://msdn.microsoft.com/en-us/library/windows/apps/windows.ui.xaml.controls.webview.scriptnotify
), в зависимости от того, какой метод вы используете для Чтобы отобразить страницу в элементе управления WebView, вам может потребоваться указать или не указать URI, которым разрешено вызывать обработчик событий. 

Я просто устанавливал свойство «Источник» WebView с желаемым URI, поэтому возникает вопрос: нужно ли мне указывать список URI или нет? 

Как выясняется, если я не указываю список URI при использовании свойства Source WebView, событие ScriptNotify не инициируется. 

Вы можете указать список разрешенных URI следующим образом:

List<Uri> lstAllowedUris = new List<Uri>(); 
lstAllowedUris.Add(new Uri("http://apps.dovico.net")); 
wvBrowser.AllowedScriptNotifyUris = lstAllowedUris;

Примечание . Свойство AllowedScriptNotifyUris почти предполагает, что можно сказать, что одна страница может вызывать обработчики событий ScriptNotify, но ни одна из других страниц сайта не может. 

Ниже приведен пример подключения обработчика событий ScriptNotify:

public MainPage() 
{
// Only allow the following domain's pages to call our ScriptNotify 
// event handler 
List<Uri> lstAllowedUris = new List<Uri>(); 
lstAllowedUris.Add(new Uri("http://apps.dovico.net")); 
wvBrowser.AllowedScriptNotifyUris = lstAllowedUris; 

// Attach our ScriptNotify event handler 
wvBrowser.ScriptNotify += wvBrowser_ScriptNotify;
}

Ниже приведен пример самого обработчика событий:

void wvBrowser_ScriptNotify(object sender, NotifyEventArgs e) 
{
// The string received from the JavaScript code can be found 
// in e.Value
}

Что касается JavaScript, то код аналогичен тому, что вы написали бы при вызове кода C # элемента управления WebBrowser, за исключением того, что вызываемая функция называется «уведомлять», где с помощью элемента управления WebBrowser вы можете определить собственное имя функции обратного вызова. , 

Ниже приведен пример кода JavaScript, который вызывает код C #:

// We have a couple of checks to make sure the 'external' 
// object and 'notify' method exist before we try using them 
// because our project is a web application and might not be 
// running in a WebView control (the checks prevent 
// JavaScript errors if the method doesn't exist) 
if ((typeof (window.external) !== "undefined") && 
(typeof (window.external.notify) !== "undefined")) 
{
window.external.notify(sURI);
}

В заключении

Несмотря на то, что JavaScript может передавать строку только в обработчик событий ScriptNotify, настоятельно рекомендуется проверить строку в ожидаемом формате, прежде чем пытаться использовать ее, даже если строка получена из источника, который вы включили в список разрешенные URI. 

Дополнительные ресурсы

Если вас интересуют подробности о том, как реализовать всплывающее окно «Параметры», особенно если вы используете элемент управления WebView, у меня есть предыдущая статья, которая может быть интересна: 
Windows 8: приложения Магазина Windows и элемент управления WebView
 (мы обсуждали, как отобразить всплывающее окно настроек и сфокусированное в основном на том, чтобы сделать элемент управления WebView приятным во всплывающем окне). 

Если вас интересуют RoamingSettings и событие DataChanged, может также оказаться полезной следующая статья: 
Windows 8: приложения Магазина Windows — RoamingSettings и событие DataChanged
. Ниже приведена копия моего проекта на данный момент (C #, созданная с использованием Visual Studio). Express 2012 для Windows 8):  https://github.com/downloads/dovicoapi/DOVICOTimerForWindowsStore/DOVICOTimerForWindowsStore.zip