如何在 UWP 中获取 WebView 的网页内容

Question

I have a WebView for visiting web page. And I use below code to get the output html source code.

    private void Webview_Loaded(object sender, RoutedEventArgs e)
    {
        string htmlStr = LenovoID.GetProfileData();
        webview.Navigate(new Uri(htmlStr));
    }

    private async void Webview_NavigationCompleted(WebView sender, WebViewNavigationCompletedEventArgs args)
    {
        string resulthtml = null;
        try
        {
            resulthtml = await webview.InvokeScriptAsync("eval", new string[] { "document.documentElement.outerHTML;" });
            Debug.WriteLine(".................................html = {0}", resulthtml);
        }
        catch (Exception ex)
        {
        }
    }

The resulthtml, which is the web page's source code is below:

.................................html = <userkeyinfo><div xmlns="http://www.w3.org/1999/xhtml" style="color: blue; font-weight: normal; margin-left: -4em;">&lt;?xml version="1.0" encoding="ISO-8859-1"?&gt;</div><style xmlns="http://www.w3.org/1999/xhtml">@namespace html url(http://www.w3.org/1999/xhtml); :root {                       font:small Verdana;        font-weight: bold;         padding: 2em;              padding-left:4em;       }                          * {                           display: block;            padding-left: 2em;      }                          html|style {                  display: none;          }                          html|span, html|a {           display: inline;           padding: 0;                font-weight: normal;       text-decoration: none;  }                          html|a[tabindex='0'] {        cursor: pointer;        }                          html|span.block {             display: block;         }                          *[html|hidden],            *[html|hidden] *,          span.block[html|hidden] {     display:none!important; }                          .expand {                     display: block;         }                          .expand:before {              content: '+';              color: red;                position: absolute;        left: -1em;             }  .collapse {                   display: block;         }                          .collapse:before {            content: '-';              color: red;                position: absolute;        left:-1em;              }                         </style><a xmlns="http://www.w3.org/1999/xhtml" tabindex="0" class="collapse" role="treeitem" aria-expanded="true" aria-posinset="1" aria-setsize="1" aria-level="1" style="color: blue; margin-left: -2em; position: relative;">&lt;<span style="color: rgb(153, 0, 0);">userkeyinfo</span>&gt;</a><oneuser><a xmlns="http://www.w3.org/1999/xhtml" tabindex="0" class="collapse" role="treeitem" aria-expanded="true" aria-posinset="1" aria-setsize="3" aria-level="2" style="color: blue; margin-left: -2em; position: relative;">&lt;<span style="color: rgb(153, 0, 0);">oneuser</span>&gt;</a><uid><a xmlns="http://www.w3.org/1999/xhtml" tabindex="-1" role="treeitem" aria-expanded="true" aria-posinset="1" aria-setsize="16" aria-level="3" style="color: blue; margin-left: -2em;">&lt;<span style="color: rgb(153, 0, 0);">uid</span>&gt;</a>10041167847<span xmlns="http://www.w3.org/1999/xhtml" style="color: blue;">&lt;/<span style="color: rgb(153, 0, 0);">uid</span>&gt;</span></uid><lastname><a xmlns="http://www.w3.org/1999/xhtml" tabindex="-1" role="treeitem" aria-expanded="true" aria-posinset="2" aria-setsize="16" aria-level="3" style="color: blue; margin-left: -2em;">&lt;<span style="color: rgb(153, 0, 0);">lastname</span>&gt;</a>Xue<span xmlns="http://www.w3.org/1999/xhtml" style="color: blue;">&lt;/<span style="color: rgb(153, 0, 0);">lastname</span>&gt;</span></lastname><firstname><a xmlns="http://www.w3.org/1999/xhtml" tabindex="-1" role="treeitem" aria-expanded="true" aria-posinset="3" aria-setsize="16" aria-level="3" style="color: blue; margin-left: -2em;">&lt;<span style="color: rgb(153, 0, 0);">firstname</span>&gt;</a>Tom<span xmlns="http://www.w3.org/1999/xhtml" style="color: blue;">&lt;/<span style="color: rgb(153, 0, 0);">firstname</span>&gt;</span></firstname><middlename><a xmlns="http://www.w3.org/1999/xhtml" tabindex="-1" role="treeitem" aria-expanded="true" aria-posinset="4" aria-setsize="16" aria-level="3" style="color: blue; margin-left: -2em;">&lt;<span style="color: rgb(153, 0, 0);">middlename</span>/&gt;</a></middlename><gender><a xmlns="http://www.w3.org/1999/xhtml" tabindex="-1" role="treeitem" aria-expanded="true" aria-posinset="5" aria-setsize="16" aria-level="3" style="color: blue; margin-left: -2em;">&lt;<span style="color: rgb(153, 0, 0);">gender</span>/&gt;</a></gender><agegroup><a xmlns="http://www.w3.org/1999/xhtml" tabindex="-1" role="treeitem" aria-expanded="true" aria-posinset="6" aria-setsize="16" aria-level="3" style="color: blue; margin-left: -2em;">&lt;<span style="color: rgb(153, 0, 0);">agegroup</span>/&gt;</a></agegroup><addresses><a xmlns="http://www.w3.org/1999/xhtml" tabindex="-1" role="treeitem" aria-expanded="true" aria-posinset="7" aria-setsize="16" aria-level="3" style="color: blue; margin-left: -2em;">&lt;<span style="color: rgb(153, 0, 0);">addresses</span>/&gt;</a></addresses><tels><a xmlns="http://www.w3.org/1999/xhtml" tabindex="-1" role="treeitem" aria-expanded="true" aria-posinset="8" aria-setsize="16" aria-level="3" style="color: blue; margin-left: -2em;">&lt;<span style="color: rgb(153, 0, 0);">tels</span>/&gt;</a></tels><emails><a xmlns="http://www.w3.org/1999/xhtml" tabindex="-1" role="treeitem" aria-expanded="true" aria-posinset="9" aria-setsize="16" aria-level="3" style="color: blue; margin-left: -2em;">&lt;<span style="color: rgb(153, 0, 0);">emails</span>/&gt;</a></emails><birthyear><a xmlns="http://www.w3.org/1999/xhtml" tabindex="-1" role="treeitem" aria-expanded="true" aria-posinset="10" aria-setsize="16" aria-level="3" style="color: blue; margin-left: -2em;">&lt;<span style="color: rgb(153, 0, 0);">birthyear</span>/&gt;</a></birthyear><birthmonth><a xmlns="http://www.w3.org/1999/xhtml" tabindex="-1" role="treeitem" aria-expanded="true" aria-posinset="11" aria-setsize="16" aria-level="3" style="color: blue; margin-left: -2em;">&lt;<span style="color: rgb(153, 0, 0);">birthmonth</span>/&gt;</a></birthmonth><birthday><a xmlns="http://www.w3.org/1999/xhtml" tabindex="-1" role="treeitem" aria-expanded="true" aria-posinset="12" aria-setsize="16" aria-level="3" style="color: blue; margin-left: -2em;">&lt;<span style="color: rgb(153, 0, 0);">birthday</span>/&gt;</a></birthday><bloodtype><a xmlns="http://www.w3.org/1999/xhtml" tabindex="-1" role="treeitem" aria-expanded="true" aria-posinset="13" aria-setsize="16" aria-level="3" style="color: blue; margin-left: -2em;">&lt;<span style="color: rgb(153, 0, 0);">bloodtype</span>/&gt;</a></bloodtype><career><a xmlns="http://www.w3.org/1999/xhtml" tabindex="-1" role="treeitem" aria-expanded="true" aria-posinset="14" aria-setsize="16" aria-level="3" style="color: blue; margin-left: -2em;">&lt;<span style="color: rgb(153, 0, 0);">career</span>/&gt;</a></career><version><a xmlns="http://www.w3.org/1999/xhtml" tabindex="-1" role="treeitem" aria-expanded="true" aria-posinset="15" aria-setsize="16" aria-level="3" style="color: blue; margin-left: -2em;">&lt;<span style="color: rgb(153, 0, 0);">version</span>&gt;</a>2<span xmlns="http://www.w3.org/1999/xhtml" style="color: blue;">&lt;/<span style="color: rgb(153, 0, 0);">version</span>&gt;</span></version><registerlang><a xmlns="http://www.w3.org/1999/xhtml" tabindex="-1" role="treeitem" aria-expanded="true" aria-posinset="16" aria-setsize="16" aria-level="3" style="color: blue; margin-left: -2em;">&lt;<span style="color: rgb(153, 0, 0);">registerlang</span>&gt;</a>zh_CN<span xmlns="http://www.w3.org/1999/xhtml" style="color: blue;">&lt;/<span style="color: rgb(153, 0, 0);">registerlang</span>&gt;</span></registerlang><span xmlns="http://www.w3.org/1999/xhtml" class="block" style="color: blue; margin-left: -2em;">&lt;/<span style="color: rgb(153, 0, 0);">oneuser</span>&gt;</span></oneuser><span xmlns="http://www.w3.org/1999/xhtml" class="block" style="color: blue; margin-left: -2em;">&lt;/<span style="color: rgb(153, 0, 0);">userkeyinfo</span>&gt;</span></userkeyinfo>

And if I formatted it (use this online tool: https://htmlformatter.com/ ) and save it to 1.html. The I use web explorer to visit it, then it looks like below.

My purpose is to extract data from the shown xml component, eg get last name Xue, first name Tom, etc.

I guess there needs three steps :

1. Format the html string;
2. Get web content (xml strings) from the formatted html;
3. Extract xml component from xml whole strings, eg last name Xue

How to do it?

Answer 1

My purpose is to extract data from the shown xml component

HTML itself is also a kind of XML, which can be parsed as XML. If you want to get the content in the firstname tag, you can use the following method:

private async Task ReadXml(StorageFile file)
{
    string htmlContent = await FileIO.ReadTextAsync(file);
    XDocument doc = XDocument.Parse(htmlContent);
    var firstNameList = doc.Root.Descendants(XName.Get("firstname"));
    if (firstNameList.Count() > 0)
    {
        string firstName = firstNameList.First().Value;
        firstName = Regex.Replace(firstName, @"<[^>]*>", "");
        // do other things...
    }
}

XDocument uses Linq to complete the node query. In addition, it can also read and write XML documents through XMLDocument .