Integrating Web Content

Июль 25, 2022

Главная
Информатика
Integrating Web Content

Содержание

2. Why do I need web content inside my app? Integrating local content Ready to use assets
3. Why do I need web content inside my app? Integrating web content External content updated independently
4. Why do I need web content inside my app? Using ready components There are ready to
5. WebView in XAML Source="ms-appx-web:///help/about.html"/>
6. WebView access from the code // Page navigations webView1.Navigate("ms-appdata:///local/intro/welcome.html"); // Events processing webView1.DOMContentLoaded += webView1_DOMContentLoaded; private
7. DEMO 01: Intro into WebView
8. What is inside WebView? The new engine shared with Microsoft Edge EdgeHTML Chakra App EdgeHTML.dll Chakra
9. Interacting with code inside WebView InvokeScriptAsync From C# to JS – invoking a method window.external.notify +
10. DEMO 02: Interacting with WebView
11. The next level App C#/XAML WebView Local or external files
12. Hosted Web App Reusing current investments Development and deploy workflow Responsive design and adaptation to mobile
13. Hosted Web App Full access to the Universal Windows Platform Access rules managed thru app manifest
14. DEMO 03: Hosted Web App
15. Resume
16. Resume Integrating web content Use the most appropriate technology stack for each task 3 scenarios C#
17. What else you should learn Data transferring thru the network WebAuthenticationBrocker Basic scenarios: OAuth etc. Apache
18. Contacts Konstantin Kichinsky Microsoft konkich@microsoft.com & @kichinsky
20. Скачать презентацию

Слайд 2

Why do I need web content inside my app?
Integrating local content
Ready

to use assets (e.g. help resources).
HTML/CSS markup is easier (e.g. complex text).

App

WebView

Local files from app package

Слайд 3

Why do I need web content inside my app?
Integrating web content
External

content updated independently (e.g. app using agreement).
Authorization forms

App

WebView

Pages from internet

Слайд 4

Why do I need web content inside my app?
Using ready components
There

are ready to use JS-libraries/frameworks for my task (e.g. maps).

App

WebView

Local/External pages with JS-libraries

Слайд 5

WebView in XAML

Source="ms-appx-web:///help/about.html"/>

Слайд 6

WebView access from the code
// Page navigations
webView1.Navigate("ms-appdata:///local/intro/welcome.html");
// Events processing
webView1.DOMContentLoaded += webView1_DOMContentLoaded;
private

void webView1_DOMContentLoaded(WebView sender, WebViewDOMContentLoadedEventArgs args)
{
// Show status.
if (args.Uri != null)
{
statusTextBlock.Text = "Content for " + args.Uri.ToString() + " has finished loading";
}
}

Слайд 7

DEMO 01: Intro into WebView

Слайд 8

What is inside WebView?
The new engine shared with Microsoft Edge
EdgeHTML Chakra
App
EdgeHTML.dll
Chakra

Слайд 9

Interacting with code inside WebView
InvokeScriptAsync
From C# to JS – invoking a

method
window.external.notify + ScriptNotify
From JS to C# -- notifying with some data
AddWebAllowedObject
Passing a WinRT-object from C# to JS
Requires managing access policies

Слайд 10

DEMO 02: Interacting with WebView

Слайд 11

The next level
App C#/XAML
WebView
Local or external files

Слайд 12

Hosted Web App
Reusing current investments
Development and deploy workflow Responsive design and

adaptation to mobile scenarios
Flexibility in updating
App package – Windows Store Content – Web Server (Cloud)

Слайд 13

Hosted Web App
Full access to the Universal Windows Platform
Access rules managed

thru app manifest

Слайд 14

DEMO 03: Hosted Web App

Слайд 15

Resume

Слайд 16

Resume
Integrating web content
Use the most appropriate technology stack for each task
3

scenarios
C# + Web View (JS)
Packaged App (JS) + WinRT Components (C#)
Hosted App (JS) + WinRT Components (C#)

Слайд 17

What else you should learn
Data transferring thru the network
WebAuthenticationBrocker
Basic scenarios: OAuth

etc.
Apache Cordova
Packed App, Hosted App and cross-platform development

Слайд 18

Integrating Web Content

Содержание

Why do I need web content inside my app?Integrating local contentReady

Why do I need web content inside my app?Integrating web contentExternal

Why do I need web content inside my app?Using ready componentsThere

WebView in XAML

WebView access from the code// Page navigationswebView1.Navigate("ms-appdata:///local/intro/welcome.html");// Events processingwebView1.DOMContentLoaded += webView1_DOMContentLoaded;private

DEMO 01: Intro into WebView

What is inside WebView?The new engine shared with Microsoft EdgeEdgeHTML ChakraAppEdgeHTML.dllChakra

Interacting with code inside WebViewInvokeScriptAsyncFrom C# to JS – invoking a

DEMO 02: Interacting with WebView

The next levelApp C#/XAMLWebViewLocal or external files

Hosted Web AppReusing current investments Development and deploy workflow Responsive design and

Hosted Web AppFull access to the Universal Windows PlatformAccess rules managed

DEMO 03: Hosted Web App

Resume

ResumeIntegrating web contentUse the most appropriate technology stack for each task3

What else you should learnData transferring thru the networkWebAuthenticationBrockerBasic scenarios: OAuth

ContactsKonstantin KichinskyMicrosoftkonkich@microsoft.com & @kichinsky

Похожие презентации

Why do I need web content inside my app?
Integrating local content
Ready

Why do I need web content inside my app?
Integrating web content
External

Why do I need web content inside my app?
Using ready components
There

WebView access from the code
// Page navigations
webView1.Navigate("ms-appdata:///local/intro/welcome.html");
// Events processing
webView1.DOMContentLoaded += webView1_DOMContentLoaded;
private

What is inside WebView?
The new engine shared with Microsoft Edge
EdgeHTML Chakra
App
EdgeHTML.dll
Chakra

Interacting with code inside WebView
InvokeScriptAsync
From C# to JS – invoking a

The next level
App C#/XAML
WebView
Local or external files

Hosted Web App
Reusing current investments
Development and deploy workflow Responsive design and

Hosted Web App
Full access to the Universal Windows Platform
Access rules managed

Resume
Integrating web content
Use the most appropriate technology stack for each task
3

What else you should learn
Data transferring thru the network
WebAuthenticationBrocker
Basic scenarios: OAuth

Contacts
Konstantin Kichinsky
Microsoft
konkich@microsoft.com & @kichinsky