javafx
WebView en WebEngine

Opmerkingen

Een pagina laden

WebView wv = new WebView();
WebEngine we = wv.getEngine();
we.load("https://stackoverflow.com");

WebView is de UI-shell rond de WebEngine . Bijna alle besturingselementen voor niet-UI-interactie met een pagina worden uitgevoerd via de klasse WebEngine .

Download de paginageschiedenis van een WebView

WebHistory history = webView.getEngine().getHistory();

De geschiedenis is eigenlijk een lijst met vermeldingen. Elk item vertegenwoordigt een bezochte pagina en biedt toegang tot relevante pagina-informatie, zoals URL, titel en de datum waarop de pagina voor het laatst is bezocht.

De lijst kan worden verkregen met behulp van de methode getEntries() . De geschiedenis en de bijbehorende lijst met vermeldingen veranderen terwijl WebEngine over het web navigeert. De lijst kan worden uitgebreid of verkleind, afhankelijk van browseracties. Deze wijzigingen kunnen worden beluisterd door de ObservableList API die in de lijst wordt weergegeven.

De index van het geschiedenisitem dat is gekoppeld aan de momenteel bezochte pagina wordt weergegeven door de currentIndexProperty() . De huidige index kan worden gebruikt om naar elk item in de geschiedenis te navigeren met behulp van de methode go(int) . De maxSizeProperty() stelt de maximale geschiedenisgrootte in, wat de grootte van de geschiedenislijst is

Hieronder ziet u een voorbeeld van het verkrijgen en verwerken van de lijst met items in de webgeschiedenis .

Een ComboBox (comboBox) wordt gebruikt om de geschiedenisitems op te slaan. Door een ListChangeListener op de WebHistory de ComboBox bijgewerkt naar de huidige WebHistory . Op de ComboBox bevindt zich een EventHandler die omleidt naar de geselecteerde pagina.

final WebHistory history = webEngine.getHistory();

comboBox.setItems(history.getEntries());
comboBox.setPrefWidth(60);
comboBox.setOnAction(new EventHandler<ActionEvent>() {
    @Override
    public void handle(ActionEvent ev) {
        int offset =
                comboBox.getSelectionModel().getSelectedIndex()
                - history.getCurrentIndex();
        history.go(offset);
    }
});

history.currentIndexProperty().addListener(new ChangeListener<Number>() {

    @Override
    public void changed(ObservableValue<? extends Number> observable, Number oldValue, Number newValue) {
        // update currently selected combobox item
        comboBox.getSelectionModel().select(newValue.intValue());
    }
});

// set converter for value shown in the combobox:
//   display the urls
comboBox.setConverter(new StringConverter<WebHistory.Entry>() {

    @Override
    public String toString(WebHistory.Entry object) {
        return object == null ? null : object.getUrl();
    }

    @Override
    public WebHistory.Entry fromString(String string) {
        throw new UnsupportedOperationException();
    }
});

verzend Javascript-waarschuwingen van de weergegeven webpagina naar het logboek van Java-toepassingen.

private final Logger logger = Logger.getLogger(getClass().getCanonicalName());

WebView webView = new WebView();
webEngine = webView.getEngine();

webEngine.setOnAlert(event -> logger.warning(() -> "JS alert: " + event.getData())); 

Communicatie tussen de Java-app en Javascript op de webpagina

Wanneer u een WebView gebruikt om uw eigen aangepaste webpagina weer te geven en deze webpagina Javascript bevat, kan het nodig zijn om een tweerichtingscommunicatie tot stand te brengen tussen het Java-programma en de Javascript op de webpagina.

Dit voorbeeld laat zien hoe een dergelijke communicatie in te stellen.

De webpagina geeft een invoerveld en een knop weer. Als u op de knop klikt, wordt de waarde uit het invoerveld verzonden naar de Java-toepassing, die deze verwerkt. Na verwerking wordt een resultaat verzonden naar de JavaScript die op zijn beurt het resultaat op de webpagina weergeeft.

