在 uiwebview 中使用本地 html 从相对路径加载资源

Posted

技术标签:

【中文标题】在 uiwebview 中使用本地 html 从相对路径加载资源【英文标题】:Load resources from relative path using local html in uiwebview 【发布时间】:2011-09-19 05:45:25 【问题描述】:

我有一个非常简单的 ios 应用程序,带有一个加载一个非常简单的测试页面 (test.html) 的 uiwebview:

<html>
<body>
<img src="img/myimage.png" />
</body>
</html>

我将此 test.html 文件加载到我的网络视图中:

NSURL *url = [[NSBundle mainBundle] URLForResource:@"test" withExtension:@"html"];
NSString *html = [NSString stringWithContentsOfURL:url encoding:NSUTF8StringEncoding error:nil];
NSURL *baseUrl = [NSURL fileURLWithPath:[[NSBundle mainBundle] bundlePath]];
[webView loadHTMLString:html baseURL:baseUrl];

如果我在没有相对路径的情况下引用图像并将引用的图像放在根路径下 Targets -> Copy Bundle Resources 在 XCode 下,这工作正常,但是我无法使用相对路径,如图所示我的 html 文件。必须有办法做到这一点,我有很多图像、css、javascript 文件要加载到 web 视图中,我不想将所有内容都放在根目录中,并且必须更改我的 web 中的所有引用应用程序。

【问题讨论】:

【参考方案1】:

这是加载/使用具有相对引用的本地 html 的方法。

    将资源拖到您的 xcode 项目中(我从 finder 窗口拖了一个名为 www 的文件夹),您将获得两个选项“为任何添加的文件夹创建组”和“为任何添加的文件夹创建文件夹引用”。 选择“创建文件夹引用..”选项。

    使用下面给出的代码。它应该像魅力一样发挥作用。

    NSURL *url = [NSURL fileURLWithPath:[[NSBundle mainBundle] pathForResource:@"index" ofType:@"html" inDirectory:@"www"]]; [webview loadRequest:[NSURLRequest requestWithURL:url]];

现在您在 html 中的所有相关链接(如 img/.gif、js/.js)都应该得到解析。

斯威夫特 3

    if let path = Bundle.main.path(forResource: "dados", ofType: "html", inDirectory: "root") 
        webView.load( URLRequest(url: URL(fileURLWithPath: path)) )
    

【讨论】:

超级和最高投票!谁能解释为什么“创建文件夹引用而不是“为任何添加的文件夹创建组”? 附带说明,如果您尝试加载 javascript 文件而不是图像,您还需要查看此内容:***.com/a/3629479/385619 如果目录是 n 个文件夹怎么办?可以为目录 arg 传递一个类似 @"www/app" 的字符串吗? 如果我们从 Documents 而不是 Bundle 中加载 html 会怎样? @Sean XCode 默认将所有添加的文件存储在根文件夹中,组仅用于使您的项目树看起来不错。文件夹引用实际上是按原样复制内容,保留目录结构。如果您希望您的相对路径在设备上的工作方式与在办公室机器上的工作方式相同,那么这一点非常重要。【参考方案2】:

在 Swift 中:

 func pathForResource(  name: String?, 
                        ofType ext: String?, 
                        inDirectory subpath: String?) -> String?  

  // **name:** Name of Hmtl
  // **ofType ext:** extension for type of file. In this case "html"
  // **inDirectory subpath:** the folder where are the file. 
  //    In this case the file is in root folder

    let path = NSBundle.mainBundle().pathForResource(             "dados",
                                                     ofType:      "html", 
                                                     inDirectory: "root")
    var requestURL = NSURL(string:path!)
    var request = NSURLRequest(URL:requestURL)

    webView.loadRequest(request)

【讨论】:

感谢 Swift 代码。与接受的答案一起工作得很好 欢迎您! :.) @Bala Vishnu 效果很好,不过我不得不解开requestURL【参考方案3】:

我把所有东西都塞进一行(我知道很糟糕)并且没有遇到任何问题:

