在UIWebView中使用HTML和本地图像

时间:2009-04-14 12:53:24

标签: html ios iphone uiwebview uikit

我的应用程序中有一个UIWebView,我想用它来显示一个链接到另一个URL的图像。

我正在使用

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

问题是图像没有加载(即无法找到),即使它已作为资源添加到我的项目中并被复制到包中。

我已尝试使用NSBundle获取图像的完整路径并使用它,但它仍未显示在Web视图中。

有什么想法吗?

13 个答案:

答案 0 :(得分:288)

使用相对路径或文件:引用图像的路径不适用于UIWebView。相反,您必须使用正确的baseURL将HTML加载到视图中:

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

然后您可以像这样参考您的图片:

<img src="myimage.png">

(来自uiwebview revisited

答案 1 :(得分:46)

使用此:

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

答案 2 :(得分:24)

我也遇到了这个问题。在我的情况下,我正在处理一些未本地化的图像和其他用于多种语言的图像。基本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。

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

答案 3 :(得分:6)

我有一个类似的问题,但所有建议都没有帮助。

然而,问题是* .png本身。 没有Alpha频道。不知何故 Xcode在部署过程中忽略所有没有alpha通道的png文件

答案 4 :(得分:5)

尝试使用base64图像字符串。

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

NSString *strEncoded = [data base64Encoding];   

<img src='data:image/png;base64,%@ '/>,strEncoded

答案 5 :(得分:3)

您可以选择 将文件添加到&#34; MyProj&#34; ,将文件夹(例如带有子文件夹css,img和js以及文件test.html的WEB)添加到项目中并选择 创建文件夹参考 。现在,以下代码将关注所有引用的图像,css和javascript

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

答案 6 :(得分:3)

在Swift 3中:

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

即使图像在没有任何修改的文件夹内,这对我也有用。

答案 7 :(得分:2)

在iOS 6 Programming Cookbok中阅读了几章后,开始学习objective-c和iOS编程,我想补充说,如果要从自定义加载资源 bundle并在Web视图中使用它,它可以这样完成:

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

然后,在您的html中,您可以使用“自定义”包作为基本路径来引用资源:

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

答案 8 :(得分:1)

亚当亚历山大的快速版本目标C回答:

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

答案 9 :(得分:0)

如果使用图像的相对链接,则图像不会显示,因为编译iOS应用程序后不会保留所有文件夹结构。您可以做的是将本地网站文件夹转换为,而不是添加&#39; .bundle &#39;文件扩展名。

因此,如果您的本地网站包含在文件夹&#34; www &#34;中,则应将其重命名为&#34; www.bundle & #34 ;.这允许保留图像文件夹和目录结构。然后加载&#39; index.html &#39;使用&#39; baseURL &#39;将文件作为HTML字符串存入WebView (设置为www.bundle路径)以启用加载相对图像链接。

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

答案 10 :(得分:0)

这些答案对我有帮助 - 特别是文件:\\ xxxxxxx.xxx,但我必须做一个解决方法来显示图像。

就我而言,我的服务器上有一个HTML文件,我将其下载到文档目录。我想用UIWebView中的本地图形显示它,我无法工作。这就是我的所作所为:

  1. 将文件从NSBundle复制到本地文档目录
  2. 将我的HTML文档中的文件引用为&#34;文件:\\ filename.png&#34;
  3. 因此在启动时将文件复制到文档目录:

    -(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);
    }
    

答案 11 :(得分:0)

迅捷版的Lithu T.V回答:

Navigation Bar

答案 12 :(得分:-7)

我的rss-feed(get in RSSItems)的复杂解决方案(或教程)仅适用于设备:

#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 item class

#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