2

Cordova Pluginを開発しているのですが、
Androidで確認したところ以下のエラーが発生し、Nativeコードまで処理がいきません。

Uncaught ReferenceError: test is not defined at file:///android_asset/www/js/index.js:24

この類の原因は、おそらく.xmlの設定ミスやファイルの置き場所などが考えられますが、test.jsはbuildまたはrunしてもしっかりとwww/jsのディレクトリに存在しています。

また、ソース類は以下のようになっております。

【plugin.xml】

<?xml version="1.0" encoding="utf-8"?>
<plugin xmlns="http://www.phonegap.com/ns/plugins/1.0"
    id="cordova-plugin-test"
    version="1.0.0">

<name>cordova plugin test</name>

<engines>
  <engine name="cordova" version=">=3.1.0"/>
</engines>

<asset src="www/test.js" target="js/test.js"/>

<js-module src="www/test.js" name="test">
   <clobbers target="test" />
</js-module>

<!-- pratform add android -->
<platform name="android">

<config-file target="res/xml/config.xml" parent="/*">
  <feature name="CordovaPluginTest">
    <param name="android-package" value="com.example.test.CordovaPluginTest"/>
  </feature>
</config-file>

<source-file src="src/android/Test.java" target-dir="src/com/example/test"/>

</platform>

</plugin>

【index.html】

<html>
<head>
    <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *">
    <meta name="format-detection" content="telephone=no">
    <meta name="msapplication-tap-highlight" content="no">
    <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">

    <link rel="stylesheet" type="text/css" href="css/index.css">
    <title>Hello World</title>

</head>
<body>
    <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>
        </div>

        <input type="button" value="test" onClick="cordovaPlugin()">

    </div>

    <script type="text/javascript" src="cordova.js"></script>
    <script type="text/javascript" src="js/index.js"></script>
    <script type="text/javascript" src="js/test.js"></script>

</body>
</html>

【index.js】

var app = {
    initialize: function() {
        this.bindEvents();
    },
    bindEvents: function() {
        document.addEventListener('deviceready', this.onDeviceReady, false);
    },
    onDeviceReady: function() {
        app.receivedEvent('deviceready');
    },
    receivedEvent: function(id) {
        var parentElement       =   document.getElementById(id);
        var listeningElement    =   parentElement.querySelector('.listening');
        var receivedElement     =   parentElement.querySelector('.received');

        listeningElement.setAttribute('style', 'display:none;');
        receivedElement.setAttribute('style', 'display:block;');

        console.log('Received Event: ' + id);
    }
};

function cordovaPlugin(){
    test.sendPlugin("test", success, error);
}

var success = function(message) {
    alert(message);
}

var failure = function() {
    alert("Error calling test Plugin");
}

app.initialize();

【test.js】

var exec        =   require('cordova/exec');
var platform    =   require('cordova/platform');
module.exports  =   {
    sendPlugin: function (message, successCallback, errorCallback) {
        exec(successCallback, errorCallback, "test", "Cordova Plugin!!", [message]);
    }
}

【Test.java】

public class Test extends CordovaPlugin {
    @Override
    public boolean execute(String action, JSONArray data, CallbackContext callbackContext) throws JSONException {
        if (action.equals("test")) {
            String name = data.getString(0);
            callbackContext.success(name);
            return true;
        } 
        return false;
    }
}

このUncaught ReferenceErrorについて結構調べたのですが、大体の回答に以下のソースをhtmlに追加するように言われてましたが、公開されているCordova Pluginの中には記述なしのものもありますので、自作したPlugin関係のファイル等をplugin.xmlにしっかり記述をしておけば、特に関係ないと認識しております。

    <script type="text/javascript" src="js/test.js"></script>

Cordovaの公式HPのガイドとcordova-plugin-helloを参考に、cordova plagin addが正常に追加動作できるところまでプロジェクトを作成しましたが、それでも現状から変わることはできませんでした。

お手数おかけいたしますが、
この問題を解決する方法をお教えください、よろしくお願いいたします。

1 件の回答 1

1

plugin.xmlに

<clobbers target="test" />
と記述されているので、index.jsの24行目は

function cordovaPlugin(){
    window.test.sendPlugin("test", success, error);
}

のように、windowをつける必要がある気がします

1
  • fkmさん、ご回答ありがとうございます。 上記の回答でなんとか現状から抜け出すことができました。 誠にありがとうございました。 ただ、、公開されているcordova pluginではwindowが付いておらず、なぜ自作ではwindow.をつけなければならないのか?疑問になりました...。
    – T.I.
    Commented 2015年9月1日 2:01

この質問に回答するには、ログインする必要があります。

求めていた回答ではありませんか? のタグが付いた他の質問を参照する。