[webView loadRequest:[NSURLRequest requestWithURL:[NSURL fileURLWithPath:[[NSBundle mainBundle] pathForResource:@"test" 
                                                                                                         ofType:@"html"]
                                                             isDirectory:NO]]];         

【讨论】:

在 XCode 项目中,您的图像在目标节点下是使用“相对于项目”还是“相对于封闭组”?我使用的是相对于项目,因为在获取信息对话框中,当我选择相对于项目时它显示的路径看起来正确。但是,当我选择相对于封闭组时,它似乎可以正确加载图像。现在我刚刚开始让我的整个页面与 javascript 和 css 一起正常工作,谢谢! 呃!这个 uiwebview 太脆弱了,我开始慢慢地向我的测试页面添加更复杂的测试(即在 img 标签中使用 css 而不是 inline 设置图像)并且它不起作用,所以我恢复到原来的样子,它没有又不行了!也许我正在处理我的 uiwebview 中的某种缓存?【参考方案4】:

我只是这样做:

    UIWebView *webView = [[[UIWebView alloc] init] autorelease];

    NSURL *url = [[NSBundle mainBundle] URLForResource:@"index" withExtension:@"html"];
    NSURLRequest* request = [NSURLRequest requestWithURL:url];
    [webView loadRequest:request];

其中“index.html”相对引用图片、CSS、javascript等

【讨论】:

【参考方案5】:

快速回答 2。

UIWebView Class Reference 建议不要使用 webView.loadRequest(request):

不要使用该方法加载本地 HTML 文件;相反,使用 loadHTMLString:baseURL:.

在此解决方案中,将 html 读入字符串。 html 的 url 用于计算路径,并将其作为基本 url 传递。

let url = bundle.URLForResource("index", withExtension: "html", subdirectory: "htmlFileFolder")
let html = try String(contentsOfURL: url)
let base = url.URLByDeletingLastPathComponent
webView.loadHTMLString(html, baseURL: base)

【讨论】:

如果是这种情况,最好参考手册中的建议并插入该页面的摘录 - 目前似乎非常没有上下文。 Apple 的评论在 loadRequest 的 Instance Method 页面上:【参考方案6】:

我已经回去测试并重新测试了这个,看来这是我让它工作的唯一方法(因为我在 img 文件夹中有一些文件,而在 js/css 中有一些文件,等等......)不是在 html 中使用我的图像的相对路径,而是将所有内容都引用到 bundle 文件夹。真可惜:(。

<img src="myimage.png" />

【讨论】:

【参考方案7】:

@sdbrain 在 Swift 3 中的回答:

    let url = URL.init(fileURLWithPath: Bundle.main.path(forResource: "index", ofType: "html", inDirectory: "www")!)
    webView.loadRequest(NSURLRequest.init(url: url) as URLRequest)

【讨论】:

【参考方案8】:

在 Swift 3.01 中使用 WKWebView:

let localURL = URL.init(fileURLWithPath: Bundle.main.path(forResource: "index", ofType: "html", inDirectory: "CWP")!)
myWebView.load(NSURLRequest.init(url: localURL) as URLRequest)

这会针对 3.01 中的一些更精细的语法更改进行调整,并保持目录结构不变,以便您可以嵌入相关的 HTML 文件。

【讨论】:

自 3.x 以来,关键基础类型的 NS 前缀不是被删除了吗?这对我有用,谢谢! let localURL = URL.init(fileURLWithPath: Bundle.main.path(forResource: "index", ofType: "html", inDirectory: "mapa_procesos")!) webView.loadRequest(URLRequest(url: localURL))

以上是关于在 uiwebview 中使用本地 html 从相对路径加载资源的主要内容,如果未能解决你的问题,请参考以下文章

从 uiwebview (iOs) 打印本地 html 文件

monotouch uiwebview 找不到本地 html

在 UIWebView 中使用本地 CSS 文件

UIWebView加载本地html文件

UIWebView 中的本地 html,带有来自资产目录的图像

UIWebView 无法正确读取一些本地 HTML5 内容