Cordova从零开始插件开发-支付宝插件（一）

这两天APP开发基本进入尾声，但有一个最后的难题发生了，就是支付。就目前而言，大家一般都在用的手机（移动）支付方式无非就是三种；

支付宝、微信、网银（银联）支付；本文着重讲一下支付宝插件的开发，其他两种类似。

支付宝方面：需要签约，商户公钥，商户私钥，支付宝公钥，商户parentID等一些信息，请参考支付宝集成开发文档或使用度娘搜索。

Cordova下的支付宝插件，度娘搜了一下，好多说的有头没尾的，让人看了更头疼；要不就是收费的，哎，对于咱这种苦逼屌丝程序猿来说，伤不起！

没办法，只能自己来搞；于是各种搜索Cordova插件开发例子，教程等，讲的都是大同小异的内容，没有适合的步骤来做，然初学者无从下手；

本文将从零开始讲解，如何开发插件，并已一个例子--支付宝插件来讲解。

注：小弟也初学。讲得不好，大神勿喷！

1、创建cordova工程项目

cordova create plugdemo com.demo.plugdemo plugdemo

2、添加支持平台

cd plugdemo

cordova platform add android

3、导入eclipse，进行插件开发。

导入步骤：右键新建->Other

在向导中选择如图所示。

选择项目所在目录，勾选列表中出现的2个项目，点击Finish即可

这里可以把项目重新命名也可以。改名后注意引用的更改。

导入成功后，目录结构如下图

可以看到，默认的assets中是没有文件的，但在目录结构中是可以看到的；这里右键plugdemo->Properties（属性）或者选中项目按Alt+Enter也可以打开属性窗口

打开后，展开Resource->Resource Filters，在右侧的窗口中，将Exclude all中显示的全部去除即可显示。

这里导入项目部分介绍完毕！下面开始做第一个Hello World的插件demo。

一、在 src 文件夹中创建一个 com.demo.plugs 包，在包内创建一个 PlugHelloWorld.java 文件，编写下面的代码：

package com.demo.plugs;

import org.apache.cordova.CallbackContext;
import org.apache.cordova.CordovaPlugin;
import org.json.JSONArray;

import android.content.Context;
import android.widget.Toast;

public class PlugHelloWorld extends CordovaPlugin {
	public boolean execute(String action , JSONArray args, CallbackContext callbackContext ){
		/*显示一个提示语*/
        Context Activity = this.cordova.getActivity().getApplicationContext();
        Toast.makeText(Activity, "你好！世界！", Toast.LENGTH_LONG).show();
        /*显示一个提示语*/

        return true;
    }
}

插件必须继承自 CordovaPlugin 类，而包名和插件名是自定义的。

插件必须包含一个 execute 方法，它是唯一可以被 JavaScript 直接调用的方法。

二、在 res/xml/config.xml 文件 <widget></widget> 标签内加入下面的代码

<feature name="PlugHelloWorld">
	    <param name="android-package" value="com.demo.plugs.PlugHelloWorld" />
	</feature>

name：方法名  value：包名+方法名。

三、添加JS引用，调试插件运行。

在assets/www/index.html中添加如下代码:

<div class="app">
       <h1>Apache Cordova</h1>
       <div id="deviceready" class="blink">
       <p class="event listening">Connecting to Device</p>
       <p class="event received">Device is Ready</p>
        <input type = "button" value="点击我测试插件运行效果！" οnclick="a1()" />
       </div>
</div>

在assets/www/js/index.js文件 onDeviceReady方法中添加如下代码：

function a1(){
	cordova.exec(success,error,"PlugHelloWorld",null,[]);
}

参数解释：

success：插件执行成功的回调函数

error：插件执行失败的回调函数

PlugHelloWorld：插件方法名

null：插件中如果定义多个方法，如set，get，select等方法，这里指定要执行的方法名。execute方法无需指定。

[]：参数，即执行方法的传递参数，JSON数据格式。

可暂时无需关心回调，即success和error均设置为null即可。

到此，一个简单的插件编写已完毕，运行APP可以测试看看效果。

若显示中文出现乱码，请自行度娘解决。