CODEWITHSUNDEEP
cordovahybrid-mobile-app
Alex Freeman
Alex Freeman

Reputation: 263

UIWebView on iOS 10 beta: not loading any svg images

We are developing a cordova ios application and we recently installed xcode 8-beta to see how our app would run under ios 10. So far we've noticed only one issue: svg images are not loading. These images are set as background using css for various elements, and they all work fine under 9.3.2 and below.

Upvotes: 3

Views: 1480

Answers (2)

jk.
jk.

Reputation: 14435

In case this help anyone else not looking to modify the URLProtocol code, I just replaced my img tags with object tags:

<img src="img/logo.svg" alt="Logo" width="280" class="logo">

<object type="image/svg+xml" data="img/logo.svg" width="280" class="logo">Logo</object>

I understand this might not work for every case but it did the trick for me.

Upvotes: 1

Joss
Joss

Reputation: 511

If your cordova app uses a plugin that implements URLProtocol, such as the phonegap contentsync plugin, you could be seeing a bug with the SVG's response header's MIME Type.

Prior to iOS 10, the MIME Type was being set automatically, possibly as a feature of the API (yet to confirm), but that no longer seems to be the case. You can work around the problem by explicitly setting the MIME Type (Content-Type) of the response during [URLProtocol startloading]:

(Adapted from phonegap contentsync and this MIME Check) 

- (void)startLoading {
    NSData *data = [NSData dataWithContentsOfFile:self.request.URL.path];

    NSString *fileExtension = self.request.URL.pathExtension;
    NSString *UTI = (__bridge_transfer NSString *)UTTypeCreatePreferredIdentifierForTag(kUTTagClassFilenameExtension, (__bridge CFStringRef)fileExtension, NULL);
    NSString *contentType = (__bridge_transfer NSString *)UTTypeCopyPreferredTagWithClass((__bridge CFStringRef)UTI, kUTTagClassMIMEType);

    // add the MIME Type to the existing header.
    NSMutableDictionary *headers = [NSMutableDictionary dictionaryWithDictionary:self.request.allHTTPHeaderFields];
    headers[@"Content-Type"] = contentType;

    // create a response using the request and our new HEADERs
    NSHTTPURLResponse *response = [[NSHTTPURLResponse alloc] initWithURL:self.request.URL
                                                              statusCode:200
                                                             HTTPVersion:@"1.1"
                                                            headerFields:headers];

    [self.client URLProtocol:self didReceiveResponse:response
          cacheStoragePolicy:NSURLCacheStorageAllowedInMemoryOnly];
    [self.client URLProtocol:self didLoadData:data];
    [self.client URLProtocolDidFinishLoading:self];
}

Upvotes: 3

Related Questions