客户端 => 与 Vaadin + GWT 的服务器通信

Question

我正在为现有的 vaadin 应用程序开发 GWT 小部件，到目前为止一切正常， 直到我需要从客户端调用一个服务器端函数并从中获取一个值给客户端。

更详细的问题： 有一个服务器端函数可以从连接的数据库中获取某些值。 现在我想从客户端访问这个功能， 因为我需要这些值来更新小部件中的某些内容。

根据 Vaadin 和 GWT 文档，您应该为此使用 RPC， 我已经在服务器端实现了多个功能，这些功能基本上是相反的 （从服务器向客户端发送一些东西，从服务器代码发起客户端函数的调用等）

据我了解，我应该使用 rpc 在服务器上调用 void 返回函数（我无法开始工作的部分） 然后我可以使服务器上的该功能使用服务器 => 客户端 rpc 将该值发送回客户端（已经工作）

这是确定的解决方案吗？如果是，我该如何正确实现客户端=>服务器部分 如果没有，什么是好的解决方案？

我已经尝试过类似https://vaadin.com/wiki/-/wiki/Main/Sending+events+from+the+client+to+the+server+using+RPC 但不知何故无法弄清楚如何在小部件类中而不是在连接器类中调用该方法 好像少了点什么？这甚至是正确的方法吗？

部分当前代码：

DrawwServerRPC

public interface DrawwServerRPC extends ServerRpc {
   public void updateE(String e);
}

服务器上 Draww.java 的相关部分

protected DrawwServerRPC = new DrawwServerRPC () {
    public void updateE(String e){
        // gets some values from a db and then sends them back to the client 
        // via rpc (both points working fine)
    }
};

public Draww() {
    registerRpc(rpc);
}

连接器类的一部分，应该在调用 DrawwWidget 类（客户端）中的特定方法时调用，而不是在单击时调用

getWidget().addClickHandler(new ClickHandler() {
        public void onClick(ClickEvent event) {
            final MouseEventDetails mouseDetails = MouseEventDetailsBuilder
                .buildMouseEventDetails(event.getNativeEvent(),
                            getWidget().getElement());
            rpc.updateE("test");
        }
    });

所以我的主要问题是，当调用客户端上 DrawwWidget 类中的特定函数时，我现在如何正确访问此方法（很可能通过连接器方法）？

然后我如何将值从客户端方法传递到连接器（甚至服务器端）方法？ => 需要以某种方式从客户端代码调用服务器上的 updateE 方法（通过使用连接器/rpc）

编辑： 因此，根据我从 Mika 的回答和 this

添加了一个接口

public interface customListener {
    void customEvent (String s);
}

调整了 DrawwWidget：

public class DrawwWidget extends Label{
private customListener MyListener;
//...
private void someFunction() {
    String something = ...;
    if (myListener != null) myListener.customEvent(something);
    }

public void setMyListener(customListener listener) {
    this.myListener = listener;
    }

}

最后在连接器类中实现了监听器：

public class DrawwConnector extends AbstractComponentConnector implements customListener {
DrawwServerRpc rpc = RpcProxy.create(DrawwServerRpc.class, this);
public DrawwConnector () {
    //lots of irrelevant Server => Client rpc things
    getWidget().setMyListener(this);
}

@Override
public void customEvent(String s) {
    rpc.doSomething(s);
}

现在我可以使用“customEvent (String s)”方法从小部件中的任何位置调用服务器端“doSomething”方法

Answer 1

您可以使用自定义小部件或 javascript 扩展与客户端进行交互。对于可见组件，自定义小部件通常是合适的解决方案。

您可以在客户端遵循类似于 Vaadin 通常在服务器端遵循的约定，并从连接器向您的小部件注册一个侦听器。例如：

@Override
protected Widget createWidget() {
    MyWidget widget = GWT.create(MyWidget.class);
    widget.addMyListener(new MyListener() {
        @Override
        public void onSomeEvent(ClientData data) {
            rpc.onEventFromClient(data);
        }
    });
    return widget;
}

Widget 是一个 GWT 组件，通常您可以找到一些可以扩展的现有 GWT 组件。如果没有，则可以从小部件创建纯 HTML 元素，对此很好的参考是现有 GWT 组件的源代码。

这是一个带有文本的小部件示例，您可以单击该小部件。

import com.google.gwt.user.client.ui.Label;
// ... only relevant imports included
public class MyWidget extends Label {
    private List<MyListener> listeners = new ArrayList<MyListener>();

    public MyWidget() {
        addStyleName("m-my-label");
        // Add GWT event listeners for events that you want to capture.
        addClickHandler(new ClickHandler() {
            @Override
            public void onClick(ClickEvent event) {
                notifyListeners();
            }
        });
    }

    private void notifyListeners() {
        for (MyListener listener : listeners) {
            listener.onSomeEvent(new ClientData("Hello from widget"));
        }
    }
}