【Swift・Objective-C】WKWebViewでJavaScriptからの通知を受ける

#JavaScriptによるNativeの操作
今回はWeb側からJavaScriptにより通知を受け、Nativeの操作をする方法をまとめていきます。

####1: WKWebViewConfigurationをインスタンス化します

**Swift**

```swift
let webConfiguration = WKWebConfiguration()
```

**Objective-C**

```objective_c
WKWebViewConfiguration *webConfiguration = [[WKWebViewConfiguration alloc] init];
```

####2: WKUserContentControllerをインスタンス化します
**Swift**

```swift
let userController = WKUserContentController()
```

**Objective-C**

```objective_c
WKUserContentController *userController = [[WKUserContentController alloc] init];
```

####3: userControllerにJavaScriptが叩くhandler(どのメソッドを叩いているか判断するもの）を登録します。
**Swift**

```swift
userController.add(self, name: "startMusic")
userController.add(self, name: "stopMusic")
userController.add(self, name: "installMusic")
userController.add(self, name: "randamMusic")
```

**Objective-C**

```objective_c
[userContentController addScriptMessageHandler:self name:@"startMusic"];
[userContentController addScriptMessageHandler:self name:@"stopMusic"];
[userContentController addScriptMessageHandler:self name:@"installMusic"];
[userContentController addScriptMessageHandler:self name:@"randamMusic"];
```

####4:　ViewControllerはデリゲート先としてWKUserContentControllerに渡され登録されているので、WKScriptMessageHandlerプロトコルに準拠させます。
**Swift**

```swift
extension ViewController: WKScriptMessageHandler {
```

**Objective-C**

```objective_c
@interface ViewController ()
<WKScriptMessageHandler>
```

####5: configurationにuserControllerを登録します。
**Swift**

```swift
webConfiguration.userController = userController
```

**Objective-C**

```objective_c
webConfiguration.userController = userController;
```
####6: webViewにconfigurationを登録します
**Swift**

```swift
let webView = WKWebView(frame: .zero, configuration: webConfiguration)
```
**Objective-C**

```objective_c
_webView = [[WKWebView alloc] initWithFrame:self.view.bounds configuration:configuration];
```

####7: WKScriptMessageHandlerプロトコルの実装

**JavaScript**

```javascript
window.webkit.messageHandlers.installMusic
```

**Swift**

```swift
import Foundation
import WebKit

extension ViewController: WKScriptMessageHandler {
    func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) {
        switch message.name {
        case "startMusic":
            print("startRecordingが呼ばれる")
        case "stopMusic":
            print("toggleMicInputが呼ばれる")
        case "installMusic":
            print("youtubeStartが呼ばれる")
        case "randamMusic":
            print("ランダム再生します。")
        default:
            print("default")
        }
    }
```

**Objective-C**

```objective_c
@interface ViewController ()
<WKScriptMessageHandler>

@property (nonatomic, strong) WKWebView *webView;

@end 

@implementation ViewController

- (void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message
{
    switch (message.name) {
        case @"startMusic":
            NSLog("startRecordingが呼ばれる")
        case @"stopMusic":
            NSLog("toggleMicInputが呼ばれる")
        case @"installMusic":
            NSLog("youtubeStartが呼ばれる")
        case @"randamMusic":
            NSLog("ランダム再生します。")
        default:
            NSLog("default")
    }
}

@end
```

#参考
https://qiita.com/mss634/items/170d3cb401eee4ec1253
https://qiita.com/ShingoFukuyama/items/54d839038794dd592145
https://www.sirochro.com/note/swift-swiftyjson-parse/
https://rc-code.info/ios/post-194/