使用GWT JSNI与js文件集成

Question

I am currently working on a GWT project and it now needs to used by an external JavaScript file. 我目前在GWT项目上工作，现在需要由外部JavaScript文件使用。 I am creating a test prototype right now to ensure both sides are working properly. 我现在正在创建一个测试原型，以确保双方都能正常工作。

When I run and compile, I see the console logs in the browser from the events being called. 当我运行和编译时，我从被调用的事件中看到控制台在浏览器中的日志。 However, the GWT java methods are not being called. 但是，未调用GWT Java方法。

After trying many scenarios, I also noticed that if I remove the $entry wrapper from the exportStaticMethods() , the opposite occurs. 在尝试了许多场景之后，我还注意到，如果我从exportStaticMethods()删除$entry包装器，则会发生相反的情况。 I see the System.out s being called in my java code, however the console logs from the JavaScript in the browser are not being called. 我看到在Java代码中调用了System.out ，但是未调用浏览器中JavaScript的控制台日志。

I am trying to figure what is causing the behavior and if there is a small missing piece I overlooked. 我试图弄清楚是什么原因导致了这种现象，如果我忽略了一个小的遗漏部分。

I have already reviewed the GWT JSNI documentation for calling a Java method from js and tried to find a solution from other related questions on StackOverflow. 我已经阅读了有关从JS调用Java方法的GWT JSNI文档，并尝试从StackOverflow上的其他相关问题中找到解决方案。

GWT and Java side GWT和Java端

I have gone into the onModuleLoad() method of my EntryPoint class and added a static method called exportStaticMethods() . 我进入EntryPoint类的onModuleLoad()方法，并添加了一个名为exportStaticMethods()的静态方法。 I also created the PokePingClass.java file listed below. 我还创建了下面列出的PokePingClass.java文件。

EntryPointClass.java EntryPointClass.java

public class EntryPointClass implements EntryPoint {

    @Override public void onModuleLoad() {
        exportStaticMethods();
        // load application here.
    }

    public static native void exportStaticMethods() /*-{

        $wnd.pingApp = $entry((function) {
                           @com.application.PokePingClass::pingApp()();
                       });

        $wnd.pokeApp = $entry((function) {
                           @com.application.PokePingClass::pokeApp()();
                       });
    }-*/
}

PokePingClass.java PokePingClass.java

public class PokePingClass {

    public static void pokeApp() {
        System.out.println("pokeApp() called");
    }

    public static void pingApp() {
        System.out.println("pingApp() called");
    }
}

HTML and js HTML和js

In the .html file of the project, I added a hidden div element of id 'pokePing', as well as the pokeping.js file. 在该项目的.html文件中，我添加了一个ID为'pokePing'的隐藏div元素以及pokeping.js文件。

<html>
    <head>
        .
        . <!-- other stuff -->
        .
        <script type='text/javascript' src='pokeping.js</script> 
    </head>

    <body>
        .
        . <!-- other stuff -->
        .
        <div id="pokePing" style="visibility: hidden;"></div>
    </body>
</html>

pokeping.js pokeping.js

$(document).ready(function) {

    var $pp = $('#pokePing');

    var pokeApp = function() {
        console.log("app handling poke event");
        window.parent.pokeApp();
    }

    var pingApp = function() {
        console.log("app handling ping event");
        window.parent.pingApp();
    }

    $pp.trigger('pokeApp');
    $pp.trigger('pingApp');
}

Answer 1

public static native void exportStaticMethods() /*-{

    $wnd.pingApp = $entry(function) {
                       @com.application.PokePingClass.pingApp()();
                   }

    $wnd.pokeApp = $entry(function) {
                       @com.application.PokePingClass.pokeApp()();
                   }
}-*/

This isn't valid JS, and doesn't make sense as JSNI. 这不是有效的JS，也没有JSNI的意义。 Try this instead: 尝试以下方法：

    $wnd.pingApp = $entry(function() {
                       @com.application.PokePingClass::pingApp()();
                   });

    $wnd.pokeApp = $entry(function() {
                       @com.application.PokePingClass::pokeApp()();
                   });

Edit because I still had it wrong, forgot the :: operator for members. 编辑，因为我仍然有错，忘记了成员的::运算符。

Answer 2

I found a similar post but the key was to actually return the method calls in the JSNI functions. 我发现了类似的帖子，但关键是实际上要返回JSNI函数中的方法调用。 After that, all works well. 之后，一切正常。

public static native void exportStaticMethods() /*-{

    $wnd.pingApp = $entry((function) {
                       return @com.application.PokePingClass::pingApp()();
                   });

    $wnd.pokeApp = $entry((function) {
                       return @com.application.PokePingClass::pokeApp()();
                   });
}-*/

使用GWT JSNI与js文件集成

问题描述

2 个解决方案

解决方案1
3 2017-01-04 21:10:31

解决方案2
0 已采纳 2017-02-17 15:39:18

使用GWT JSNI与js文件集成

问题描述

2 个解决方案

解决方案1 3 2017-01-04 21:10:31

解决方案2 0 已采纳 2017-02-17 15:39:18

解决方案1
3 2017-01-04 21:10:31

解决方案2
0 已采纳 2017-02-17 15:39:18