Javascript 创建其他人可以嵌入其网站的GWT小部件？_Javascript_Gwt_Iframe

Javascript 创建其他人可以嵌入其网站的GWT小部件？

javascript gwt iframe

Javascript 创建其他人可以嵌入其网站的GWT小部件？,javascript,gwt,iframe,Javascript,Gwt,Iframe,我已经在GWT中创建了一个小部件，我希望能够为用户提供一小段HTML，他们可以将其嵌入到他们的网站中，这样我的小部件就会呈现在那里我不认为iframe是合适的，因为其中一个要求是，点击我的小部件上的任何链接都会将用户带到我的网站（而不仅仅是更改iframe的内容）任何帮助都将不胜感激另外，我尝试嵌入以下内容，但没有成功：我认为现在不可能这样做。但将来你可以用它来做但是有可能使用导出GWT/JavaAPI。这使得自动创建JavaScript API成为可能。使用此选项导出一个文件。您可

我已经在GWT中创建了一个小部件，我希望能够为用户提供一小段HTML，他们可以将其嵌入到他们的网站中，这样我的小部件就会呈现在那里

我不认为iframe是合适的，因为其中一个要求是，点击我的小部件上的任何链接都会将用户带到我的网站（而不仅仅是更改iframe的内容）

任何帮助都将不胜感激

另外，我尝试嵌入以下内容，但没有成功：

我认为现在不可能这样做。但将来你可以用它来做

但是有可能使用导出GWT/JavaAPI。这使得自动创建JavaScript API成为可能。使用此选项导出一个文件。您可以在中找到关于它的教程。

这是可能的。代码片段需要如下所示

<script src="yourmodule.nocache.js"></script>
<div id="foo"/>

您需要小心不要踩到外部页面的样式，反之亦然，但编译后的CSS应该会有很大帮助

这是用于在Google API文档中嵌入API浏览器的技术。

在NetBeans GWT项目中

mycss.css:

body, html,div.wrap-frame{ 
    margin: 0;
    padding: 0;
    widht: 100%;
    height: 100%;}body{
    background: white;
}

.row1or3 {
    width: 100%;
    height: 10%;
    background: blue;
    text-align: center;
}

.row2{
    width: 100%;
    height: 80%;
    background: yellow;
    text-align: center;
    display:flex;
}

.wrapper{
   width:100%;
   height: 100%;
}

.box{
    float:left; 
    height: 100%;
}

.box:nth-child(1){
    width:25%;
    background-color:red;
}

.box:nth-child(2){
    width:50%;
    background-color:green;
}

.box:nth-child(3){
    width:25%;
    background-color:yellow;
}

welcomeGWT.html

<html>
<head>
    <script id=ft type="text/javascript"  src="org.yournamehere.Main/org.yournamehere.Main.nocache.js"></script>
    <meta name='gwt:module' content='org.yournamehere.Main=org.yournamehere.Main'>
    <link rel="stylesheet" href="mycss.css"> 
</head>
<body>
    <div class="row1or3"> Row1
    </div>

    <div class="row2">
        <div class="wrapper">
            <div class="box">
                Left Side Menu
            </div>
            <div class="box" id="mydiv"> 
            </div>
            <div class="box">
                Right Side Menu
            </div>
        </div>
    </div>

    <div class="row1or3">
        Row3
    </div>
</body>

现在，您可以将任何html页面的任何div元素命名为id=mydiv，并添加已编译的GWT jscript。

我已经测试过了。

这个gwt出口商听起来确实很有希望。在接下来的几天里，我会和它玩一玩，让你知道我过得怎么样。我已经试过了，但我无法让它发挥作用。我在部署了一个应用程序。这完全按照您上面的建议实现。然后我将下面的html嵌入到另一个站点中，但运气不好：好吧，它没有显示我的整个脚本标记，所以我在上面的主要问题中包含了它尝试添加到您的模块gwt xmlnote jason写道，您需要包含html入口点，而不是.js文件，这是一个打字错误。包括nocache.js，就像您在自己的站点中使用它一样。

<html>
<head>
    <script id=ft type="text/javascript"  src="org.yournamehere.Main/org.yournamehere.Main.nocache.js"></script>
    <meta name='gwt:module' content='org.yournamehere.Main=org.yournamehere.Main'>
    <link rel="stylesheet" href="mycss.css"> 
</head>
<body>
    <div class="row1or3"> Row1
    </div>

    <div class="row2">
        <div class="wrapper">
            <div class="box">
                Left Side Menu
            </div>
            <div class="box" id="mydiv"> 
            </div>
            <div class="box">
                Right Side Menu
            </div>
        </div>
    </div>

    <div class="row1or3">
        Row3
    </div>
</body>

public class MainEntryPoint implements EntryPoint {

/**
 * Creates a new instance of MainEntryPoint
 */
public MainEntryPoint() {
}

/**
 * The entry point method, called automatically by loading a module that
 * declares an implementing class as an entry-point
 */
public void onModuleLoad() {
    final Label label = new Label("Hello, GWT!!!");
    final Button button = new Button("Click me!");

    button.addClickHandler(new ClickHandler() {
        public void onClick(ClickEvent event) {
            label.setVisible(!label.isVisible());
        }
    });

    RootPanel root = RootPanel.get("mydiv");
   root.add(button);
    root.add(label);
}
}