Search code examples
javascriptiphoneioscsshybrid-mobile-app

How to make a wrapper for HTML, CSS and Javascript Pages in iOS


I am building an application in which, I want to display a locally stored web page(HTML+CSS+JS). I tried many ways but the page is not responding to the java script. Here are the part of the code which I tried

TRY: 1

//html
NSString *actualPageMarkupFilePath = [[NSBundle mainBundle] pathForResource:@"inex" ofType:@"html"];
NSData *actualPageMarkupData = [NSData dataWithContentsOfFile:actualPageMarkupFilePath];
NSString *actualPageMarkup = [[NSString alloc]initWithData:actualPageMarkupData encoding:NSASCIIStringEncoding];

// load css styles
NSString *cssPath   = [[NSBundle mainBundle] pathForResource:@"style" ofType:@"css"];
NSData *cssData     = [NSData dataWithContentsOfFile:cssPath];
NSString *cssString = [[NSString alloc] initWithData:cssData encoding:NSASCIIStringEncoding];

// load js
NSString *jsPath1   = [[NSBundle mainBundle] pathForResource:@"myzepto" ofType:@"js"];
NSData *jsData1     = [NSData dataWithContentsOfFile:jsPath1];
NSString *jsString1 = [[NSString alloc] initWithData:jsData1 encoding:NSASCIIStringEncoding];

NSString *jsPath2   = [[NSBundle mainBundle] pathForResource:@"zepto.min" ofType:@"js"];
NSData *jsData2     = [NSData dataWithContentsOfFile:jsPath2];
NSString *jsString2 = [[NSString alloc] initWithData:jsData2 encoding:NSASCIIStringEncoding];

// compose full html page
NSString *pageContent = [NSString stringWithFormat:@"%@%@%@%@", cssString, jsString1, jsString2, actualPageMarkup];
[self.HTMLWebView loadHTMLString:pageContent baseURL:[NSURL URLWithString:@""]];

TRY: 2

NSString *filePath =
[[NSBundle mainBundle] pathForResource:@"inex" ofType:@"html"];
NSData *htmlData = [NSData dataWithContentsOfFile:filePath];

if (htmlData) {
    NSBundle *bundle = [NSBundle mainBundle];
    NSString *path = [bundle bundlePath];
    NSString *fullPath = [NSBundle pathForResource:@"inex"
                                            ofType:@"html" inDirectory:path];
    [_HTMLWebView loadRequest:[NSURLRequest requestWithURL:
                          [NSURL fileURLWithPath:fullPath]]];
}

TRY: 3

NSString *htmlFile = [[NSBundle mainBundle] pathForResource:@"inex" ofType:@"html"];
NSData *htmlData = [NSData dataWithContentsOfFile:htmlFile];
[_HTMLWebView loadData:htmlData MIMEType:@"text/html" textEncodingName:@"UTF-8" baseURL:[NSURL fileURLWithPath:[[NSBundle mainBundle] resourcePath]]];

TRY: 4

NSURL *urlPageFile = [[NSBundle mainBundle] URLForResource:@"inex" withExtension:@"html"];
NSURLRequest *webPageRequest = [[NSURLRequest alloc] initWithURL:urlPageFile];
[_HTMLWebView loadRequest:webPageRequest];
[webPageRequest release];

Solution

  • Your should copy directory with html, css, etc to project with options
    "Copy items into destination group's folder (if needed)"
    "Create folder references for any added folders" enter image description here

    And load page into webview with this code:

    NSString* path = [[NSBundle mainBundle] pathForResource:@"index.html"
                                                     ofType:nil
                                                inDirectory:@"MyWebSite"];
    
    NSURLRequest *request = [NSURLRequest requestWithURL:[NSURL fileURLWithPath:path]];
    [_webView loadRequest:request];