World War I Windows 10 (64) and World War I 64

Source: Internet
Author: User

World War I Windows 10 (64) and World War I 64

[Download source code]

Backwater world war I Windows 10 (64)-control (WebView): Load requests of the specified HttpMethod, customize the http header of the request, and interaction between the app and js



Author: webabcd


Introduction
WebView)

  • Load the request of the specified HttpMethod
  • Http header of the custom request
  • Interaction between apps and js



Example
1. demonstrate how WebView loads requests with the specified HttpMethod and how to customize the http header of the request
WebApi/Controllers/WebViewPostController. cs

/ *
  * For WebView demo "How to load a request with a specified HttpMethod, and how to customize the request's http header"
  * /

using System.IO;
using System.Linq;
using System.Net.Http;
using System.Text;
using System.Threading.Tasks;
using System.Web.Http;

namespace WebApi.Controllers
{
     public class WebViewPostController: ApiController
     {
         [HttpPost]
         public async Task <HttpResponseMessage> Post ()
         {
             Stream stream = await this.Request.Content.ReadAsStreamAsync ();
             StreamReader sr = new StreamReader (stream);
             string postData = sr.ReadToEnd ();
             sr.Dispose ();

             string myHeader = this.Request.Headers.GetValues ("myHeader"). FirstOrDefault ();

             HttpResponseMessage result = new HttpResponseMessage
             {
                 Content = new StringContent ($ "post data: {postData} <br /> myHeader: {myHeader}", Encoding.UTF8, "text / html")
             };

             return result;
         }
     }
}

Controls/WebViewDemo/WebViewDemo3.xaml

<Page
    x:Class="Windows10.Controls.WebViewDemo.WebViewDemo3"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Windows10.Controls.WebViewDemo"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="Transparent">
        <StackPanel Margin="10 0 0 0">

            <WebView Name="webView" Width="800" Height="300" HorizontalAlignment="Left" />

        </StackPanel>
    </Grid>
</Page>

Controls/WebViewDemo/WebViewDemo3.xaml. cs

/ *
 * WebView-Embedded browser control (inherited from FrameworkElement, see / Controls / BaseControl / FrameworkElementDemo /)
 *
 *
 * This example is for demonstration
 * 1. How WebView loads the request for the specified HttpMethod
 * 2. How WebView customizes the request's http header
 * /
 
using System;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.Web.Http;

namespace Windows10.Controls.WebViewDemo
{
    public sealed partial class WebViewDemo3: Page
    {
        public WebViewDemo3 ()
        {
            this.InitializeComponent ();

            this.Loaded + = WebViewDemo3_Loaded;
        }

        private void WebViewDemo3_Loaded (object sender, RoutedEventArgs e)
        {
            // Instantiate HttpRequestMessage (you can specify the requested HttpMethod and the custom request's http header)
            HttpRequestMessage httpRequestMessage = new HttpRequestMessage (HttpMethod.Post, new Uri ("http: // localhost: 44914 / api / webviewpost"));

            // construct post data
            httpRequestMessage.Content = new HttpStringContent ("hello webabcd");

            // custom http header
            httpRequestMessage.Headers.Append ("myHeader", "hello header");

            // Load the specified HttpRequestMessage object via NavigateWithHttpRequestMessage
            webView.NavigateWithHttpRequestMessage (httpRequestMessage);
        }
    }
}


2. Demonstrate the interaction between the app and js
Controls/WebViewDemo/WebViewJavaScript.html


<!-This html is used to demonstrate the interaction between app and js->

<! doctype html>
<html>
<head>
     <title> i am title </ title>
     <script type = 'text / javascript'>

         // app calls js function
         function appToJs (name) {
             return 'app to js:' + name;
         }

         // js passes data to the app
         function jsToApp () {
             window.external.notify ('js to app');
         }

     </ script>
</ head>
<body>
     <input type = 'button' onclick = 'jsToApp ();' value = 'js pass data to app' />
</ body>
</ html>



Controls/WebViewDemo/WebViewDemo4.xaml

<Page
    x: Class = "Windows10.Controls.WebViewDemo.WebViewDemo4"
    xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns: x = "http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns: local = "using: Windows10.Controls.WebViewDemo"
    xmlns: d = "http://schemas.microsoft.com/expression/blend/2008"
    xmlns: mc = "http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc: Ignorable = "d">

    <Grid Background = "Transparent">
        <StackPanel Margin = "10 0 10 10">

            <TextBlock Name = "lblMsg" Margin = "5" />

            <Button Name = "btnAppToJavaScript" Content = "app calls the JavaScript function in the html loaded by WebView" Click = "btnAppToJavaScript_Click" Margin = "5" />

            <Button Name = "btnEval" Content = "Accessing the DOM via eval" Click = "btnEval_Click" Margin = "5" />

            <Button Name = "btnRegisterJavaScript" Content = "Register JavaScript script with html via eval" Click = "btnRegisterJavaScript_Click" Margin = "5" />

            <!-
                Load html page in package via ms-appx-web
            ->
            <WebView Name = "webView" Width = "480" Height = "320" Source = "ms-appx-web: ///Controls/WebViewDemo/WebViewJavaScript.html" HorizontalAlignment = "Left" Margin = "5" />

        </ StackPanel>
    </ Grid>