Het basisprincipe is dat voor communicatie van Javascript naar Java een object in Java wordt gemaakt dat op de webpagina wordt ingesteld. En voor de andere richting, wordt een object gemaakt in Javascript en geëxtraheerd van de webpagina.

De volgende code toont het Java-gedeelte, ik heb het allemaal in één bestand bewaard:

package com.sothawo.test;

import javafx.application.Application;
import javafx.concurrent.Worker;
import javafx.scene.Scene;
import javafx.scene.web.WebEngine;
import javafx.scene.web.WebView;
import javafx.stage.Stage;
import netscape.javascript.JSObject;

import java.io.File;
import java.net.URL;

/**
 * @author P.J. Meisch ([email protected]).
 */
public class WebViewApplication extends Application {

    /** for communication to the Javascript engine. */
    private JSObject javascriptConnector;

    /** for communication from the Javascript engine. */
    private JavaConnector javaConnector = new JavaConnector();;

    @Override
    public void start(Stage primaryStage) throws Exception {
        URL url = new File("./js-sample.html").toURI().toURL();

        WebView webView = new WebView();
        final WebEngine webEngine = webView.getEngine();

        // set up the listener
        webEngine.getLoadWorker().stateProperty().addListener((observable, oldValue, newValue) -> {
            if (Worker.State.SUCCEEDED == newValue) {
                // set an interface object named 'javaConnector' in the web engine's page
                JSObject window = (JSObject) webEngine.executeScript("window");
                window.setMember("javaConnector", javaConnector);

                // get the Javascript connector object. 
                javascriptConnector = (JSObject) webEngine.executeScript("getJsConnector()");
            }
        });

        Scene scene = new Scene(webView, 300, 150);
        primaryStage.setScene(scene);
        primaryStage.show();

        // now load the page
        webEngine.load(url.toString());
    }

    public class JavaConnector {
        /**
         * called when the JS side wants a String to be converted.
         *
         * @param value
         *         the String to convert
         */
        public void toLowerCase(String value) {
            if (null != value) {
                javascriptConnector.call("showResult", value.toLowerCase());
            }
        }
    }
}

Wanneer de pagina is geladen, wordt een JavaConnector object (dat wordt gedefinieerd door de binnenklasse en gemaakt als een veld) op de webpagina ingesteld met deze aanroepen:

JSObject window = (JSObject) webEngine.executeScript("window");
window.setMember("javaConnector", javaConnector);

Het javascriptConnector object wordt opgehaald van de webpagina met

javascriptConnector = (JSObject) webEngine.executeScript("getJsConnector()");

Wanneer de methode toLowerCase(String) uit JavaConnector wordt aangeroepen, wordt de doorgegeven waarde geconverteerd en vervolgens teruggestuurd via het javascriptConnector object.

En dit is de html- en javascript-code:

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Sample</title>
    </head>
    <body>
        <main>
    
            <div><input id="input" type="text"></div>
            <button onclick="sendToJava();">to lower case</button>
            <div id="result"></div>
    
        </main>
    
        <script type="text/javascript">
            function sendToJava () {
                var s = document.getElementById('input').value;
                javaConnector.toLowerCase(s);
            };
    
            var jsConnector = {
                showResult: function (result) {
                    document.getElementById('result').innerHTML = result;
                }
            };
    
            function getJsConnector() {
                return jsConnector;
            };
        </script>
    </body>
</html>

De functie sendToJava roept de methode van de JavaConnector die is ingesteld door de Java-code:

function sendToJava () {
    var s = document.getElementById('input').value;
    javaConnector.toLowerCase(s);
};

en de functie die wordt aangeroepen door de Java-code om de javascriptConnector op te halen, retourneert gewoon het jsConnector object:

var jsConnector = {
    showResult: function (result) {
        document.getElementById('result').innerHTML = result;
    }
};
    
function getJsConnector() {
    return jsConnector;
};

Het argumenttype van de aanroepen tussen Java en Javascript is niet beperkt tot Strings. Meer informatie over de mogelijke typen en conversie vindt u in het JSObject API-document .