So i'm having issues with stylesheets and images using a WebView.
Im using Xamarin.Forms (latest version)
Here is what i do:
I POST to an URL and download the response html
I add this to HtmlWebViewSource(), which i then add to a WebView
I then set my BaseUrl to the domain
Here is some code:
string raw_html = getHtml();
WebView browser = new WebView();
HtmlWebViewSource html = new HtmlWebViewSource {
Html = raw_html
};
html.BaseUrl = getBaseUrl(); // i have tried with many different urls here (to make sure the path is not the problem) however none seems to work
browser.Source = html;
What is not working?
The problem is that the webpage is loaded, however none of the stylesheets images etc. is loaded. So im stuck with HTML with no style or images. As the relative path is not working.
An example:
/images/image.png // in HTML
The browser dont know where this is pointing as the BaseUrl is not set, however when i set the BaseUrl it is still not working.
Related
I'm able to load a local HTML file into my WebView like this (this works fine):
var fileName = "Views/Default.html";
var localHtmlUrl = Path.Combine(NSBundle.MainBundle.BundlePath, fileName);
var url = new NSUrl(localHtmlUrl, false);
var request = new NSUrlRequest(url);
WebView.LoadRequest(request);
I'd like to reference a CSS file (also local) in my HTML file:
<link href="Content/style.css" rel="stylesheet">
The CSS file does exist inside of a Content folder, the build action is set to Content for said file.
How can I reference/load the CSS file in question via my html file? Possible?
UPDATE: Had css and html in separate folders. Put them both in a Content folder then updated the hrefs which solved the issue while using LoadRequest.
Check this link
https://developer.xamarin.com/recipes/ios/content_controls/web_view/load_local_content/
Section Additional information
Html generated in code can also be displayed, which is useful for customizing the content. To display an Html string, use the LoadHtmlString method instead of LoadRequest. Passing the path to the Content directory helps the web view resolve relative Urls in the Html, such as links, images, CSS, etc.
// assumes you've placed all your files in a Content folder inside your app
string contentDirectoryPath = Path.Combine (NSBundle.MainBundle.BundlePath, "Content/");
string html = "<html><a href='Home.html'>Click me</a></html>";
webView.LoadHtmlString(html, new NSUrl(contentDirectoryPath, true));
I'm trying to make a custom web page and put it in a webview in Xamarin using C#
What I have is a UIViewController containing a UIWebView.
In my project I have a folder like this:
Project
Content
index.html
js
css
But when I try to load the index.html file into the webview nothing happens.
I tried just loading an external webpage and it works fine.
this is my code for loading the content in the ViewDidLoad method of the UIViewController:
string fileName = "Content/index.html";
string localHtmlUrl = Path.Combine(NSBundle.MainBundle.BundlePath, fileName);
MyWebView.LoadRequest(new NSUrlRequest(new NSUrl(localHtmlUrl, false)));
MyWebView.ScalesPageToFit = true;
I think it has something to do with the page not finishing it's loading, but I can't figure out how to do this properly.
Derp, always make sure to set the 'Build Action' on your file to BundleResource on each file to include them in the build by right clicking on them...
I am using following web view in xaml.
<WebView x:Name="FBCommentsTest"></WebView>
And i am trying to embed HTML data to that web view in the following way in the c# end.
FBCommentsTest.NavigateToString("<html><head></head><body><div id=\"fb-root\"></div><div id=\"fb-root\"></div><script>(function(d, s, id) {var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) return;js = d.createElement(s); js.id = id;js.src = \"http://connect.facebook.net/en_US/all.js#xfbml=1&appId=" + APP_KEY + "\";fjs.parentNode.insertBefore(js, fjs);}(document, 'script', 'facebook-jssdk'));</script><div class=\"fb-comments\" data-href=\""
+ mExternalUrl + "\" data-width=\"500\"></div> </body></html>");
But, in the web view i am getting an empty screen not able to get the facebook comments view.
How to enable the script in web view in uwp.
Please help me.
Thanks.
But, in the web view i am getting an empty screen not able to get the facebook comments view. How to enable the script in web view in uwp.
The NavigateToStringmethod does not provide a way to generate or provide css, scripts, images, and fonts resources programmatically. You can refer to WebView.NavigateToString method.
You can transfer your string into HTML file, and use Navigate method to navigate to the HTML page. Just for example, create a HTMLPage file in the project and code for it, then in the c# code behind:
Uri uri = new Uri("ms-appx-web:///HTMLPage1.html");
FBCommentsTest.Navigate(uri);
I loaded a html local file in a WebBrowser control within a WinForm. In the html code, I defined some variables in %variables%.
My question is how to transfer/reference strings/data from WinForm to the %viarables% defined in the loaded html page, and refresh the loaded html page displayed on the WebBrowser.
Following is the code of loading a local html file from. Any suggestion will be appreciated.
By the way, it is a WinForm application, not asp.Net.
string curDir = Directory.GetCurrentDirectory();
this.webBrowser1.Url = new Uri(String.Format("file:///{0}/{1}", curDir + "\\Forms", fileName));
Instead of trying to replace your variables after loading the HTML, which could be problematic, why not read the source file, replace the variables, then load the updated document into the web browser control? This seems much more straightforward.
For example:
string dir = Path.Combine(Directory.GetCurrentDirectory(), "forms");
string html = File.ReadAllText(Path.Combine(dir, fileName));
foreach (string variable in GetListOfVariables())
{
html = html.Replace(variable, GetReplacementForVariable(variable));
}
webBrowser1.DocumentText = html;
Do you have control over contents of the HTML file? You could try InvokeScript method paired with a Javascript function prepared in the document beforehand.
If you don't control the contents, then you can inject javascript from your code. Here are some examples of doing that.
I have an IFrame loading multiple pages, after the page submits the C# Behind code uses Server.Transfer to move the IFrames view to my Success page.
When I check the src on the onload event it always shows the src path to the original page and not my success page.
This is how I check the src:
var arr = $('#IFrameDam').attr('src').split('.');
var src = arr[0].toString() + "." + arr[1].toString();
if (src == "GISuccess.aspx" || src == "GIFailed.aspx" || src == "GIConstruction.aspx") {
//do something
}
Edit
Using var action = $('#IFrameDam')[0].contentWindow.location;
Still does not get me GISuccess.aspx
src attribute of an iframe is a property that exists outside the page displayed in the iframe. Navigation inside the iframe does not change it. If the iframe and the parent page are on the same domain, you can establish javascript communication between them and obtain iframe.contentWindow.location.
Update:
About Server.Transfer. When a browser window is told to obtain content (e.g. html page) from a url, it contacts the server at that url to get the response content. For the browser, html that comes back corresponds to that url. When you use Server.Transfer, the html output from the page to which you transfer is the response content, regardless of what the actual (true) url of the latter page is. When Response.Redirect is used - it goes back to the browser telling it to obtain the content from the new url specified in Redirect.