2

I have an app with downloaded images to be displayed in local html. I am still using Objective-C because this app is 4 years old. When first launch the app, it will download the images and other dynamic content (which I check, it is in Documents/content/ directory).

I have this code to get the content location:

NSString *contentBasePath = [app.contentManager contentBasePath];

which I get:

/var/mobile/Containers/Data/Application/4AFD30E2-F4F7-405A-9FE9-1857EEC11CC7/Documents/content

Then I have a few html pages that will call the downloaded images dynamically:

<div class="box-round benefits-thumbnail" style="background-image:url('file://{{../contentBasePath}}/{{filename}}');"></div>

Which I check, {{../contentBasePath}} will get:

/var/mobile/Containers/Data/Application/4AFD30E2-F4F7-405A-9FE9-1857EEC11CC7/Documents/content

and {{filename}} will get

example.jpg

which is all correct.

All this works with uiwebview. However I need to use wkwebview, the image did not show up.

I tried:

<div class="box-round benefits-thumbnail" style="background-image:url('{{../contentBasePath}}/{{filename}}');"></div>

and it still not working.

I googled and read around and it seems like wkwebview do not allow absolute path. so I tried as per this suggest:

[_webConfig.preferences  setValue:@YES forKey:@"allowFileAccessFromFileURLs"];

and still not working.

How can I resolve this?

sooon
  • 4,718
  • 8
  • 63
  • 116
  • did you find any work around ?? I have a similar issue in swift , images come in simulator but not in real device. – iMinion Sep 09 '20 at 13:06

2 Answers2

1

Seems like this is a limitation of the WebKit. As a workaround, you can write the HTML contents into a file in the documents directory and load it using [webView loadFileURL:fileUrl allowingReadAccessToURL:dirUrl]

Link to docs: https://developer.apple.com/documentation/webkit/wkwebview/1414973-loadfileurl

Gurusharan S
  • 365
  • 1
  • 7
0

The files must be in the document directory.

I implemented the following to retrieve a document:

    let documentDirUrl = try! FileManager.default.url(for: .documentDirectory, in: .userDomainMask, appropriateFor: nil, create: false)
    let fileNameWithExtension = "IMG_0002.PNG"
    let indexFileUrl = documentDirUrl.appendingPathComponent(fileNameWithExtension)
    if FileManager.default.fileExists(atPath: indexFileUrl.path) {
        webView.loadFileURL(indexFileUrl, allowingReadAccessTo: documentDirUrl)
    }
Prakash
  • 812
  • 6
  • 16
  • I have the base url where image is stored in documents directory n I have HTML which has the image extension how can load it in WKWebview Can you help me https://stackoverflow.com/questions/63800637/ios-13-swift-5-wkwebview-display-image-from-documents-directory-into-local-htm – iMinion Sep 09 '20 at 13:01
  • @iMinion my solution is in objective c but i guess the method should be the same. in my case, i download everything from web, so i have to move all the downloaded content including images into temp folder everytime the page is loaded. but maybe swift will have some more elegant solution than this. hope this help one way or another. good luck. – sooon Sep 09 '20 at 23:32
  • @sooon did u had just one image to display at a time or couple of if u can tell how you managed that. – iMinion Sep 10 '20 at 03:53
  • it is basically a html product page, so multiple images, if i remember correctly, when we download the files, it will all go to Documents/content/ folder. then i just use for loop to copy the files in that folder one by one into temp folder, then my html load the image from the temp folder. – sooon Sep 10 '20 at 04:12
  • another point to note, it is temp folder, that means whenever the device is running low or require more memory, it will delete off your contents. so i have a download function called everytime user launch the app. not the most effective way of handling I know, but it get the jobs done. – sooon Sep 10 '20 at 04:14
  • by the way, my code is in objective c, so my code would be helpful for you. – sooon Sep 10 '20 at 04:16
  • @sooon I have this I get have this as HTML "\n

    \n


    \n     – iMinion Sep 10 '20 at 14:20