美文网首页
ios UIWebView与js的简单交互swift3版

ios UIWebView与js的简单交互swift3版

作者: Code人生 | 来源:发表于2017-09-22 10:36 被阅读0次

在开发过程中,我们可能遇到ios代码与js交互的情况,本人第一次使用遇到了很多坑,这里纪录一下,方便自己,也方便需要的人。

1.第一步先建一个接口(协议)并继承JSExport

这里实现两个方法提供给js调用的方法

importJavaScriptCore

@objcprotocolSwiftJavaScriptDelegate:JSExport{

funcshow()

funcshowAlert(_str:String,_msg:String)

}

2.第二步需要写一个类去实现上一步的接口(协议)(注意:1.这里必须要继承nsobject否则会报错,2.如果要传参数的话一定要写成

类似与 funcshowAlert(_str:String,_msg:String),_ str:String 这个“_”一定要加不然无法调用(调用无效果),在swift3.0中就这样,其他版本没有测试就不清楚了。

@objcclassSwiftJavaScriptModel:NSObject,SwiftJavaScriptDelegate{

funcshow() {

print("js调用我了")

}

funcshowAlert(_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.

//

importUIKit

importWebKit

importJavaScriptCore

classViewController:UIViewController,UIWebViewDelegate{

varcontext:JSContext!

overridefuncviewDidLoad() {

super.viewDidLoad()

self.setupUI()

}

funcsetupUI( ) {

self.view.addSubview(webView)

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

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

self.webView.delegate=self

self.view.addSubview(btn)

}

lazyvarwebView:UIWebView={

letwebView =UIWebView(frame:self.view.bounds)

returnwebView

}()

//用于点击调用js的按钮

lazyvarbtn:UIButton={

letbtn =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)

returnbtn

}()

//swift调用js

funconClick(){

letf =context?.objectForKeyedSubscript("swift")

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

}

funcwebViewDidFinishLoad(_webView:UIWebView) {

letmodel =SwiftJavaScriptModel()

//获取context

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

//这里注册一个标示给js访问

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

leturl =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 ??"")

}

}

overridefuncdidReceiveMemoryWarning() {

super.didReceiveMemoryWarning()

}

}

4.html代码

<html>

<meta charset="utf-8">

<title>ios js交互测试</title>

<head>

<script>

//这个提交给swift调用并传参数

 function swift(obj){

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

            }

</script>

</head>

<body>

<button onclick="model.showAlert('参数1','参数2')">js调用swift有参的方法</button>

<button onclick="model.show()" >js调用swift无参数方法</button>

</body>

</html> 

整个过程就是这样的,这里贴了源码,如果遇到问题欢迎留言,有什么更好的方法欢迎一起交流。

相关文章

网友评论

      本文标题:ios UIWebView与js的简单交互swift3版

      本文链接:https://www.haomeiwen.com/subject/pwgxextx.html