{"id":1370,"date":"2021-01-06T19:17:55","date_gmt":"2021-01-06T11:17:55","guid":{"rendered":"http:\/\/123.57.164.21\/?p=1370"},"modified":"2021-01-06T19:17:55","modified_gmt":"2021-01-06T11:17:55","slug":"swiftui-wkwebview%e4%bd%bf%e7%94%a8js%e4%b8%8eswift%e4%ba%a4%e4%ba%92","status":"publish","type":"post","link":"https:\/\/92it.top\/?p=1370","title":{"rendered":"SwiftUI WKWebView\u4f7f\u7528JS\u4e0eSwift\u4ea4\u4e92"},"content":{"rendered":"\n
import UIKit\nimport SwiftUI\nimport WebKit\n\n\nclass SceneDelegate: UIResponder, UIWindowSceneDelegate, WKScriptMessageHandler {\n    \n    func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) {\n        print(message.body)\n    }\n    \n\n    var window: UIWindow?\n\n\n    func scene(_ scene: UIScene, willConnectTo session: UISceneSession, options connectionOptions: UIScene.ConnectionOptions) {\n        \/\/ Use this method to optionally configure and attach the UIWindow `window` to the provided UIWindowScene `scene`.\n        \/\/ If using a storyboard, the `window` property will automatically be initialized and attached to the scene.\n        \/\/ This delegate does not imply the connecting scene or session are new (see `application:configurationForConnectingSceneSession` instead).\n        \n        let preferences = WKPreferences()\n            preferences.javaScriptEnabled = true\n            configuration = WKWebViewConfiguration()\n            configuration.preferences = preferences\n            configuration.userContentController = WKUserContentController()\n            \/\/ \u7ed9webview\u4e0eswift\u4ea4\u4e92\u8d77\u4e00\u4e2a\u540d\u5b57\uff1aAppModel\uff0cwebview\u7ed9swift\u53d1\u6d88\u606f\u7684\u65f6\u5019\u4f1a\u7528\u5230\n            configuration.userContentController.add(self, name: \"AppModel\")\n\n        \/\/ Create the SwiftUI view that provides the window contents.\n        let contentView = ContentView()\n\n        \/\/ Use a UIHostingController as window root view controller.\n        if let windowScene = scene as? UIWindowScene {\n            let window = UIWindow(windowScene: windowScene)\n            window.rootViewController = UIHostingController(rootView: contentView)\n            self.window = window\n            window.makeKeyAndVisible()\n        }\n    }\n\n    func sceneDidDisconnect(_ scene: UIScene) {\n        \/\/ Called as the scene is being released by the system.\n        \/\/ This occurs shortly after the scene enters the background, or when its session is discarded.\n        \/\/ Release any resources associated with this scene that can be re-created the next time the scene connects.\n        \/\/ The scene may re-connect later, as its session was not necessarily discarded (see `application:didDiscardSceneSessions` instead).\n    }\n\n    func sceneDidBecomeActive(_ scene: UIScene) {\n        \/\/ Called when the scene has moved from an inactive state to an active state.\n        \/\/ Use this method to restart any tasks that were paused (or not yet started) when the scene was inactive.\n    }\n\n    func sceneWillResignActive(_ scene: UIScene) {\n        \/\/ Called when the scene will move from an active state to an inactive state.\n        \/\/ This may occur due to temporary interruptions (ex. an incoming phone call).\n    }\n\n    func sceneWillEnterForeground(_ scene: UIScene) {\n        \/\/ Called as the scene transitions from the background to the foreground.\n        \/\/ Use this method to undo the changes made on entering the background.\n    }\n\n    func sceneDidEnterBackground(_ scene: UIScene) {\n        \/\/ Called as the scene transitions from the foreground to the background.\n        \/\/ Use this method to save data, release shared resources, and store enough scene-specific state information\n        \/\/ to restore the scene back to its current state.\n    }\n\n\n}\nvar configuration = WKWebViewConfiguration()<\/pre>\n\n\n\n
<!doctype html>\n<html>\n<head>\n<meta charset=\"UTF-8\">\n<title>SVH Map Demo<\/title>\n\t\n<\/head>\n\n\t\n<body>\n\t\n\t<!--SVG Data Start-->\n\t<svg width=\"302px\" height=\"302px\" viewBox=\"0 0 302 302\" version=\"1.1\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" xmlns:xlink=\"http:\/\/www.w3.org\/1999\/xlink\">\n    <title>Map<\/title>\n    <g id=\"SVG-Map\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n        <g id=\"\u753b\u677f\" transform=\"translate(-29.000000, -29.000000)\">\n            <g id=\"Map\" transform=\"translate(29.000000, 29.000000)\">\n                <rect id=\"Background\" fill=\"#FFFFFF\" x=\"0\" y=\"0\" width=\"302\" height=\"302\"><\/rect>\n                <line x1=\"51\" y1=\"150.5\" x2=\"251\" y2=\"150.5\" id=\"Line01\" stroke=\"#2A6EBB\" stroke-width=\"9\" stroke-linecap=\"round\"><\/line>\n                <line x1=\"151.849648\" y1=\"51\" x2=\"151.150352\" y2=\"250.998777\" id=\"Line02\" stroke=\"#F09438\" stroke-width=\"9\" stroke-linecap=\"round\"><\/line>\n                <circle id=\"L1_Point1\" stroke=\"#428BDD\" stroke-width=\"5\" fill=\"#FFFFFF\" cx=\"51\" cy=\"151\" r=\"6.5\"><\/circle>\n                <circle id=\"L1_Point2\" stroke=\"#428BDD\" stroke-width=\"5\" fill=\"#FFFFFF\" cx=\"118\" cy=\"151\" r=\"6.5\"><\/circle>\n                <circle id=\"L1_Point3\" stroke=\"#428BDD\" stroke-width=\"5\" fill=\"#FFFFFF\" cx=\"184\" cy=\"151\" r=\"6.5\"><\/circle>\n                <circle id=\"L1_Point4\" stroke=\"#428BDD\" stroke-width=\"5\" fill=\"#FFFFFF\" cx=\"251\" cy=\"151\" r=\"6.5\"><\/circle>\n                <circle id=\"L2_Point1\" stroke=\"#F4B373\" stroke-width=\"5\" fill=\"#FFFFFF\" transform=\"translate(151.000000, 51.000000) rotate(-270.000000) translate(-151.000000, -51.000000) \" cx=\"151\" cy=\"51\" r=\"6.5\"><\/circle>\n                <circle id=\"L2_Point2\" stroke=\"#F4B373\" stroke-width=\"5\" fill=\"#FFFFFF\" transform=\"translate(151.000000, 118.000000) rotate(-270.000000) translate(-151.000000, -118.000000) \" cx=\"151\" cy=\"118\" r=\"6.5\"><\/circle>\n                <circle id=\"L2_Point3\" stroke=\"#F4B373\" stroke-width=\"5\" fill=\"#FFFFFF\" transform=\"translate(151.000000, 184.000000) rotate(-270.000000) translate(-151.000000, -184.000000) \" cx=\"151\" cy=\"184\" r=\"6.5\"><\/circle>\n                <circle id=\"L2_Point4\" stroke=\"#F4B373\" stroke-width=\"5\" fill=\"#FFFFFF\" transform=\"translate(151.000000, 251.000000) rotate(-270.000000) translate(-151.000000, -251.000000) \" cx=\"151\" cy=\"251\" r=\"6.5\"><\/circle>\n            <\/g>\n        <\/g>\n    <\/g>\n<\/svg>\n\t<!--SVG Data End-->\n\n\t<!--JS Action-->\n\t<script>\n\t\t\/\/Line1\n\t\tvar L1_Point01 = document.getElementById('L1_Point1');\n\t\tvar L1_Point02 = document.getElementById('L1_Point2');\n\t\tvar L1_Point03 = document.getElementById('L1_Point3');\n\t\tvar L1_Point04 = document.getElementById('L1_Point4');\n\t\t\/\/Line2\n\t\tvar L2_Point01 = document.getElementById('L2_Point1');\n\t\tvar L2_Point02 = document.getElementById('L2_Point2');\n\t\tvar L2_Point03 = document.getElementById('L2_Point3');\n\t\tvar L2_Point04 = document.getElementById('L2_Point4');\n\t\t\n\t\t\/\/Action\n\t\t\n\t\tfunction ClickPoint(pointname){\n\t\t\twindow.webkit.messageHandlers.AppModel.postMessage(\"WebView\u70b9\u51fb\uff0c\u53d1\u9001\u6d88\u606f\u7ed9Swift\uff01\" + pointname);\n\t\t}\n\t\t\n\t\tL1_Point01.onclick = function(){ClickPoint(1);} \n\t\tL1_Point02.onclick = function(){ClickPoint(2);} \n\t\tL1_Point03.onclick = function(){ClickPoint(3);} \n\t\tL1_Point04.onclick = function(){ClickPoint(4);} \n\t\t\n\t\tL2_Point01.onclick = function(){ClickPoint(5);} \n\t\tL2_Point02.onclick = function(){ClickPoint(6);} \n\t\tL2_Point03.onclick = function(){ClickPoint(7);} \n\t\tL2_Point04.onclick = function(){ClickPoint(8);} \n\t\t\n\t\t\n\t<\/script>\n\t\n<\/body>\n<\/html>\n<\/pre>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[6,5],"tags":[],"_links":{"self":[{"href":"https:\/\/92it.top\/index.php?rest_route=\/wp\/v2\/posts\/1370"}],"collection":[{"href":"https:\/\/92it.top\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/92it.top\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/92it.top\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/92it.top\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1370"}],"version-history":[{"count":1,"href":"https:\/\/92it.top\/index.php?rest_route=\/wp\/v2\/posts\/1370\/revisions"}],"predecessor-version":[{"id":1371,"href":"https:\/\/92it.top\/index.php?rest_route=\/wp\/v2\/posts\/1370\/revisions\/1371"}],"wp:attachment":[{"href":"https:\/\/92it.top\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1370"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/92it.top\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=1370"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/92it.top\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=1370"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}