Ionic2实现自定义Cordova插件-Android屏幕录制

之前用Android原生写过一个录屏直播、点播的客户端，现打算将用的较多的点播功能移植到Ionic2项目里。正好熟悉下Cordova创建、调用和发布自定义插件的过程。
cordova-plugin-screenrecord

创建ScreenRecord插件

Cordova提供了cli工具plugman，官方文档

npm install -g plugman
在ionic2项目下，plugman create --name ScreenRecord --plugin_id com.unionpay.screenrecord --plugin_version 0.0.1
cd ScreenRecord，添加平台插件代码，我这里只需生成Android
plugman platform add platform_name android，

plugin项目的架构至此就搭建好了，

ScreenRecord
-src
--android
---ScreenRecord.java
---ScreenRecordService.java
-www
--ScreenRecord.js
plugin.xml

编写ScreenRecord插件

plugin.xml

cordova插件的配置文件，介绍关键的标签：

指定js接口文件的路径

通过标签可以将插件需要的权限注入到Ionic2安卓项目的AndroidManifest.xml中。Cordova还提供API - PermissionHelper，用于动态检测和申请权限，具体方法见http://cordova.apache.org/docs/en/latest/guide/platforms/android/plugin.html
标签用于配置需注入的java文件和路径。
除这两种标签，plugin.xml还可以配置Android项目中可能用到的静态布局文件、依赖库等。

ScreenRecord.js

接口文件，通过cordova.exec实现与原生代码的交互。

var exec = require('cordova/exec');var ScreenRecord = function(){}ScreenRecord.startRecord = function(options, filePath, success, error) {  exec(success, error, "ScreenRecord", "startRecord", [options, filePath]);};ScreenRecord.stopRecord = function(success, error) {  exec(success, error, "ScreenRecord", "stopRecord", []);}module.exports = ScreenRecord;

这里将方法对象ScreenRecord作为模块导出，方面Ionic2在ts文件中调用(在declaration.d.ts中声明全局变量ScreenRecord即可)。

cordova.exec方法需传入5个参数:

success, 成功回调方法
error，错误回调方法
“service”，对应Android的class名称
“action”, 对应原生代码中的方法
[/* arguments */]，传给原生代码的参数数组

ScreenRecord.java

Cordova插件的Android代码要求至少有一个class继承CordovaPlugin，以及重写excute方法。

package com.unionpay.screenrecord;import org.apache.cordova.CordovaPlugin;import org.apache.cordova.CallbackContext;import org.apache.cordova.PermissionHelper;import org.apache.cordova.PluginResult;import org.json.JSONArray;import org.json.JSONException;import org.json.JSONObject;import java.io.File;import android.Manifest;import android.content.Intent;import android.media.projection.MediaProjection;import android.media.projection.MediaProjectionManager;import android.util.Log;import android.content.pm.PackageManager;import com.unionpay.screenrecord.ScreenRecordService;/** * This class echoes a string called from JavaScript. */public class ScreenRecord extends CordovaPlugin {    public final static String TAG = "ScreenRecord";    public MediaProjectionManager mProjectionManager;    public ScreenRecordService screenRecord;    public CallbackContext callbackContext;    public JSONObject options;    public String filePath;    public static final int PERMISSION_DENIED_ERROR = 20;    public static final int RECORD_AUDIO = 0;    protected final static String permission = Manifest.permission.RECORD_AUDIO;    public final static int SCREEN_RECORD_CODE = 0;    @Override    public boolean execute(String action, JSONArray args, CallbackContext callbackContext) throws JSONException {        this.callbackContext = callbackContext;        if (action.equals("startRecord")) {            options = args.getJSONObject(0);            filePath = args.getString(1);            this.startRecord(callbackContext);            return true;        } else if (action.equals("stopRecord")) {            this.stopRecord(callbackContext);            return true;        }        return false;    }······

省略了具体的业务代码，主要介绍重写execute方法。
结合之前的js接口代码，很快就能明白该方法的三个参数：

action，对应js中的action，用于匹配与js中哪个方法进行交互
args， JSONArray格式的参数列表，例如我在startRecord方法中传入两个参数，一个json对象options，一个String对象filePath。通过JSONArray的API祛除对应格式的值
CallbackContext，该类提供两个方法,callbackContext.success()对应js中的success回调，callbackContext.error()对应js中的error()回调

问题
在写录屏的原生代码时，用到了Intent和getActivity。实际编译后会报错，Cordova插件是无法直接引用这两个方法的，CordovaPlugin中声明了接口CordovaInterface对象cordova，通过该对象可以使用Intent与其他Activity交互。

mProjectionManager = (MediaProjectionManager) this.cordova.getActivity().getSystemService("media_projection");Intent captureIntent = mProjectionManager.createScreenCaptureIntent();cordova.startActivityForResult(this, captureIntent, SCREEN_RECORD_CODE);

ScreenRecordService

开启录屏进程的类，具体代码见git吧

Ionic2调试插件

在项目下输入命令ionic plugin add path/ScreenRecord
插件安装成功，ScreenRecord会出现在plugins目录下，项目代码也会被添加到android下。
调试过程中，若出现java代码导致的问题，可以直接修改platforms/android的代码，这样重新ionic build或ionic run可以看到修改后的效果。
若修改ScreenRecord下的代码，需要先移除插件，再安装。
ionic plugin remove com.unionpay.screenrecord，
ionic plugin add path/ScreenRecord

自定义Cordova插件的发布

创建package.json
plugman createpackagejson /path/to/your/plugin
创建之前最好先将插件代码提交至git，json中需配置plugin的name，id，git repository等
登录npm
若已注册过npm账号，npm login然后输入用户名、密码以及邮箱
若没有，npm adduser，按照提示设置你的账号。
发布plugin
在插件根目录下npm publish .
如果npm之前有设置了淘宝镜像，会遇到错误no_perms Private mode enable...
通过npm config set registry https://registry.npmjs.org切换回官方地址。再执行上传命令。

总的来说，实现一个Cordova自定义插件并不难，而且cordova plugins库现有的插件已经很多，但为了具体的业务需求。自定义插件还是很有必要的。