Показать локальный файл HTML с JavaScript в виджете SWT Browser в RAP

Для моего RAP-проекта мне нужно показать несколько графиков. Поскольку я не нашел никакого виджета для этой цели, я планировал использовать виджет браузера, поэтому я могу использовать плагины JavaScript, такие как Highcharts или Chartsjs. Но я не могу заставить его работать. Если я установлю HTML-файл в browser.setUrl, виджет браузера ничего не покажет, даже простой HTML. Консоль JavaScript в Chrome говорит

Не разрешено загружать локальный ресурс

Если я ввожу HTML-код с помощью метода setText, он показывает HTML, но JavaScript не работает, он не загружает внешний JS-файл, такой как библиотека jQuery.

Нельзя ли это сделать таким образом? Или где моя неудача? (Извините за мой плохой английский, я не носитель языка.)

Вот Java-код, который я пробовал:

browser = new Browser(composite, SWT.NONE);
browser.setTouchEnabled(true);
browser.setBounds(10, 10, 358, 200);
browser.setUrl("D:\\STATS\\statistiken.html");

Или это:

File file = new File("D:\\STATS\\statistiken.html");
browser = new Browser(composite, SWT.NONE);
browser.setTouchEnabled(true);
browser.setBounds(10, 10, 358, 200);
browser.setUrl(file.toURI().toString());

Я пробовал и некоторые другие вещи, которые не работали.

С HTML в методе setText (я пробовал внешние библиотеки и локальные библиотеки в одной папке):

browser = new Browser(composite, SWT.NONE);
browser.setBounds(10, 10, 358, 200);
browser.setText(
    "<html>" +
    "<head>" +
        "<script src=\"https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js\"></script>" +
        "<script src=\"http://code.highcharts.com/highcharts.js\"></script>" +
        "<script src=\"http://code.highcharts.com/modules/exporting.js\"></script>" +
    "</head>" +
    "<body>" +
        "<p>Test</p>" +
        "<div id=\"container\" style=\"min-width: 400px; height: 400px; margin: 0 auto\"></div>" +
    "</body>" +
    "</htm>");

Надеюсь, кто-то может помочь мне с этой проблемой.


swt eclipse-rap
person Thomas Körner    schedule 02.07.2013    source источник

Ответы (1)


arrow_upward
4
arrow_downward

Локальные ссылки не будут разрешены, а внешние ссылки не будут загружены (проблема междоменного доступа) в вашем случае.

Я мог бы предложить вам 2 решения.

Решение 1:

Это полезно, когда у вас очень мало ресурсов (html, javascript, css) для рендеринга на Browser и нет Hyperlinks (при нажатии на который загружается другая страница).

Вы можете использовать Velocity. Прочтите это, чтобы начать использовать Velocity.

Вы можете иметь весь статический контент в Velocity Template и вводить в него динамический контент во время выполнения.

Вот отрывок из одного из моих проектов.

init.vm

 <html dir="ltr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style type="text/css">
.transcript {
    background-color: #d2d2d2;
}

.messageBlock {
    margin-left: 4px;
    margin-bottom: -15px;
}

.message {
    margin-left: 115px;
    word-wrap: break-word;
    white-space: -moz-pre-wrap;
    _white-space: pre;
    white-space: pre-wrap;
}
</style>

</head>
<script type="text/javascript">
function resizeChatWindow() { var divT = document.getElementById("divTranscript"); divT.style.height = (document.body.clientHeight - getTopAreaHeight()) + "px"; divT.style.width = (document.body.clientWidth) + "px"; divT.style.overflow = "auto"; divT.style.position = "absolute"; divT.style.left = "0px"; divT.style.top = getTopAreaHeight() + "px";}
 function getTopAreaHeight() { var chatAlert = document.getElementById("chatAlert"); if (chatAlert) { return chatAlert.clientHeight; } return document.getElementById("divBody").clientHeight;}
 isChat=false; window.onresize=resizeChatWindow;
</script>
<script type="text/javascript">
$scriptText
</script>

<script type="text/javascript">
function addChat(chatText){
    $("#divTranscript").append(chatText);

    $("#divTranscript").animate({ scrollTop: $("#divTranscript")[0].scrollHeight }, "slow");

}

</script>
    <body onload="resizeChatWindow();">
        <div id="divBody"></div>
        <div id="divTranscript">$history</div>
    </body>
</html>

VelocityUtils

private void init() throws Exception {
    ve = new VelocityEngine();
        Properties velocityProperties = new Properties();
        velocityProperties.put("resource.loader", "class");
        velocityProperties.put("class.resource.loader.description", "Velocity Classpath Resource Loader");
        velocityProperties.put("class.resource.loader.class", "org.apache.velocity.runtime.resource.loader.ClasspathResourceLoader");
        ve.init(velocityProperties);
        //ve.init();
}


public String getInitHtml(String history) throws ResourceNotFoundException, ParseErrorException, Exception {
    /* now render the template into a StringWriter */
    StringWriter writer = null;
    /* next, get the Template */
        Template t = ve.getTemplate("templates/init.vm","UTF-8");
        /* create a context and add data */
        VelocityContext context = new VelocityContext();
        String script = IOUtils.toString(VelocityUtils.class.getResourceAsStream("script/jquery.min.js"), "UTF-8");
        context.put("scriptText", script); //You can even have all the script content in init.vm rather than injecting it at runtime.
        context.put("history", StringUtils.defaultIfBlank(history, StringPool.BLANK));
        writer = new StringWriter();
        t.merge(context, writer);
        /* show the World */

    String returnMe = writer.toString();
    return returnMe;
}

установить возвращенный String в Browser.setText()

Решение 2:

Я объяснил это здесь.

person Niranjan    schedule 03.07.2013
comment
Скорость не работает. Если я правильно понял, нужно просто скопировать весь jQuery-код в документ, верно? Я также пробовал копировать и вставлять, но это тоже не сработало. Я не знаю, как настроить сервер причала в моем проекте. Но Eclipse запускает сервер сам по себе, так почему это должно что-то менять? - person Thomas Körner; 03.07.2013
comment
@ThomasKörner Ты прав! кстати, что значит не работает? У вас возникли проблемы с Velocity? Вы пытались просмотреть исходный html в браузере и увидеть, что вы ожидаете? Когда у меня работали скрипты с использованием Velocity, почему они не работают у вас? Если вы не можете запустить простой Jetty сервер по инструкции, то я вам ничем не помогу. Спасибо!! - person Niranjan; 04.07.2013
comment
Скорость работает правильно! Но JavaScript-код внутри init.vm не работает. Но с Browser#evaluate теперь все работает! Так что большое спасибо!!! - person Thomas Körner; 04.07.2013
comment
Для других с тем же вопросом: мне также нужно было поместить JS-файлы в тот же пакет, где находится VelocityUtils. - person Thomas Körner; 04.07.2013