Not allowed to load local resource: file:///var/mobile/Containers/Data/Application/03F63826-7849-47C3-A6DF-E1EB1113FF0A/Documents/xxx.png

Question

XCode 10.1
iOS 12.0.1

I use wkwebview's function "evaluateJavaScript" to callback the image url and let wkwebview can show this image.
It work in simulator sucessfully.
But it's fail in device.
What's wrong with this?

simulator url is nice work:

file:///Users/xxxxxx/Library/Developer/CoreSimulator/Devices/8FB6E110-F30F-425D-9011-A196E78BE7CB/data/Containers/Data/Application/E122A32D-7E21-4EBA-A9E7-BC15E8468A11/Documents/20190409150915.png

device url is fail:

Not allowed to load local resource: file:///var/mobile/Containers/Data/Application/03F63826-7849-47C3-A6DF-E1EB1113FF0A/Documents/20190408203417.png

NSArray *imagesArray = [[NSArray alloc] initWithArray:[[NSUserDefaults standardUserDefaults] objectForKey:@"pickerImages"]];
NSArray *paths = NSSearchPathForDirectoriesInDomains(NSDocumentDirectory, NSUserDomainMask, YES);
NSString *documentsDirectory = [paths objectAtIndex:0];    
NSString *filePath = [NSString stringWithFormat:@"file://%@/",documentsDirectory];
NSString *imagesString = pickerImagesArray.firstObject;
NSString *jscript = @"";

if ([imagesString isEqualToString:@""])
    {
        jscript = [NSString stringWithFormat:@"getimage_cb('%@')" ,  @""];
    } else {
        NSString  *output = [NSString stringWithFormat:@"%@%@",filePath,imagesString];
        jscript = [NSString stringWithFormat:@"%@", [NSString stringWithFormat:@"getimage_cb('%@')" ,  output]];
    }

    [self.myWkwebView evaluateJavaScript:jscript completionHandler:^(id object, NSError * _Nullable error) {
    }];

Will Jones Will Jones · Accepted Answer · 2019-04-09T10:20:25

There are conflicting answers on SO about this particular topic.

What I've read is that you can directly load an image from an application's bundle but not its documents directory.

One possible workaround is to load the image into a UIImage instance, convert it to base64 and pass that to the evaluateJavascript method:

    NSArray *imagesArray = [[NSArray alloc] initWithArray:[[NSUserDefaults standardUserDefaults] objectForKey:@"pickerImages"]];
    NSArray *paths = NSSearchPathForDirectoriesInDomains(NSDocumentDirectory, NSUserDomainMask, YES);
    NSString *documentsDirectory = [paths objectAtIndex:0];    
    NSString *imagesString = [pickerImagesArray firstObject];
    NSString *filePath = [NSString stringWithFormat:@"%@/%@", documentsDirectory, imagesString];

    //Init UIImage Instance
    UIImage *uiImageInstance = [[UIImage alloc] initWithContentsOfFile:filePath];

    //Get PNG Representation as NSData
    NSData *data = UIImagePNGRepresentation(uiImageInstance);

    //Convert to Base64
    NSString *base64Str = [data base64EncodedStringWithOptions:NSDataBase64Encoding64CharacterLineLength];

    //Construct the attribute value we'll pass in the javascript
    NSString *attribute = [NSString stringWithFormat: @"data:image/png;base64,%@", base64Str];

    //Set the image within the webview
    [self.myWkwebView evaluateJavascript: [NSString stringWithFormat: @"document.getElementById('img').setAttribute( 'src', %@);", attribute] completionHandler:^(id object, NSError * _Nullable error) {}];

Not allowed to load local resource: file:///var/mobile/Containers/Data/Application/03F63826-7849-47C3-A6DF-E1EB1113FF0A/Documents/xxx.png

1 Answers