Skip to content

Commit

Permalink
feat(wkwebview): create api to allow clients to present a client cred…
Browse files Browse the repository at this point in the history
…ential for authentication (react-native-webview#141)

* In order for TLS Mutual Auth to work for webviews, the caller must present a credential. Expose a setter that can be called to set a credential.
  • Loading branch information
jsonblob authored and Titozzz committed Feb 12, 2019
1 parent f0e3633 commit fc5fd24
Show file tree
Hide file tree
Showing 3 changed files with 31 additions and 0 deletions.
10 changes: 10 additions & 0 deletions docs/Custom-iOS.md
Original file line number Diff line number Diff line change
Expand Up @@ -132,6 +132,16 @@ Once these are exposed, you can reference them in your custom web view class.
}
```

### Setting Client Certificate Authentication Credential

If you open webpages that needs a Client Certificate for Authentication, you can create a credential and pass it to the webview:

```
[RNCWKWebView setClientAuthenticationCredential:credential];
```

This can be paired with a call from Javascript to pass a string label for the certificate stored in keychain and use native calls to fetch the certificate to create a credential object. This call can be made anywhere that makes sense for your application (e.g. as part of the user authentication stack). The only requirement is to make this call before displaying any webviews.

## JavaScript Interface

To use your custom web view, you'll need to create a class for it. Your class must:
Expand Down
1 change: 1 addition & 0 deletions ios/RNCWKWebView.h
Original file line number Diff line number Diff line change
Expand Up @@ -44,6 +44,7 @@
@property (nonatomic, assign) BOOL cacheEnabled;
@property (nonatomic, assign) BOOL allowsLinkPreview;

+ (void)setClientAuthenticationCredential:(nullable NSURLCredential*)credential;
- (void)postMessage:(NSString *)message;
- (void)injectJavaScript:(NSString *)script;
- (void)goForward;
Expand Down
20 changes: 20 additions & 0 deletions ios/RNCWKWebView.m
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@

static NSTimer *keyboardTimer;
static NSString *const MessageHandlerName = @"ReactNativeWebView";
static NSURLCredential* clientAuthenticationCredential;

// runtime trick to remove WKWebView keyboard default toolbar
// see: http://stackoverflow.com/questions/19033292/ios-7-uiwebview-keyboard-issue/19042279#19042279
Expand Down Expand Up @@ -386,6 +387,25 @@ - (void)layoutSubviews
return [[NSMutableDictionary alloc] initWithDictionary: event];
}

+ (void)setClientAuthenticationCredential:(nullable NSURLCredential*)credential {
clientAuthenticationCredential = credential;
}

- (void) webView:(WKWebView *)webView
didReceiveAuthenticationChallenge:(NSURLAuthenticationChallenge *)challenge
completionHandler:(void (^)(NSURLSessionAuthChallengeDisposition disposition, NSURLCredential * _Nullable))completionHandler
{
if (!clientAuthenticationCredential) {
completionHandler(NSURLSessionAuthChallengePerformDefaultHandling, nil);
return;
}
if ([[challenge protectionSpace] authenticationMethod] == NSURLAuthenticationMethodClientCertificate) {
completionHandler(NSURLSessionAuthChallengeUseCredential, clientAuthenticationCredential);
} else {
completionHandler(NSURLSessionAuthChallengePerformDefaultHandling, nil);
}
}

#pragma mark - WKNavigationDelegate methods

/**
Expand Down

0 comments on commit fc5fd24

Please sign in to comment.