在前面的文章中介绍的了如何使用Cordova进行跨平台应用的开发，使用Cordova的话基本上就不需要在写系统原生代码了，只要通过编写html页面和js方法即可。
但在有些特殊情况下，还是是需要html页面能和系统原生代码（ios native code）进行交互。下面介绍如何实现 JS 与 Swift 代码间的相互通信。
假设我们已经建立了一个名叫 HelloWorld 的Cordova工程项目（不太清楚如何使用Cordova的可以参考我前面写的几篇文章：使用Cordova开发iOS应用实战1（配置、开发第一个应用））

1，样例说明
（1）虽然使用Cordova创建的工程是一个 OC 工程，但由于苹果可以很方便的支持混合编程，所以我们用 Swift 来实现与 JS 的交互也是可以的。
（2）这里我们使用Swift来做个口令验证的功能，由于只是演示，所以代码很简单。Swift这边接收传输过来的口令字符串，判断正确与否并反馈回页面。如果验证失败还会返回具体的失败原因信息。

2，样例效果图

            
            
3，实现步骤

（1）我们在 Plugins 文件夹中新建一个Swift文件（HanggeSwiftPlugin.swift）。创建的时候系统会提示是否同时创建桥接头文件，这里选择确定。

（2）在新生成的桥接头文件 HelloWorld-Bridging-Header.h 中把 Cordova/CDV.h 给 import 进来

1
#import <Cordova/CDV.h>

（3）新建的 HanggeSwiftPlugin.swift 中添加如下代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
import Foundation
 
@objc(HWPHanggeSwiftPlugin) class HanggeSwiftPlugin : CDVPlugin {
     
    //验证口令方法
    func verifyPassword(command:CDVInvokedUrlCommand)
    {
        //返回结果
        var pluginResult:CDVPluginResult?
        //获取参数
        let password = command.arguments[0] as? String
         
        //开始验证
        if password == nil || password == "" {
            pluginResult = CDVPluginResult(status: CDVCommandStatus_ERROR,
                                           messageAsString: "口令不能为空")
        }else if password != "hangge" {
            pluginResult = CDVPluginResult(status: CDVCommandStatus_ERROR,
                                           messageAsString: "口令不正确")
        }else{
            pluginResult = CDVPluginResult(status:CDVCommandStatus_OK)
        }
         
        //发送结果
        self.commandDelegate.sendPluginResult(pluginResult, callbackId: command.callbackId)
    }
}

（4）在 config.xml 中添加如下配置，将我们创建的功能类给配置上

1
2
3
<feature name="HanggeSwiftPlugin">
    <param name="ios-package" value="HWPHanggeSwiftPlugin" />
</feature>

（5）首页 index.html 代码如下，修改运行后即可看到效果。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<!DOCTYPE html>
<html>
    <head>
        <title>口令验证</title>
        <meta http-equiv="Content-type" content="text/html; charset=utf-8">
            <script type="text/javascript" charset="utf-8" src="cordova.js"></script>
            <script type="text/javascript" charset="utf-8">
                //开始验证
                function verify() {
                    //获取输入的口令
                    var password = document.getElementById("pwd").value;
                    //调用自定义的验证插件
                    Cordova.exec(successFunction, failFunction, "HanggeSwiftPlugin",
                                 "verifyPassword", [password]);
                }
             
                //验证成功
                function successFunction(){
                    alert("口令验证成功！");
                }
             
                //验证失败
                function failFunction(message){
                    alert("验证失败："+message);
                }
            </script>
            <style>
                * {
                    font-size:1em;
                }
            </style>
    </head>
    <body style="padding-top:50px;">
        <input type="text" id="pwd" >
        <button onclick="verify();">验证</button>
    </body>
</html>

原文出自：www.hangge.com  转载请保留原文链接：http://www.hangge.com/blog/cache/detail_1150.html

