xcode编写 ios app调用javascript的 .js 代码

调用JavaScript的.js代码是一个常见且有效的策略，这可以使iOS开发者能够利用现有的JavaScript代码库、框架，或者简化某些类型的计算和处理过程。在Xcode中实现调用JavaScript的.js文件，主要依靠WebKit框架中的WKWebView组件和JavaScriptCore框架。这两种方式提供了不同层次的集成和互操作性，开发者可以选择最适合他们应用场景的方法。

使用WKWebView，开发者可以在应用内嵌入一个功能齐全的浏览器视图，这使得可以在一个沙盒的环境中运行JavaScript代码。与此同时，开发者可以通过message handlers和evaluateJavaScript方法实现原生代码和JavaScript代码间的交互。

JavaScriptCore框架则提供了一个更为直接与JavaScript环境交互的途径，不需要通过一个Web视图。开发者可以直接运行JavaScript代码，甚至绑定Native代码与JavaScript代码，从而使得二者可以直接通讯。

下面详细介绍如何在Xcode编写iOS应用来调用JavaScript的.js代码。

一、使用WKWebView调用JavaScript代码

在使用WKWebView时，首先需要导入WebKit框架，并在你的ViewController中创建一个WKWebView实例。

WKWebView的初始化和配置

import WebKit
class ViewController: UIViewController {
    var webView: WKWebView!
    override func viewDidLoad() {
        super.viewDidLoad()
        let webConfiguration = WKWebViewConfiguration()
        webView = WKWebView(frame: .zero, configuration: webConfiguration)
        webView.translatesAutoresizingMaskIntoConstrAInts = false
        view.addSubview(webView)
        // Setup constraints for webView, typically pinning to edges of the view.
        // ...
    }
}

加载JavaScript文件

接着，加载本地或远程的.js文件，一般将.js文件包含在项目中，然后使用本地URL加载到WKWebView。

if let url = Bundle.main.url(forResource: "example", withExtension: "js") {
    webView.loadFileURL(url, allowingReadAccessTo: url.deletingLastPathComponent())
}

调用JavaScript函数

为了从iOS代码中调用JavaScript函数，你可以使用WKWebView的evaluateJavaScript()方法。

webView.evaluateJavaScript("javascriptFunctionToRun()") { (result, error) in
    if let error = error {
        // Handle the error
        print(error.localizedDescription)
    } else {
        // Process the result
        print(result ?? "No result")
    }
}

二、JavaScriptCore的使用

JavaScriptCore是另一种在iOS应用中运行JavaScript代码的方式。它提供了与原生代码交互的接口。

创建JavaScript环境

import JavaScriptCore
class ViewController: UIViewController {
    var jsContext: JSContext!
    override func viewDidLoad() {
        super.viewDidLoad()
        jsContext = JSContext()
        // Handle JavaScript exceptions
        jsContext.exceptionHandler = { context, exception in
            print("JS Error: \(exception?.toString() ?? "unknown error")")
        }
    }
}

加载和执行JavaScript代码

if let jsSourcePath = Bundle.main.path(forResource: "example", ofType: "js") {
    do {
        let jsSourceContents = try String(contentsOfFile: jsSourcePath)
        jsContext.evaluateScript(jsSourceContents)
    } catch {
        print("Unable to load and execute javascript file: \(error)")
    }
}

调用JavaScript函数

if let jsFunction = jsContext.objectForKeyedSubscript("javascriptFunctionToRun") {
    if let result = jsFunction.call(withArguments: []) {
        // Process the result
        print(result.toString())
    }
}

三、Native与JavaScript交互

通过两种框架，开发者都能实现原生代码与JavaScript代码之间的互动。

WKWebView中的交互处理

在WKWebView中实现交互，你可以使用WKScriptMessageHandler来接收JavaScript发出的消息。

class ViewController: UIViewController, WKScriptMessageHandler {
    // ...
    func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) {
        if message.name == "callbackHandler" {
            print("JavaScript is sending a message \(message.body)")
        }
    }
    override func viewDidLoad() {
        super.viewDidLoad()
        let webConfiguration = WKWebViewConfiguration()
        webConfiguration.userContentController.add(self, name: "callbackHandler")
        // ...
    }
}

JavaScriptCore中的交互处理

javascriptCore框架中，可以将Swift函数转换为JavaScript函数，并将其注入到JSContext中。

jsContext["nativeFunction"] = { (args: [Any]) in
    // This Swift block is now a callable function in your JS environment
    // ...
    return "Result from Swift"
}

或者将JavaScript函数转换为Native的block来调用。

let jsFunction: @convention(block) (String) -> Void = { arg in
    print(arg)
}
jsContext.setObject(jsFunction, forKeyedSubscript: "jsFunction" as NSString)