iPhone Dev: UIWebView baseUrl to resources in Documents folder not App bundle

Question

Hi everyone,

Greetings! Can anyone please kindly assist me finding a way around the following:

• load an html into a UIWebView using loadHTMLString and include(using baseURL) the resources such as the CSS, image files from folders within user's Documents directory - and not from the MainBundle of the application.

I have seen tutorials on how to use baseURL to load within the application bundle/MainBundle which is straightforward but not with resources from the iPhone's Documents directories.

The structure of my documents folder is as follows:

dirX 
|---> file.xml 
|---> dirCSS 
      |---> style.css

I can retrieve the full path to the dir X(Users/......./dir X). However, when passing that path to the UIWebView's baseURL such that

[webView loadHTMLString:fileXMLString baseURL:pathToDirX]

... webView does not recognize the resources(eg style.css within dirCSS) as href'ed within the fileXMLString

<link href="dirCSS/style.css" rel="stylesheet" />

So currently my application can successfully load the html string but does not load the stylesheet as the link to the CSS within the html string are relative - eg. css/style.css

Any help is very much appreciated :)

Answer 1

To get the path to the document directory:

NSArray *paths = NSSearchPathForDirectoriesInDomains( NSDocumentDirectory, NSUserDomainMask ,YES );
NSString *documentsDirectory = [paths objectAtIndex:0];
NSString *path = [documentsDirectory stringByAppendingPathComponent:@"index.xml"];
[webView loadRequest:[NSURLRequest requestWithURL:[NSURL fileURLWithPath:path]]]

The easiest way to have everything working, is to simply load your index.html from the document directory instead of loading a string. Otherwise set the baseUrl to the document directory.

Answer 2

After some googling I have finally found a fitting solution for the question I posed. Hopefully this would help those who face the same problem.

The trick is with the formatting of the string path when creating an NSURL object for baseURL of a UIWebView. Although usually I use the typical "Users/...../dir/file" in most cases, loading using UIWebView's loadHTMLString:baseURL needs a different approach.

As described in http://dblog.com.au/iphone-development/loading-local-files-into-uiwebview/, where I got the solution, string path to the resources just needs to have slashes to be replaced with double-slashes and spaces with %20:

NSString *imagePath = [[NSBundle mainBundle] resourcePath];
imagePath = [imagePath stringByReplacingOccurrencesOfString:@"/" withString:@"//"];
imagePath = [imagePath stringByReplacingOccurrencesOfString:@" " withString:@"%20"];

NSString *HTMLData = @"
<h1>Hello this is a test</h1>
<img src="sample.jpg" alt="" width="100" height="100" />";
[webView loadHTMLString:HTMLData baseURL:
           [NSURL URLWithString: 
           [NSString stringWithFormat:@"file:/%@//",imagePath]
           ]];

Do take note of the replacing of the strings and also the:

[NSString stringWithFormat:@"file:/%@//",imagePath]

Although the example code above is retrieving the path to the mainBundle of the application, it can also work in other folders, ie Documents(and its subfolders) as I did in mine.

Kind regards, oonoo

PS Thanks again Nic for the reply :)