</ Page>

Controls/WebViewDemo/WebViewDemo4.xaml.cs



/ *
 * WebView-Embedded browser control (inherited from FrameworkElement, see / Controls / BaseControl / FrameworkElementDemo /)
 * InvokeScriptAsync ()-call the specified js function and return the return value of the js function
 * ScriptNotify-event triggered when js receives data passed through window.external.notify ('')
 * AllowedScriptNotifyUris-list of uris allowed to trigger ScriptNotify events
 *
 *
 * This example is used to demonstrate the interaction between app and js
 *
 * Note: For how to register the objects defined in the windows runtime component to the page loaded by WebView so that winrt can be called through js, please refer to the related example in WebViewDemo8.xaml.cs
 * /

/ *
 * Special Note: ScriptNotify support for various uri schemas is as follows
 * 1, http: // is not supported
 * 2. https: // support, you need to set the allowed URI in appxmanifest (http does not work, only https), or you can set or get it through the AllowedScriptNotifyUris property of WebView
 * <ApplicationContentUriRules>
 * <Rule Match = "https://aaa.aaa.aaa" Type = "include" />
 * </ ApplicationContentUriRules>
 * 3.ms-appdata: /// not supported
 * 4, ms-appx-web: /// support
 * 5.ms-local-stream: // support
 * /

using System;
using System.Collections.Generic;
using Windows.UI;
using Windows.UI.Popups;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;

namespace Windows10.Controls.WebViewDemo
{
    public sealed partial class WebViewDemo4: Page
    {
        public WebViewDemo4 ()
        {
            this.InitializeComponent ();

            webView.ScriptNotify + = webView_ScriptNotify;
            webView.NavigationCompleted + = webView_NavigationCompleted;
        }

        void webView_NavigationCompleted (WebView sender, WebViewNavigationCompletedEventArgs args)
        {
            if (args.IsSuccess)
            {
                // get html title
                lblMsg.Text = "html title:" + webView.DocumentTitle;
                lblMsg.Text + = Environment.NewLine;

                // Get or set the html background color
                webView.DefaultBackgroundColor = Colors.Orange;
                lblMsg.Text + = "html backgroundColor:" + webView.DefaultBackgroundColor.ToString ();
            }
        }

        // Event fired when receiving data passed by js through window.external.notify ('')
        private async void webView_ScriptNotify (object sender, NotifyEventArgs e)
        {
            // e.Value-get the data passed by js
            // e.CallingUri-the uri of the page that triggered this event

            await new MessageDialog (e.CallingUri.ToString () + "" + e.Value) .ShowAsync ();
        }

        // app calls js
        private async void btnAppToJavaScript_Click (object sender, RoutedEventArgs e)
        {
            List <string> arguments = new List <string> {"webabcd"};
            // Call the js method: sayHelloToJs ('webabcd'); and return the result
            string result = await webView.InvokeScriptAsync ("appToJs", arguments);

            await new MessageDialog (result) .ShowAsync ();
        }

        // access the DOM via eval
        private async void btnEval_Click (object sender, RoutedEventArgs e)
        {
            // Set the value of document.title (to demonstrate how to set the DOM via eval)
            List <string> arguments = new List <string> {"document.title = 'hahaha';"};
            await webView.InvokeScriptAsync ("eval", arguments);

            // Get the value of document.title (to demonstrate how to get the DOM via eval)
            arguments = new List <string> {"document.title;"};
            string result = await webView.InvokeScriptAsync ("eval", arguments);
            await new MessageDialog (result) .ShowAsync ();
        }

        // Register JavaScript script with html via eval
        private async void btnRegisterJavaScript_Click (object sender, RoutedEventArgs e)
        {
            // Register script with html
            List <string> arguments = new List <string> {"function xxx () {return 'Data returned by the script registered by the app with html';}"};
            await webView.InvokeScriptAsync ("eval", arguments);

            // call the newly registered script
            string result = await webView.InvokeScriptAsync ("xxx", null);

            await new MessageDialog (result) .ShowAsync ();
        }
    }
}



 



Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.