一、前言 近日，有朋友问我关于WKWebView与JS的交互问题，可我之前一直使用的是UIWebView，也不曾做过WKWebView的交互啊！...接下来大家一块学习下WKWebView是怎么实现原生代码和JS交互的。...三、WKWebView的代理方法 /*!...// message.body 传递的数据 } 3、在js中点击按钮，进行弹窗实现 //MARK:WKUIDelegate //此方法作为js的alert方法接口的实现，默认弹出窗口应该只有提示消息...JS修改节点的内容 let js = "document.getElementsByTagName('h2')[0].innerText = '这是一个iOS写入的方法'"; //将js注入到网页中 6
WKWebView调用JS： func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!)...{ // sayHello()是JS的方法 webView.evaluateJavaScript("sayHello('WebView你好！')")...{ (result, err) in print(result, err) } } WKScriptMessageHandler：JS 调用 Swift 时需要用到协议中的一个方法来...{ // 调用JS方法 webView.evaluateJavaScript("sayHello('WebView你好！')")...// Swift方法，可以在JS中调用 func userContentController(_ userContentController: WKUserContentController,
WKWebView 适用于iOS8之后的系统 引用 #import 1.OC调用JS NSString *jsmethod = [NSString stringWithFormat...:@"mymethd(\"%@\")",data]; //data（NSDate）为要传给js的数据 [self.wkWebView evaluateJavaScript:jsmethod...（2）添加方法监听 WKWebViewConfiguration *webviewConfig = [[WKWebViewConfiguration alloc] init]; webviewConfig.userContentController...- 64) configuration:webviewConfig]; （3）代理方法实现 #pragma mark - WKScriptMessageHandler - (void)userContentController...message.name isEqualToString: @"share"]) { NSLog(@"%@",message.body); } } (4)HTML中使用方法
最新项目使用网页加载页面的基本上都由UIWebView转到WKWebView了,然后刚刚才发现用了WKWebView之后不会弹窗提示了,查了一下知道原来WKWebView默认禁止了下面的跳转: 打开itunes.apple.com...跳转到App Store, 拨打电话, 唤起邮箱等一系列操作 JS的Alert,Confirm,TextInput弹框 解决方法: 首先实现WKUIDelegate代理方法 解决唤不起打电话和跳转系统应用的方法...- (void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction...WKNavigationActionPolicyCancel); return; } decisionHandler(WKNavigationActionPolicyAllow); } } 解决JS...的Alert,Confirm,TextInput不弹框的方法 #pragma mark - Alert弹窗 - (void)webView:(WKWebView *)webView runJavaScriptAlertPanelWithMessage
让WKWebview支持NSURLProtocol可参考：NSURLProtocol对WKWebView的处理 所以这里应该很清楚，NSHTTPCookieStorage已经用不到了，但是你可以把他作为存储...我自己的项目里面已经全部删除了它的使用 第一种：通过NSMutableURLRequest设置cookie(js开发的不推荐) 以我项目为例，这种方法设置的cookie，不能被js读取到，在浏览器调试中也不能看到...所以通过js开发的此方式不可用，但是可以被PHP等动态语言读取，由于我的项目都是用js开发的，故不用此方式，也不做兼容。这里就不做过多的使用介绍。...第二种：在WKWebview初始化的时候，通过js注入 这种方式不好的地方就是，只能在初始化的时候注入，如果cookie的值发生变化，就需要重新初始化，就变得比较low。...使用方法如下图： 第三种：通过WKHTTPCookieStore注入cookie，但是只针对iOS11之后 使用起来就比较方便了。
WKWebView 这里添加了三个代理，代理方法会在下面实现。...`跟JS交互了： // MARK: - 加载完成 func webView(_ webView: WKWebView, didFinish navigation: WKNavigation!)...{ print("加载完成: didFinish") // 调用js方法(把标题h1设置成红色) webView.evaluateJavaScript("changeHead()...2)、这里在app的原生页面写了两个button调用JS的方法/获取信息 func setupButtons() { let baseHeight = (navigationController?....data:\(String(describing: data)) error: \(String(describing: error))") }) } // MARK: - 调用JS的方法，并打印返回数据
的简单交互 先看看 WKUIDelegate里面的代理方法都是用来做什么的，我们一个一个的解释这几个代理方法； // 创建方法，这个就不在多说了，重点放在下面几个 -(nullable WKWebView...-(void)webViewDidClose:(WKWebView *)webView { } 下面这三个方法根据方法前面的字面意思就能区分记住！...runJavaScriptAlert 方法注意点 1.在JS端调用alert函数时，会触发此代理方法。...*/ // runJavaScriptAlert // 在JS端调用alert函数时，会触发此代理方法。...端调用confirm函数时，会触发此方法 2.通过message可以拿到JS端所传给我们数据 3.在iOS端显示原生alert得到YES/NO后,通过completionHandler回调给JS端 4.
前言 由于目前UIWebView 已经被抛弃了，因此推荐使用WKWebView的WKScriptMessageHandler实现iOS与JS交互 WKWebView是Apple在iOS8推出的Webkit...通过WKWebView的-evaluateJavaScript:completionHandler:方法来实现 WKWebView的-evaluateJavaScript:completionHandler...:方法可以执行JS代码。...但只有在整个webView加载完成之后调用此方法才会有响应 2.1 执行JS iOS使用WKWebView的-evaluateJavaScript:completionHandler:方法执行拼接好的JS...WKWebView在每次加载请求完成后会调用此方法 (void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation
问题最近用WKWebView读取PDF文件出现字体异常、电子图章不显示的问题，后来查找很多解决方案，最后决定用PDF.js的方式来实现解决方案参考https://www.jianshu.com/p/ded81b392d4d...demo能接入PDF，但部分字体在真机上还是接入异常，后来使用gulp generic-legacy生成generic-legacy稳定包之后，对Safari进行兼容后，终于能修复字体异常的问题PDF.js.../www.jianshu.com/p/fd5f248a8158https://www.jianshu.com/p/ded81b392d4dhttps://github.com/mozilla/pdf.js
在点击前三个按钮的时候会调用方法： // 警告框 - (void)webView:(WKWebView *)webView runJavaScriptAlertPanelWithMessage:(NSString...如果点击第四个conform按钮会调用方法： // 确认框 - (void)webView:(WKWebView *)webView runJavaScriptConfirmPanelWithMessage...如果点击最后一个input按钮会调用方法： // 输入框 - (void)webView:(WKWebView *)webView runJavaScriptTextInputPanelWithPrompt...注意：在利用UIWebView展示网页的时候我们如果要想与JS进行交互那么我们就得获取JS代码中的方法名，而我们在使用WKWebView的时候就不用了。...alert in js'}); AppModel是我们注入的对象，“（）”中的内容是我们传递给客户端的数据。
问题 最近用WKWebView读取PDF文件出现字体异常、电子图章不显示的问题，后来查找很多解决方案，最后决定用PDF.js的方式来实现 解决方案 参考https://www.jianshu.com/...能接入PDF，但部分字体在真机上还是接入异常，后来使用 gulp generic-legacy 生成generic-legacy稳定包之后，对Safari进行兼容后，终于能修复字体异常的问题 PDF.js...}]; }); demo地址：https://github.com/freesan44/PDFJSReader 参考： https://github.com/mozilla/pdf.js...www.jianshu.com/p/fd5f248a8158 https://www.jianshu.com/p/ded81b392d4d https://github.com/mozilla/pdf.js
调用的方法名称 [userController addScriptMessageHandler:self name:@"name"]; //js注入，注入一个测试方法。...中的属性和方法解析 下面列举了WKWebView中常用的属性和方法。...，这个类使用如下方法来进行实例化： /* source为要注入的js代码 WKUserScriptInjectionTime设置注入的时机 forMainFrameOnly参数设置是否只在主页面注入 typedef..., //原js代码运行后注入 WKUserScriptInjectionTimeAtDocumentEnd } NS_ENUM_AVAILABLE(10_10, 8_0); */ -...对应，也可以将注入的代码移除，方法如下： //注入一个JavaScript抽象对象 - (void)addUserScript:(WKUserScript *)userScript; //移除所有注入
上下文环境调用 JS 函数 1.2 JS 调用 OC 函数 1.2.1 OC 拦截 JS 超链接操作请求 1.2.2 向 JS 中注入 OC 类 1.2.3 使用 JSContext 上下文，JS函数...②使用 JSContext 上下文调用 JS 函数 第一种方法使用相对简单，但复杂业务可能无法实现。 1.1.1 OC 拼接 JS 字符串调用 JS 方法 JS 代码如下： <!...中注入 OC 类 向 JS 注入 OC 类，需要引入 框架，使用 JSContext 向 JS 中注入 OC 类。...首先，要将该方法使用协议约定，并继承JSExport 协议： @protocol TestProtocol - (NSString *)getUserInfo; @end 然后在注入...调用 JS 方法，使用block回调JS返回结果。
下面开始介绍WKWebView 如何通过WebViewJavascriptBridge 来实现JS 与OC 的互相调用。...要调用的Native 功能 为了便于维护，我将所有js 要调用Native 功能放在了一个方法里添加，然后每个功能再单独处理。...第四步，在HTML添加关键的js HMTL 里在调用Native 功能之前，要先添加一个js 方法，然后主动调用一次该方法。...执行wvjbscheme://__BRIDGE_LOADED__，然后在WKWebView 的navigationDelegate方法中拦截该URL ，然后往HMTL中注入js。...内容 NSString *js = WebViewJavascriptBridge_js(); // 执行Native 的API，实现将js 注入 到HMTL中。
WKWebView WKWebView是现代 WebKit API 在 iOS 8 和 OS X Yosemite 应用中的核心部分。...WKWebView与js交互 所谓轻应用，简单的来说就是原生应用集成了html页面入口，还能通过js与native实现交互，例如：通过js调用native封装好的viewController实现扫描与对应反馈功能...decisionHandler { //允许跳转 decisionHandler(WKNavigationResponsePolicyAllow); return; } 在发送请求之前，决定是否跳转<处理js...fromWebView:webView]; }else{ //forward } decisionHandler(WKNavigationActionPolicyAllow); } 处理js...selfdidReceivedNotificationDictionary:responseDictfromWebView:webView]; } }else{ } } decidePolicyForNavigationAction能读取到由js
:(WKUserScript *)userScript; // 移除所有注入的JS - (void)removeAllUserScripts; // 添加scriptMessageHandler...WKUserContentController是用于与JS交互的类，而所注入的JS是WKUserScript对象。...它的所有属性和方法如下： // JS源代码 @property (nonatomic, readonly, copy) NSString *source; // JS注入时间 @property (...对象 // source：JS源代码 // injectionTime：JS注入的时间 // forMainFrameOnly：是否只注入main frame - (instancetype)initWithSource...*)webView NS_AVAILABLE(10_11, 9_0); // 调用JS的alert()方法 - (void)webView:(WKWebView *)webView runJavaScriptAlertPanelWithMessage
调用 Native JS 调用 Native 的实现方式较多，主要有拦截 URL Scheme 、重写 prompt 、注入 API 等方法。...重写 prompt 等原生 JS 方法 Android 4.2 之前注入对象的接口是 addJavascriptInterface ，但是由于安全原因慢慢不被使用。...对 alert、confirm、prompt 等方法做了拦截，如果通过此方式进行 Native 与 JS 交互，需要实现 WKWebView 的三个 WKUIDelegate 代理方法。...注入 API 基于 Webview 提供的能力，我们可以向 Window 上注入对象或方法。JS 通过这个对象或方法进行调用时，执行对应的逻辑操作，可以直接调用 Native 的方法。...这样有利于保持 API 与 Native 的一致性，但是缺点是在 Native 注入的方法和时机都受限，JS 调用 Native 之前需要先判断 JSBridge 是否注入成功 使用规范 H5
当时对依赖注入这一概念还不是很理解，只是根据题目的要求初步认识了依赖注入。...，题目挑战的方法是在inject函数中编写代码，实现依赖注入。...依赖注入是什么？ 在解决上面是上的问题后，回过头来想：依赖注入是啥？其实通过题目的描述以及测试代码容易理解到，依赖注入可以动态地为函数添加依赖。...在js中依赖注入的概念不像java中被经常提到，主要原因是在js中很容易就实现了这种动态依赖。最简单的例子：bind函数。...js可以通过bind,apply,call等函数可以很方便地控制函数的参数和this变量，所以简单地依赖注入在很多情况下已经被不知不觉地使用。在AMD的模块定义中，其方式也是一种依赖注入。
示例Demo：WKWebView的使用 本文将从以下几方面介绍WKWebView： 1、WKWebView涉及的一些类 2、WKWebView涉及的代理方法 3、网页内容加载进度条的实现 4、JS...//以下代码适配文本大小，由UIWebView换为WKWebView后，会发现字体小了很多，这应该是WKWebView与html的兼容问题，解决办法是修改原网页，要么我们手动注入JS...方法，设置处理接收JS方法的代理 [wkUController addScriptMessageHandler:self name:@"jsToOcNoPrams"];...JS方法，设置处理接收JS方法的代理，代理遵守WKScriptMessageHandler，实现捕捉到JS消息的回调方法，详情可以看第一步中对这两个类的介绍。...OC调用JS //OC调用JS changeColor()是JS方法名，completionHandler是异步回调block NSString *jsString = [NSString
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM
