在UIWebView中使用HTML和本地图像

我有一个UIWebView在我的应用程序，我想用来显示一个图像，将链接到另一个url。

我在用着

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

问题是，图像不加载（即无法find），即使它被添加为我的项目中的资源，并被复制到捆绑。

我已经尝试使用NSBundle来获取图像的完整path，并使用它，它仍然不会显示在Web视图中。

有任何想法吗？

Answer 1

使用相对path或文件：path来引用图像不适用于UIWebView。 相反，您必须使用正确的baseURL将HTML加载到视图中：

 NSString *path = [[NSBundle mainBundle] bundlePath]; NSURL *baseURL = [NSURL fileURLWithPath:path]; [webView loadHTMLString:htmlString baseURL:baseURL]; 

然后你可以像这样引用你的图片：

 <img src="myimage.png"> 

（从uiwebview重访 ）

Answer 2

用这个：

 [webView loadHTMLString:htmlString baseURL:[[NSBundle mainBundle] bundleURL]]; 

Answer 3

我也遇到了这个问题。 就我而言，我正在处理一些未本地化的图像以及其他多种语言的图像。 一个基本的URL没有得到我的本地化文件夹内的图像。 我通过下面的方法解决了这个问题：

 // make sure you have the image name and extension (for demo purposes, I'm using "myImage" and "png" for the file "myImage.png", which may or may not be localized) NSString *imageFileName = @"myImage"; NSString *imageFileExtension = @"png"; // load the path of the image in the main bundle (this gets the full local path to the image you need, including if it is localized and if you have a @2x version) NSString *imagePath = [[NSBundle mainBundle] pathForResource:imageFileName ofType:imageFileExtension]; // generate the html tag for the image (don't forget to use file:// for local paths) NSString *imgHTMLTag = [NSString stringWithFormat:@"<img src=\"file://%@\" />", imagePath]; 

然后，在加载内容时，在UIWebView HTML代码中使用imgHTMLTag。

我希望这能帮助遇到同样问题的人。

Answer 4

我有一个类似的问题，但所有的build议并没有帮助。

但是，问题是* .png本身。 它没有alpha通道 。 不知何故， Xcode在部署过程中忽略了没有alpha通道的所有png文件 。

Answer 5

您可以通过select将文件添加到“MyProj”并select创build文件夹引用来添加文件夹（比如说带有子文件夹css，img和js的WEB和文件test.html）到您的项目中。 现在下面的代码将关心所有引用的图像，CSS和JavaScript

 NSString *filePath = [[NSBundle mainBundle] pathForResource:@"WEB/test.html" ofType:nil]; [webView loadRequest:[NSURLRequest requestWithURL:[NSURL fileURLWithPath:filePath]]]; 

Answer 6

尝试使用base64图像string。

 NSData* data = UIImageJPEGRepresentation(image, 1.0f); NSString *strEncoded = [data base64Encoding]; <img src='data:image/png;base64,%@ '/>,strEncoded 

Answer 7

在阅读了iOS 6 Programming Cookbok中的几个章节并开始学习Objective-C和iOS编程之后，我只想补充一点，如果要从自定义包中加载资源并在Web视图中使用它，可以这样来完成：

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

然后，在您的html中，您可以使用“自定义”包作为您的基本path引用资源：

 body { background-image:url('img/myBg.png'); } 

Answer 8

在Swift 3：

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

这对我来说，即使当图像是在一个文件夹内没有任何修改。

Answer 9

如果您使用图像的相对链接，则图像将不会显示，因为在编译iOS应用程序后，所有文件夹结构都不会保留。 你可以做的是转换你的本地web 文件夹，而不是通过添加“ .bundle ”文件扩展名。

因此，如果您的本地网站包含在“ www ”文件夹中，则应将其重命名为“ http://www.bundle ”。 这允许保留图像文件夹和目录结构。 然后以“ baseURL ”（设置为www.bundle path）作为HTMLstring将“ index.html ”文件加载到WebView中，以启用加载相对图像链接。

 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]; } 

Answer 10

这些答案确实帮了我 – 特别是文件：\\ xxxxxxx.xxx，但我不得不做一个解决方法来显示图像。

