Adding Javascript to WKWebView

Question

Hi I know this seems like a super simple question, but I want to add this JS to my WebView:

<script type='text/javascript' src='https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.2/MathJax.js?config=default&#038;ver=1.3.8'></script>

Now obviously I know this is HTML, but I am not sure what to put into 'evaluateJavaScript' in order to use the JS source. Sorry if this isn't very clear - I'm new to both Swift and JS. Thanks!

My swift code:

func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!) {
    self.webView.evaluateJavaScript("<script type='text/javascript' src='https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.2/MathJax.js?config=default&#038;ver=1.3.8'></script>") { (nil, error) in
        print(error)
    }
}

Its too late - but you are using "evaluateJavascript" so you don't need explicit "<script></script>" - it will work without it — Saurabh Prajapati
– Saurabh Prajapati, Commented Mar 25, 2022 at 16:11

Bannings · Accepted Answer · 2018-05-06 13:40:52Z

19

Use built-in API WKUserScript inject JS:

let script =    """
                var script = document.createElement('script');
                script.src = 'https://cdnjs.cloudflare.com/ajax/libs/mathjax/2.7.2/MathJax.js?config=default&#038;ver=1.3.8';
                script.type = 'text/javascript';
                document.getElementsByTagName('head')[0].appendChild(script);
                """
let userScript = WKUserScript(source: script, injectionTime: .atDocumentStart, forMainFrameOnly: true)

let contentController = WKUserContentController()
contentController.addUserScript(userScript)

let webViewConfiguration = WKWebViewConfiguration()
webViewConfiguration.userContentController = contentController

let webView = WKWebView(frame: CGRect.zero, configuration: webViewConfiguration)

forMainFrameOnly: A Boolean value indicating whether the script should be injected only into the main frame or into all frames(including iframe).

answered May 6, 2018 at 13:40

Bannings

10.5k7 gold badges46 silver badges54 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Rahul Basi Over a year ago

This answer works well, however would I be able to do this with a WKWebview created using IB? Thank you for your help

Bannings Over a year ago

@RahulBasi It is not possible to set the configuration of the WKWebView through the outlet of WKWebView form the storyboard because the configuration property of the WKWebView is read only. However, if you really want to create WKWebView through xib or storyboard, you have to make a subclass of WKWebView, then instead of calling super initWithCoder, you'll need to use a different init method, such as initWithFrame:configuration:.

Darshan Mothreja Over a year ago

running your code without any changes gives me error like "libMobileGestalt MobileGestalt.c:890: MGIsDeviceOneOfType is not supported on this platform"

Steven Fisher Over a year ago

While the configuration property is read only, the attached WKWebViewConfiguration is mutable. Example: [self.webView.configuration.userContentController addUserScript:userScript];

Collectives™ on Stack Overflow

Adding Javascript to WKWebView

1 Answer 1

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related