当我尝试做以下操作时,我遇到了一个奇怪的“通信问题” Vaadin 错误:
我有两个 UI,第一个 UI 有一个指向另一个 UI 的链接,以下是代码:
public class MenuUI extends UI {
@WebServlet(value = "/*", asyncSupported = true)
@VaadinServletConfiguration(productionMode = false, ui = MenuUI.class)
public static class Servlet extends VaadinServlet {
}
@Override
protected void init(VaadinRequest request) {
final VerticalLayout layout = new VerticalLayout();
layout.setMargin(true);
layout.setSpacing(true);
setContent(layout);
MenuBar menuBar = new MenuBar();
MenuItem submenu1 = menuBar.addItem("Submenu 1", null);
MenuItem submenu2 = menuBar.addItem("Submenu 2", null);
submenu1.addItem("Option 1", null);
submenu1.addItem("Option 2", null);
submenu2.addItem("Option 3", null);
submenu2.addItem("Option 4", new Command() {
@Override
public void menuSelected(MenuItem selectedItem) {
Notification.show("That was option 4");
}
});
layout.addComponent(menuBar);
Link link = new Link("Go to ShortcutKeys",
new ExternalResource(Page.getCurrent().getLocation().toString() + "Shortcut"));
link.setTargetName("_blank");
layout.addComponent(link);
}
}
这个 UI 显示的结果如下:
![enter image description here](https://istack.dev59.com/VU9nJ.webp)
public class ShortcutUI extends UI {
@WebServlet(value = "/Shortcut", asyncSupported = true)
@VaadinServletConfiguration(productionMode = false, ui = ShortcutUI.class)
public static class Servlet extends VaadinServlet {
}
@Override
protected void init(VaadinRequest request) {
final VerticalLayout layout = new VerticalLayout();
layout.setMargin(true);
layout.setSpacing(true);
setContent(layout);
final TextField tf = new TextField("Your data:");
layout.addComponent(tf);
Button button = new Button("Send data (ENTER)");
button.setClickShortcut(KeyCode.ENTER, ModifierKey.SHIFT);
button.addClickListener(new Button.ClickListener() {
public void buttonClick(ClickEvent event) {
layout.addComponent(new Label(tf.getValue()));
tf.setValue("");
tf.focus();
}
});
layout.addComponent(button);
}
这将导致以下结果:
在这里我输入一些文本,然后当我点击“发送数据”按钮时,我会得到以下内容:
为什么会出现通信问题?如果UI不是从点击的链接创建的,例如如果我将ShortcutUI init()内容放在MenuUI中,就像以下类中一样:
public class MenuUI extends UI {
@WebServlet(value = "/*", asyncSupported = true)
@VaadinServletConfiguration(productionMode = false, ui = MenuUI.class)
public static class Servlet extends VaadinServlet {
}
@Override
protected void init(VaadinRequest request) {
final VerticalLayout layout = new VerticalLayout();
layout.setMargin(true);
layout.setSpacing(true);
setContent(layout);
MenuBar menuBar = new MenuBar();
MenuItem submenu1 = menuBar.addItem("Submenu 1", null);
MenuItem submenu2 = menuBar.addItem("Submenu 2", null);
submenu1.addItem("Option 1", null);
submenu1.addItem("Option 2", null);
submenu2.addItem("Option 3", null);
submenu2.addItem("Option 4", new Command() {
@Override
public void menuSelected(MenuItem selectedItem) {
Notification.show("That was option 4");
}
});
layout.addComponent(menuBar);
Link link = new Link("Go to ShortcutKeys",
new ExternalResource(Page.getCurrent().getLocation().toString() + "Shortcut"));
link.setTargetName("_blank");
layout.addComponent(link);
// Shortcut Keys
final TextField tf = new TextField("Your data:");
layout.addComponent(tf);
Button button = new Button("Send data (ENTER)");
button.setClickShortcut(KeyCode.ENTER, ModifierKey.SHIFT);
button.addClickListener(new Button.ClickListener() {
public void buttonClick(ClickEvent event) {
layout.addComponent(new Label(tf.getValue()));
tf.setValue("");
tf.focus();
}
});
layout.addComponent(button);
}
}
这段代码的结果如下所示:
![enter image description here](https://istack.dev59.com/E2QNS.webp)
这是完整的错误信息,来自于?debug Vaadin控制台:
Communication error: (SyntaxError) : Unexpected token < - Original JSON-text: html>
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta
http-equiv="X-UA-Compatible" content="IE=11;chrome=1" /> <style type="text/css">html,
body {height:100%;margin:0;}</style> <link rel="shortcut icon"
type="image/vnd.microsoft.icon"
href="./../../VAADIN/themes/chapter_4_menubar_and_shortcutkeys/favicon.ico" /> <link
rel="icon" type="image/vnd.microsoft.icon"
href="./../../VAADIN/themes/chapter_4_menubar_and_shortcutkeys/favicon.ico" /> </head>
<body scroll="auto" class=" v-generated-body"> <div id="Chapter4MenuBarandShortcutKeys-
1103734620" class=" v-app chapter_4_menubar_and_shortcutkeys"> <div class=" v-app-
loading"></div> <noscript> You have to enable javascript in your browser to use an
application built with Vaadin. </noscript> </div> <script type="text/javascript"
src="./../../VAADIN/vaadinBootstrap.js"></script> <script type="text/javascript"></script>
</body> </html
为什么会发生这种情况?