Using HTML and Local Images Within UIWebView

2018-12-31 23:21发布

I have a UIWebView in my app which I want to use to display an image which will link to another url.

I'm using

<img src="image.jpg" /> to load the image.

The problem is that the image doesn't load (ie. it can't be found) even though it's added as a resource in my project and is copied into the bundle.

I've tried using NSBundle to get the full path of the image and using that and it still doesn't show up in the web view.

Any ideas?

13条回答
与君花间醉酒
2楼-- · 2019-01-01 00:13

After having read a couple of chapters in the iOS 6 Programming Cookbok and started to learn objective-c and iOS programming, I would just like to add, that if one is going to load resources from a custom bundle and use that in a web view, it can be accomplished like this:

NSString *resourcesBundlePath = [[NSBundle mainBundle] pathForResource:@"Resources" ofType:@"bundle"];
NSBundle *resourcesBundle = [NSBundle bundleWithPath:resourcesBundlePath];
[self.outletWebView loadHTMLString:[html description] baseURL:[resourcesBundle bundleURL]];

Then, in your html you can refer to a resource using the "custom" bundle as your base path:

body {
    background-image:url('img/myBg.png');
}
查看更多
永恒的永恒
3楼-- · 2019-01-01 00:13

If you use relative links to images then the images won't display as all folder structures are not preserved after the iOS app is compiled. What you can do is convert your local web folder into a bundle instead by adding the '.bundle' filename extension.

So if you local website is contained in a folder "www", this should be renamed to "www.bundle". This allows the image folders and directory structure to be preserved. Then load the 'index.html' file into the WebView as an HTML string with 'baseURL' (set to www.bundle path) to enable loading relative image links.

NSString *mainBundlePath = [[NSBundle mainBundle] resourcePath];
NSString *wwwBundlePath = [mainBundlePath stringByAppendingPathComponent:@"www.bundle"];
NSBundle *wwwBundle = [NSBundle bundleWithPath:wwwBundlePath];
if (wwwBundle != nil) {
    NSURL *baseURL = [NSURL fileURLWithPath:[wwwBundle bundlePath]];
    NSError *error = nil;
    NSString *page = [[NSBundle mainBundle] pathForResource:@"index.html" ofType:nil];
    NSString *pageSource = [NSString stringWithContentsOfFile:page encoding:NSUTF8StringEncoding error:&error];
    [self.webView loadHTMLString:pageSource baseURL:baseURL];
}
查看更多
忆尘夕之涩
4楼-- · 2019-01-01 00:14

I had a simmilar problem, but all the suggestions didn't help.

However, the problem was the *.png itself. It had no alpha channel. Somehow Xcode ignores all png files without alpha channel during the deploy process.

查看更多
宁负流年不负卿
5楼-- · 2019-01-01 00:15

Use this:

[webView loadHTMLString:htmlString baseURL:[[NSBundle mainBundle] bundleURL]];
查看更多
还给你的自由
6楼-- · 2019-01-01 00:19

try use base64 image string.

NSData* data = UIImageJPEGRepresentation(image, 1.0f);

NSString *strEncoded = [data base64Encoding];   

<img src='data:image/png;base64,%@ '/>,strEncoded
查看更多
牵手、夕阳
7楼-- · 2019-01-01 00:25

In Swift 3:

webView.loadHTMLString("<img src=\"myImg.jpg\">", baseURL: Bundle.main.bundleURL)

This worked for me even when the image was inside of a folder without any modifications.

查看更多
登录 后发表回答