在我的情况下，我有我的服务器上的HTML文件，我下载到文档目录。 我想在UIWebView中显示一个本地graphics，但是我无法工作。 以下是我所做的：

1. 将文件从NSBundle复制到本地文档目录
2. 将我的HTML文档中的文件引用为“file：\\ filename.png”

所以在启动时将文件复制到文档目录中：

 -(BOOL)copyBundleFilesToDocumentsDirectoryForFileName:(NSString *)fileNameToCopy OverwriteExisting:(BOOL)overwrite { //GET DOCUMENTS DIR //Search for standard documents using NSSearchPathForDirectoriesInDomains //First Param = Searching the documents directory //Second Param = Searching the Users directory and not the System //Expand any tildes and identify home directories. NSArray *paths = NSSearchPathForDirectoriesInDomains(NSDocumentDirectory, NSUserDomainMask, YES); NSString *documentsDir = [paths objectAtIndex:0]; //COPY FILE FROM NSBUNDLE File to Local Documents Dir NSString *writableFilePath = [documentsDir stringByAppendingPathComponent:fileNameToCopy]; NSFileManager *fileManager = [NSFileManager defaultManager]; NSError *fileError; DDLogVerbose(@"File Copy From Bundle to Documents Dir would go to this path: %@", writableFilePath); if ([fileManager fileExistsAtPath:writableFilePath]) { DDLogVerbose(@"File %@ already exists in Documents Dir", fileNameToCopy); if (overwrite) { [fileManager removeItemAtPath:writableFilePath error:nil]; DDLogVerbose(@"OLD File %@ was Deleted from Documents Dir Successfully", fileNameToCopy); } else { return (NO); } } NSArray *fileNameParts = [fileNameToCopy componentsSeparatedByString:@"."]; NSString *bundlePath = [[NSBundle mainBundle]pathForResource:[fileNameParts objectAtIndex:0] ofType:[fileNameParts objectAtIndex:1]]; BOOL success = [fileManager copyItemAtPath:bundlePath toPath:writableFilePath error:&fileError]; if (success) { DDLogVerbose(@"Copied %@ from Bundle to Documents Dir Successfully", fileNameToCopy); } else { DDLogError(@"File %@ could NOT be copied from bundle to Documents Dir due to error %@!!", fileNameToCopy, fileError); } return (success); } 

Answer 11

捷电迅捷版的回答：

 webView.loadHTMLString(htmlString, baseURL: NSBundle.mainBundle().bundleURL) 

Answer 12

亚当Alexanders目标C的迅捷版本答案：

 let logoImageURL = NSURL(fileURLWithPath: "\(Bundle.main.bundlePath)/PDF_HeaderImage.png") 

Answer 13

我的rss-feed（获取RSSItems）的复杂解决scheme（或教程）仅适用于设备：

 #define CACHE_DIR [NSSearchPathForDirectoriesInDomains(NSCachesDirectory, NSUserDomainMask, YES) lastObject] for (RSSItem *item in _dataSource) { url = [NSURL URLWithString:[item link]]; request = [NSMutableURLRequest requestWithURL:url]; [request setHTTPMethod:@"GET"]; [NSURLConnection sendAsynchronousRequest:request queue:queue completionHandler:^(NSURLResponse *response, NSData *data, NSError *error) { @autoreleasepool { if (!error) { NSString *html = [[NSString alloc] initWithData:data encoding:NSWindowsCP1251StringEncoding]; { NSError *error = nil; HTMLParser *parser = [[HTMLParser alloc] initWithString:html error:&error]; if (error) { NSLog(@"Error: %@", error); return; } HTMLNode *bodyNode = [parser body]; NSArray *spanNodes = [bodyNode findChildTags:@"div"]; for (HTMLNode *spanNode in spanNodes) { if ([[spanNode getAttributeNamed:@"class"] isEqualToString:@"page"]) { NSString *absStr = [[response URL] absoluteString]; for (RSSItem *anItem in _dataSource) if ([absStr isEqualToString:[anItem link]]){ NSArray *spanNodes = [bodyNode findChildTags:@"img"]; for (HTMLNode *spanNode in spanNodes){ NSString *imgUrl = [spanNode getAttributeNamed:@"src"]; if (imgUrl){ [anItem setImage:imgUrl]; break; } } [anItem setHtml:[spanNode rawContents]]; [self subProcessRSSItem:anItem]; } } } [parser release]; } if (error) { NSLog(@"Error: %@", error); return; } [[NSNotificationCenter defaultCenter] postNotificationName:notification_updateDatasource object:self userInfo:nil]; }else NSLog(@"Error",[error userInfo]); } }]; 

和

 - (void)subProcessRSSItem:(RSSItem*)item{ NSString *html = [item html]; if (html) { html = [html stringByReplacingOccurrencesOfString:@"<div class=\"clear\"></div>" withString:@""]; html = [html stringByReplacingOccurrencesOfString:@"<p class=\"link\">" withString:@""]; html = [html stringByReplacingOccurrencesOfString:@"<div class=\"page\">" withString:@""]; html = [html stringByReplacingOccurrencesOfString:@"</div>" withString:@""]; NSArray *array1 = [html componentsSeparatedByString:@"<a"]; if ([array1 count]==2) { NSArray *array2 = [html componentsSeparatedByString:@"a>"]; html = [[array1 objectAtIndex:0] stringByAppendingString:[array2 objectAtIndex:1]]; } NSURL *url; NSString *fileName; NSString *filePath; BOOL success; if ([item image]) { url = [NSURL URLWithString: [hostString stringByAppendingString:[item image]]]; NSData *imageData = [NSData dataWithContentsOfURL:url]; fileName = [[[url relativePath] componentsSeparatedByString:@"/"] lastObject]; filePath = [NSString stringWithFormat:@"%@/%@", CACHE_DIR, fileName]; //save image locally success = [[NSFileManager defaultManager] createFileAtPath:filePath contents:imageData attributes:nil]; //replace links html = [html stringByReplacingOccurrencesOfString:[item image] withString:filePath]; [item setImage:fileName]; //Передадим обновление интерфейса, снабдив индексом обновляемой ячейки [[NSNotificationCenter defaultCenter] postNotificationName:notification_updateRow object:self userInfo:[NSDictionary dictionaryWithObject:@([_dataSource indexOfObject:item]) forKey:@"row"]]; } //finalize html html = [NSString stringWithFormat:@"<html><body>%@</body></html>",html]; fileName = [[[item link] componentsSeparatedByString:@"/"] lastObject]; filePath = [NSString stringWithFormat:@"%@/%@", CACHE_DIR, fileName]; success = [[NSFileManager defaultManager] createFileAtPath:filePath contents:[html dataUsingEncoding:NSUTF8StringEncoding] attributes:nil]; [item setHtml: (success)?filePath:nil];//for direct download in other case } 

}

在视图控制器上

 - (void)viewDidAppear:(BOOL)animated{ RSSItem *item = [[DataSingleton sharedSingleton] selectedRSSItem]; NSString* htmlString = [NSString stringWithContentsOfFile:[item html] encoding:NSUTF8StringEncoding error:nil]; NSURL *baseURL = [NSURL URLWithString:CACHE_DIR]; [_webView loadHTMLString:htmlString baseURL:baseURL]; 

}

rss项目类

 #import <Foundation/Foundation.h> @interface RSSItem : NSObject @property(nonatomic,retain) NSString *title; @property(nonatomic,retain) NSString *link; @property(nonatomic,retain) NSString *guid; @property(nonatomic,retain) NSString *category; @property(nonatomic,retain) NSString *description; @property(nonatomic,retain) NSString *pubDate; @property(nonatomic,retain) NSString *html; @property(nonatomic,retain) NSString *image; @end 

任何与图像的HTML的一部分

 <html><body> <h2>blah-blahTC One Tab 7</h2> <p>blah-blah НТС One.</p> <p><img width="600" height="412" alt="" src="/Users/wins/Library/Application Support/iPhone Simulator/5.0/Applications/2EAD8889-6482-48D4-80A7-9CCFD567123B/Library/Caches/htc-one-tab-7-concept-1(1).jpg"><br><br> blah-blah (Hasan Kaymak) blah-blah HTC One Tab 7, blah-blah HTC One. <br><br> blah-blah microSD.<br><br> blah-blah Wi-Fi to 4G LTE.</p> </p> </body></html> 

保存为名称htc-one-tab-7-concept-1（1）.jpg的图像