Cordova - 与iOS原生代码交互1（通过JS调用Swift方法）的更多相关文章

  1. Cordova - 与iOS原生代码交互2（使用Swift开发Cordova的自定义插件）

    在前一篇文章中我介绍了如何通过 js 与原生代码进行交互(Cordova - 与iOS原生代码交互1(通过JS调用Swift方法)),当时是直接对Cordova生成的iOS工程项目进行编辑操作的(添加 ...

  2. iOS JS 交互之利用系统JSContext实现 JS调用OC方法以及Objective-C调用JavaScript方法

    ios js 交互分为两块: 1.oc调用js 这一块实现起来比较简单, 我的项目中加载的是本地的html,js,css,需要注意的是当你向工程中拖入这些文件时,选择拷贝到工程中,(拖入的文件夹是蓝色 ...

  3. iOS JS 交互之利用系统JSContext实现 JS调用oc方法

    ios js 交互分为两块: 1.oc调用js 这一块实现起来比较简单, 我的项目中加载的是本地的html,js,css,需要注意的是当你向工程中拖入这些文件时,选择如下操作,(拖入的文件夹是蓝色的, ...

  4. [iOS Hybrid实践：UIWebView中Html中用JS调用OC方法，OC执行JS代码]

    原理: 1.JS调用OC 每次webview执行跳转时都会被iOS给拦截,执行下面函数获得系统允许. 因此可以根据跳转信息转给系统,执行相应功能,比如打开相册等. // 网页中的每一个请求都会被触发 ...

  5. UIWebView中Html中用JS调用OC方法及OC执行JS代码

    HTML代码: <html> <head> <title>HTML中用JS调用OC方法</title> <meta http-equiv=&quo ...

  6. cordova与ios native code交互的原理

    非常早曾经写了一篇博客,总结cordova插件怎么调用到原生代码:cordova调用过程,只是写得太水.基本没有提到原理.近期加深了一点理解,又一次补充说明一下 js调用native 以下是我们产品中 ...

  7. unity调用ios原生代码objective-c和回调

    从c#到objective-c学习 https://www.runoob.com/w3cnote/objective-c-tutorial.html https://www.jianshu.com/p ...

  8. Unity与iOS原生代码之间的相互调用

    1.Unity调用iOS: 1.1.在Unity C#中: [ DllImport( "__Internal" )] private static extern int _show ...

  9. RN和IOS原生端交互

    1.RCTBridgeModule #import <Foundation/Foundation.h> #import "RCTBridgeModule.h" #imp ...

随机推荐

  1. 接口测试中三种传参请求（Map、request、Integer）解析

    注册企业接口传入的是一个request,查询企业接口传入的是一个integer:根据名称和国家名称模糊匹配接口传入的是一个Map:针对三种不同的传参我怎么作接口测试呢? 1 package com.w ...

  2. 数据库 DROP命令和DELETE命令的本质区别是什么

    不同点: 1. 从删除内容上区分: truncate和 delete只删除数据不删除表的结构(定义) drop语句将删除表的结构.被依赖的约束(constrain),触发器(trigger),索引(i ...

  3. 软件工程（C编码实践）学习总结及心得

    徐礼超  原创作品转载请注明出处:http://www.cnblogs.com/xulichao <软件工程(C编码实践篇)>MOOC课程http://mooc.study.163.com ...

  4. Linux high memory 学习总结

    在free命令中有个参数l,它表示 show detailed low and high memory statistics.其实最先是对High Memory总是为零有些不解(Linux是64为). ...

  5. Kafka 分布式的，基于发布/订阅的消息系统

    Kafka是一种分布式的,基于发布/订阅的消息系统.主要设计目标如下: 通过O(1)的磁盘数据结构提供消息的持久化,这种结构对于即使数以TB的消息存储也能够保持长时间的稳定性能. 高吞吐量:即使是非常 ...

  6. c#-轮询算法

    这两天做东西,业务上有个特殊的需求,在用户访问页面的时候,针对某一行代码进行控制,按照概率来进行显示,我做的是针对当前页面的曝光进行处理,曝光代码是第三方的,页面上只要有这段代码就算是执行了这段曝光代 ...

  7. MySQL数据类型——数值类型

    1.1.1 整型 整型 占用字节 范围 范围 tinyint 1 -27~27-1 -128~127 smallint 2 -215~215-1 -32768~32767 mediumint 3 -2 ...

  8. SQL Server 2008 R2——T-SQL 存储过程 返回表

    ==================================声明================================== 本文原创,转载在正文中显要的注明作者和出处,并保证文章的完 ...

  9. Activiti之 Exclusive Gateway

    一.Exclusive Gateway Exclusive Gateway(也称为XOR网关或更多技术基于数据的排他网关)经常用做决定流程的流转方向.当流程到达该网关的时候,所有的流出序列流到按照已定 ...

  10. iOS 实现Tabbarcontroller中间自定义样式 最简单的方法

    先上图: 如果我们要实现中间按钮自定义样式,方法应该蛮多,这里介绍一种最简单的. 1.创建类继承:UITabBarController,如下代码都是写在该类的 .m文件里 2.定义最中间的自定义样式, ...