Comment afficher du code XML avec le contrôle WebBrowser?
J'ai une string qui contient une xml. Je veux définir la valeur du contrôle WebBrowser avec elle et l'afficher sous la forme xml.
Je peux définir la valeur avec browser.DocumentText, mais comment puis-je lui indiquer de s'afficher au format XML?
Pas particulièrement facile mais possible. Soit vous enregistrez votre chaîne dans un fichier xml et vous la rechargez en utilisant Navigate () (beurk ...), soit vous appliquez un xsl à votre xml (sans blague!) Qui la restitue comme le navigateur IE Est-ce que.
voir:
http://social.msdn.Microsoft.com/Forums/en/winforms/thread/18ca6734-ddb7-4f44-a77c-9a7713dcc2e1
Pour donner du code à la première solution suggérée par @PaoloFalabella (c'est-à-dire, écrivez le contenu d'une chaîne dans un fichier xml temporaire et naviguez-y):
//create a random temporary file with an .xml file extension
var path = Path.GetTempPath();
var fileName = Guid.NewGuid().ToString() + ".xml";
var fullFileName = Path.Combine(path, fileName);
//write the contents of your xml string to the temporary file we just created
File.WriteAllText(fullFileName, xmlText); //xmlText is your xml string
//"navigate" to the file
webBrowser.Navigate(fullFileName); //webBrowser is your WebBrowser control
Il existe un bon lien ici: Affichage de XML dans le contrôle .NET WebBrowser
public XmlDocument DocumentXml
{
set
{
Stream s = <defaultss.xsl from embedded resource file>
XmlReader xr = XmlReader.Create(s);
XslCompiledTransform xct = new XslCompiledTransform();
xct.Load(xr);
StringBuilder sb = new StringBuilder();
XmlWriter xw = XmlWriter.Create(sb);
xct.Transform(value, xw);
this.DocumentText = sb.ToString();
}
}
Ici, je fournis une solution étape par étape pour afficher un fichier XML dans le contrôle WebBrowser.
- Ajouter un contrôle WebBrowser dans un WinForm.
- Localisez le fichier defaultss.xsl quelque part dans votre dossier source.
Et copier ci-dessous la méthode.
private void DisplayXml() { string xmlString = "<Person><Name>Fawad</Name><Age>23</Age></Person>"; // Load the xslt used by IE to render the xml XslCompiledTransform xTrans = new XslCompiledTransform(); xTrans.Load(Path.Combine(new DirectoryInfo(Environment.CurrentDirectory).Parent.Parent.FullName, @"resources\defaultss.xsl")); // Read the xml string. StringReader sr = new StringReader(xmlString); XmlReader xReader = XmlReader.Create(sr); // Transform the XML data MemoryStream ms = new MemoryStream(); xTrans.Transform(xReader, null, ms); ms.Position = 0; // Set to the document stream webBrowser1.DocumentStream = ms; }
Je copie le contenu de "defaultss.xsl" ici pour ceux qui ne peuvent le trouver nulle part. Il suffit simplement de le coller dans un fichier bloc-notes et de l'enregistrer au format xsl dans le dossier "ressources" ou de le nommer comme vous le souhaitez.
<!--
|
| XSLT REC Compliant Version of IE5 Default Stylesheet
|
| Original version by Jonathan Marsh (jmarsh@xxxxxxxxxxxxx)
| http://msdn.Microsoft.com/xml/samples/defaultss/defaultss.xsl
|
| Conversion to XSLT 1.0 REC Syntax by Steve Muench (smuench@xxxxxxxxxx)
|
+-->
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<!-- Add doctype attributes to keep IE happy -->
<xsl:output indent="no"
method="html"
doctype-public="-//W3C//DTD XHTML 1.0 Transitional//EN"
doctype-system="http://www.w3.org/tr/xhtml1/DTD/xhtml1-transitional.dtd" />
<xsl:template match="/">
<HTML>
<HEAD>
<SCRIPT>
<xsl:comment>
<![CDATA[
function f(e){
if (e.className=="ci") {
if (e.children(0).innerText.indexOf("\n")>0) fix(e,"cb");
}
if (e.className=="di") {
if (e.children(0).innerText.indexOf("\n")>0) fix(e,"db");
} e.id="";
}
function fix(e,cl){
e.className=cl;
e.style.display="block";
j=e.parentElement.children(0);
j.className="c";
k=j.children(0);
k.style.visibility="visible";
k.href="#";
}
function ch(e) {
mark=e.children(0).children(0);
if (mark.innerText=="+") {
mark.innerText="-";
for (var i=1;i<e.children.length;i++) {
e.children(i).style.display="block";
}
}
else if (mark.innerText=="-") {
mark.innerText="+";
for (var i=1;i<e.children.length;i++) {
e.children(i).style.display="none";
}
}
}
function ch2(e) {
mark=e.children(0).children(0);
contents=e.children(1);
if (mark.innerText=="+") {
mark.innerText="-";
if (contents.className=="db"||contents.className=="cb") {
contents.style.display="block";
}
else {
contents.style.display="inline";
}
}
else if (mark.innerText=="-") {
mark.innerText="+";
contents.style.display="none";
}
}
function cl() {
e=window.event.srcElement;
if (e.className!="c") {
e=e.parentElement;
if (e.className!="c") {
return;
}
}
e=e.parentElement;
if (e.className=="e") {
ch(e);
}
if (e.className=="k") {
ch2(e);
}
}
function ex(){}
function h(){window.status=" ";}
document.onclick=cl;
]]>
</xsl:comment>
</SCRIPT>
<STYLE>
BODY {font:small 'Verdana'; margin-right:1.5em; margin-top: 44px;}
.c {cursor:hand}
.b {color:red; font-family:'Courier New'; font-weight:bold;
text-decoration:none}
.e {margin-left:1em; text-indent:-1em; margin-right:1em}
.k {margin-left:1em; text-indent:-1em; margin-right:1em}
.t {color:#990000}
.xt {color:#990099}
.ns {color:red}
.dt {color:green}
.m {color:blue}
.tx {font-weight:bold}
.db {text-indent:0px; margin-left:1em; margin-top:0px;
margin-bottom:0px;padding-left:.3em;
border-left:1px solid #CCCCCC; font:x-small Courier}
.di {font:x-small Courier}
.d {color:blue}
.pi {color:blue}
.cb {text-indent:0px; margin-left:1em; margin-top:0px;
margin-bottom:0px;padding-left:.3em; font:x-small Courier;
color:#888888}
.ci {font:x-small Courier; color:#888888}
PRE {margin:0px; display:inline}
.label {padding-left:20px; vertical-align: middle}
.validation {color: white; padding: 3px; margin: 5px 5px 5px 5px; text-indent: 0}
.summary {position: fixed; top: 0; left: 0; margin: 0px; padding-top: 10px; width: 100%; height: 32px; font-size: 12pt; vertical-align: middle;border-bottom: 2px solid black}
.nav {float: right; padding-right:20px;}
.failure {background: red;}
.success {background: green;}
.warning {background: yellow; color: black}
.selected {font-weight: bold; text-indent: 1em}
</STYLE>
</HEAD>
<BODY class="st">
<xsl:apply-templates/>
</BODY>
</HTML>
</xsl:template>
<!-- Render the schema summary
Include jquery from CDN and render a title bar across top -->
<xsl:template match="processing-instruction('schemaSummary')">
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<div id="schemaSummary" class="validation summary">
<span class="label">
<xsl:value-of select="." />
</span>
<span class="nav">
<button id="prev"><<</button>
<button id="next">>></button>
</span>
</div>
</xsl:template>
<!-- Handle the schemaValid processing instruction
This sets up a document.ready routine that
colour codes a visual queue i.e. a green title bar.
-->
<xsl:template match="processing-instruction('schemaValid')">
<script>
$(document).ready(function() {
$("#schemaSummary").addClass("success")
$("button").css("display", "none");
});
</script>
</xsl:template>
<!-- Handle the schemaInvalid processing instruction
Renders a red title bar with navigation controls to
step through the errors.
-->
<xsl:template match="processing-instruction('schemaInvalid')">
<script>
<![CDATA[
var index = -1;
var errors = $("div.failure");
var offsetFromTop = $("#schemaSummary").outerHeight();
function nextError(){
if(index > -1)
$(errors).eq(index).removeClass("selected");
index ++;
if(index >= $(errors).size())
index = 0;
$(errors).eq(index).addClass("selected");
scrollTo($(errors).eq(index), offsetFromTop);
}
function prevError(){
$(errors).eq(index).removeClass("selected");
index --;
if(index < 0)
index = $(errors).size() - 1;
$(errors).eq(index).addClass("selected");
scrollTo($(errors).eq(index), offsetFromTop);
}
function scrollTo(element, offsetFromTop) {
$('html,body').animate({scrollTop: $(element).offset().top - offsetFromTop},'fast');
}
$(document).ready(function() {
$("#schemaSummary").addClass("warning");
$("#next").click(function() {
nextError();
});
$("#prev").click(function() {
prevError();
});
});
]]>
</script>
</xsl:template>
<!-- Add a colour coded bar in situ i.e. where the validation
error has occured -->
<xsl:template match="processing-instruction('error')">
<div class="validation failure">
<xsl:value-of select="."></xsl:value-of>
</div>
</xsl:template>
<xsl:template match="processing-instruction()">
<DIV class="e">
<SPAN class="b">
<xsl:call-template name="entity-ref">
<xsl:with-param name="name">nbsp</xsl:with-param>
</xsl:call-template>
</SPAN>
<SPAN class="m">
<xsl:call-template name="entity-ref">
<xsl:with-param name="name">lt</xsl:with-param>
</xsl:call-template>?
</SPAN>
<SPAN class="pi">
<xsl:value-of select="name(.)"/>
</SPAN>
<SPAN>
<xsl:call-template name="entity-ref">
<xsl:with-param name="name">nbsp</xsl:with-param>
</xsl:call-template>
<xsl:value-of select="."/>
</SPAN>
<SPAN class="m">
<xsl:text>?></xsl:text>
</SPAN>
</DIV>
</xsl:template>
<xsl:template match="processing-instruction('xml')">
<DIV class="e">
<SPAN class="b">
<xsl:call-template name="entity-ref">
<xsl:with-param name="name">nbsp</xsl:with-param>
</xsl:call-template>
</SPAN>
<SPAN class="m">
<xsl:call-template name="entity-ref">
<xsl:with-param name="name">lt</xsl:with-param>
</xsl:call-template>?
</SPAN>
<SPAN class="pi">
<xsl:text>xml </xsl:text>
<xsl:for-each select="@*">
<xsl:value-of select="name(.)"/>
<xsl:text>="</xsl:text>
<xsl:value-of select="."/>
<xsl:text>" </xsl:text>
</xsl:for-each>
</SPAN>
<SPAN class="m">
<xsl:text>?></xsl:text>
</SPAN>
</DIV>
</xsl:template>
<xsl:template match="@*">
<SPAN>
<xsl:attribute name="class">
<xsl:if test="xsl:*/@*">
<xsl:text>x</xsl:text>
</xsl:if>
<xsl:text>t</xsl:text>
</xsl:attribute>
<xsl:value-of select="name(.)"/>
</SPAN>
<SPAN class="m">="</SPAN>
<B>
<xsl:value-of select="."/>
</B>
<SPAN class="m">"</SPAN>
</xsl:template>
<xsl:template match="text()">
<DIV class="e">
<SPAN class="b"> </SPAN>
<SPAN class="tx">
<xsl:value-of select="."/>
</SPAN>
</DIV>
</xsl:template>
<xsl:template match="comment()">
<DIV class="k">
<SPAN>
<A STYLE="visibility:hidden" class="b" onclick="return false" onfocus="h()">-</A>
<SPAN class="m">
<xsl:call-template name="entity-ref">
<xsl:with-param name="name">lt</xsl:with-param>
</xsl:call-template>!--
</SPAN>
</SPAN>
<SPAN class="ci" id="clean">
<PRE>
<xsl:value-of select="."/>
</PRE>
</SPAN>
<SPAN class="b">
<xsl:call-template name="entity-ref">
<xsl:with-param name="name">nbsp</xsl:with-param>
</xsl:call-template>
</SPAN>
<SPAN class="m">
<xsl:text>--></xsl:text>
</SPAN>
<SCRIPT>f(clean);</SCRIPT>
</DIV>
</xsl:template>
<xsl:template match="*">
<DIV class="e">
<DIV STYLE="margin-left:1em;text-indent:-2em">
<SPAN class="b">
<xsl:call-template name="entity-ref">
<xsl:with-param name="name">nbsp</xsl:with-param>
</xsl:call-template>
</SPAN>
<SPAN class="m">
<xsl:call-template name="entity-ref">
<xsl:with-param name="name">lt</xsl:with-param>
</xsl:call-template>
</SPAN>
<SPAN>
<xsl:attribute name="class">
<xsl:if test="xsl:*">
<xsl:text>x</xsl:text>
</xsl:if>
<xsl:text>t</xsl:text>
</xsl:attribute>
<xsl:value-of select="name(.)"/>
<xsl:if test="@*">
<xsl:text> </xsl:text>
</xsl:if>
</SPAN>
<xsl:apply-templates select="@*"/>
<SPAN class="m">
<xsl:text>/></xsl:text>
</SPAN>
</DIV>
</DIV>
</xsl:template>
<xsl:template match="*[node()]">
<DIV class="e">
<DIV class="c">
<A class="b" href="#" onclick="return false" onfocus="h()">-</A>
<SPAN class="m">
<xsl:call-template name="entity-ref">
<xsl:with-param name="name">lt</xsl:with-param>
</xsl:call-template>
</SPAN>
<SPAN>
<xsl:attribute name="class">
<xsl:if test="xsl:*">
<xsl:text>x</xsl:text>
</xsl:if>
<xsl:text>t</xsl:text>
</xsl:attribute>
<xsl:value-of select="name(.)"/>
<xsl:if test="@*">
<xsl:text> </xsl:text>
</xsl:if>
</SPAN>
<xsl:apply-templates select="@*"/>
<SPAN class="m">
<xsl:text>></xsl:text>
</SPAN>
</DIV>
<DIV>
<xsl:apply-templates/>
<DIV>
<SPAN class="b">
<xsl:call-template name="entity-ref">
<xsl:with-param name="name">nbsp</xsl:with-param>
</xsl:call-template>
</SPAN>
<SPAN class="m">
<xsl:call-template name="entity-ref">
<xsl:with-param name="name">lt</xsl:with-param>
</xsl:call-template>?/
</SPAN>
<SPAN>
<xsl:attribute name="class">
<xsl:if test="xsl:*">
<xsl:text>x</xsl:text>
</xsl:if>
<xsl:text>t</xsl:text>
</xsl:attribute>
<xsl:value-of select="name(.)"/>
</SPAN>
<SPAN class="m">
<xsl:text>></xsl:text>
</SPAN>
</DIV>
</DIV>
</DIV>
</xsl:template>
<xsl:template match="*[text() and not (comment() or processing-instruction())]">
<DIV class="e">
<DIV STYLE="margin-left:1em;text-indent:-2em">
<SPAN class="b">
<xsl:call-template name="entity-ref">
<xsl:with-param name="name">nbsp</xsl:with-param>
</xsl:call-template>
</SPAN>
<SPAN class="m">
<xsl:call-template name="entity-ref">
<xsl:with-param name="name">lt</xsl:with-param>
</xsl:call-template>
</SPAN>
<SPAN>
<xsl:attribute name="class">
<xsl:if test="xsl:*">
<xsl:text>x</xsl:text>
</xsl:if>
<xsl:text>t</xsl:text>
</xsl:attribute>
<xsl:value-of select="name(.)"/>
<xsl:if test="@*">
<xsl:text> </xsl:text>
</xsl:if>
</SPAN>
<xsl:apply-templates select="@*"/>
<SPAN class="m">
<xsl:text>></xsl:text>
</SPAN>
<SPAN class="tx">
<xsl:value-of select="."/>
</SPAN>
<SPAN class="m">
<xsl:call-template name="entity-ref">
<xsl:with-param name="name">lt</xsl:with-param>
</xsl:call-template>/
</SPAN>
<SPAN>
<xsl:attribute name="class">
<xsl:if test="xsl:*">
<xsl:text>x</xsl:text>
</xsl:if>
<xsl:text>t</xsl:text>
</xsl:attribute>
<xsl:value-of select="name(.)"/>
</SPAN>
<SPAN class="m">
<xsl:text>></xsl:text>
</SPAN>
</DIV>
</DIV>
</xsl:template>
<xsl:template match="*[*]" priority="20">
<DIV class="e">
<DIV STYLE="margin-left:1em;text-indent:-2em" class="c">
<A class="b" href="#" onclick="return false" onfocus="h()">-</A>
<SPAN class="m">
<xsl:call-template name="entity-ref">
<xsl:with-param name="name">lt</xsl:with-param>
</xsl:call-template>
</SPAN>
<SPAN>
<xsl:attribute name="class">
<xsl:if test="xsl:*">
<xsl:text>x</xsl:text>
</xsl:if>
<xsl:text>t</xsl:text>
</xsl:attribute>
<xsl:value-of select="name(.)"/>
<xsl:if test="@*">
<xsl:text> </xsl:text>
</xsl:if>
</SPAN>
<xsl:apply-templates select="@*"/>
<SPAN class="m">
<xsl:text>></xsl:text>
</SPAN>
</DIV>
<DIV>
<xsl:apply-templates/>
<DIV>
<SPAN class="b">
<xsl:call-template name="entity-ref">
<xsl:with-param name="name">nbsp</xsl:with-param>
</xsl:call-template>
</SPAN>
<SPAN class="m">
<xsl:call-template name="entity-ref">
<xsl:with-param name="name">lt</xsl:with-param>
</xsl:call-template>/
</SPAN>
<SPAN>
<xsl:attribute name="class">
<xsl:if test="xsl:*">
<xsl:text>x</xsl:text>
</xsl:if>
<xsl:text>t</xsl:text>
</xsl:attribute>
<xsl:value-of select="name(.)"/>
</SPAN>
<SPAN class="m">
<xsl:text>></xsl:text>
</SPAN>
</DIV>
</DIV>
</DIV>
</xsl:template>
<xsl:template name="entity-ref">
<xsl:param name="name"/>
<xsl:text disable-output-escaping="yes">&</xsl:text>
<xsl:value-of select="$name"/>
<xsl:text>;</xsl:text>
</xsl:template>
</xsl:stylesheet>
La réponse est très simple. Nous devons juste utiliser la propriété DocumentText du contrôle WebBrowser comme ceci:
this.webBrowserControl.DocumentText = varWithXMLString;
Un détail que je n'ai pas trouvé dans la documentation du contrôle est que la chaîne doit répondre aux exigences suivantes:
- Ce doit être un document XML bien formé
- Le prologue XML doit être inclus:
<?xml version="1.0"?> - Il faut vérifier que la chaîne XML n'inclut pas le caractère BOM UTF-8 (raison pour laquelle j'ai effectué cette recherche). C’est quelque chose de difficile à détecter grâce aux conversions de chaînes C #, car elle génère un caractère non imprimable, qui n’est visible que lorsque la chaîne est convertie en octet ou en tableau int .
Dans le référentiel Github suivant, voici l'exemple que j'ai développé pour montrer ces validations: https://github.com/batressc/WinFormsWebBrowserXML
Dans le lien suivant, vous pouvez voir en détail le développement de l'exemple (en espagnol): http://batrianoworld.batressc.com/2018/07/22/visualizacion-de-xml-utilizando-control-webbrowser-de -windowsforms
var responseXml = "<ResponseXML> your xml string </ResponseXML>";
var path = Path.Combine(Path.GetTempPath(), "Response.xml");
var responseXmlDocument = new XmlDocument();
responseXmlDocument.LoadXml(responseXml);
responseXmlDocument.Save(path);
responseWebBrowser.Navigate(path);