1. 程式人生 > >IOS與js的簡單交互swift3版

IOS與js的簡單交互swift3版

utf8 bsp settitle height context scrip 什麽 super extension

在開發過程中,我們可能遇到ios代碼與js交互的情況,本人第一次使用遇到了很多坑,這裏紀錄一下,方便自己,也方便需要的人。

1.第一步先建一個接口(協議)並繼承JSExport

這裏實現兩個方法提供給js調用的方法

import JavaScriptCore

@objc protocol SwiftJavaScriptDelegate:JSExport{

func show()

func showAlert(_ str:String,_ msg:String)

}

2.第二步需要寫一個類去實現上一步的接口(協議)(註意:1.這裏必須要繼承nsobject否則會報錯,2.如果要傳參數的話一定要寫成

類似與 func showAlert(_ str:String,_ msg:String),

_ str:String 這個“_”一定要加不然無法調用(調用無效果),在swift3.0中就這樣,其他版本沒有測試就不清楚了。

@objc class SwiftJavaScriptModel:NSObject,SwiftJavaScriptDelegate{

func show() {

print("js調用我了")

}

func showAlert(_ str:String,_ msg:String){

print("js調用我了:",str,msg)

}

}

3.開始在控制器中測試

//

// ViewController.swift

// WEBJSTest

//

// Created by admin on 17/8/5.

// Copyright ? 2017 tdin360. All rights reserved.

//

import UIKit

import WebKit

import JavaScriptCore

class ViewController: UIViewController,UIWebViewDelegate{

var context:JSContext!

override func viewDidLoad() {

super.viewDidLoad()

self.setupUI()

}

func setupUI( ) {

self.view.addSubview(webView)

let url = Bundle.main.path(forResource: "index", ofType: "html")

self.webView.loadRequest(URLRequest(url: URL(string:url!)!))

self.webView.delegate=self

self.view.addSubview(btn)

}

lazy var webView:UIWebView={

let webView = UIWebView(frame:self.view.bounds)

return webView

}()

//用於點擊調用js的按鈕

lazy var btn:UIButton={

let btn = UIButton(frame:CGRect(x:0,y:300,width:100,height:40))

btn.backgroundColor=UIColor.blue

btn.setTitle("調用js", for: .normal)

btn.addTarget(self, action: #selector(onClick), for: .touchUpInside)

return btn

}()

//swift調用js

func onClick() {

let f = context?.objectForKeyedSubscript("swift")

_=f?.call(withArguments: [["name":"admin","pass":"fdsfds"]])

}

func webViewDidFinishLoad(_ webView: UIWebView) {

let model = SwiftJavaScriptModel()

//獲取context

context = self.webView.value(forKeyPath: "documentView.webView.mainFrame.javaScriptContext") as! JSContext

//這裏註冊一個標示給js訪問

context.setObject(model, forKeyedSubscript:"model" as (NSCopying & NSObjectProtocol)!)

let url = Bundle.main.url(forResource: "index", withExtension: "html")

context.evaluateScript(try? String(contentsOf: url!, encoding: String.Encoding.utf8))

context.exceptionHandler = {

(context, exception) in

print("exception 錯誤@", exception ?? "")

}

}

override func didReceiveMemoryWarning() {

super.didReceiveMemoryWarning()

}

}

4.html代碼

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title>Title</title>

<script>

//這個提交給swift調用並傳參數

function swift(obj){

alert("swift調用我了"+obj["name"]+"--"+obj["pass"]);

}

</script>

</head>

<body>

<h1>html</h1>

<button onclick="model.showAlert(‘參數1‘,‘參數2‘)">調用swift(有參數)代碼</button>

<button onclick="model.show()">調用swift(無參數)代碼</button>

</body>

</html>

這裏貼了源碼,如果遇到問題歡迎留言,有什麽更好的方法歡迎一起交流。

IOS與js的簡單交互swift3版