

windowsでjavaFXのwebviewの中のjavascriptからjavaという経路で処理をする場合の効率のよいデバック方法を教えてください。

javascriptから実行されるjavaは以下の様になっています。

[code]

    window = (JSObject) webArea.getEngine().executeScript("window");
    
    // JavaScriptとJavaのI/F
    window.setMember("app", this.app);
    
[/code]

javascriptの部分のみクロームなどでデバックは可能ですが、そこからjavaを呼出せず困っています。（javascriptのデバックを中心にしたいので、webviewでのjavascriptのデバック方法があれば、その方法でもかまいません）

また、開発環境はインターネットには接続していません。  
（インターネット接続マシンと開発環境は別の環境にあります）

＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝  
2015/4/23 追記

回答のコメントを記入しようとしましたが、文字数オーバーのため  
質問に追記します。

回答を元に以下のプログラムをインターネット環境でテスト的に作成しましたが、デバッカーの画面が開きません。  
また、htmlがローカルなので、Firebug Liteのパスをローカルにしてもデバッカーの画面が開きません  
なぜでしょうか？

[code]

    public class Main extends Application {
    
        private String appName;
        protected Stage stage;
        private static Main instance;
    
        // 画面サイズの初期値
        public static final int DEFALUT_WIN_WIDTH = 1024;
        public static final int DEFALUT_WIN_HEIGHT = 500;
        // 画面サイズの最小値
        public static final int MINIMUM_WIN_WIDTH = 250;
        public static final int MINIMUM_WIN_HEIGHT = 75;
    
        /**
         * Mainクラスのインスタンスを返します。
         * 
         * @return
         */
        public static Main getInstance() {
            return instance;
        }
    
        /**
         * ステージを返します。
         * 
         * @return
         */
        public Stage getStage() {
            return this.stage;
        }
    
        @Override
        public void start(Stage primaryStage) {
            try {
                Main.instance = this;
                this.stage = primaryStage;
    
                showView();
    
            } catch (Exception e) {
                Platform.exit();
            }
        }
    
        public static void main(String[] args) {
            launch(args);
        }
    
        void showStage() {
            String strTitle = getAppName();
    
            // タイトルの設定
            this.stage.setTitle(strTitle);
            // 画面最小サイズの設定
            this.stage.setMinWidth(MINIMUM_WIN_WIDTH);
            this.stage.setMinHeight(MINIMUM_WIN_HEIGHT);
            // 表示
            this.stage.show();
        }
    
        protected void showView() {
            Parent root;
            try {
                root = FXMLLoader.load(getClass().getClassLoader().getResource("test/view/Main.fxml"));
                Scene scene = new Scene(root, DEFALUT_WIN_WIDTH, DEFALUT_WIN_HEIGHT);
                this.stage.setScene(scene);
                showStage();
            } catch (IOException e) {
                // TODO 自動生成された catch ブロック
                e.printStackTrace();
            }
        }
    
        public String getAppName() {
            return this.appName;
        }
    }
    
    
    public class WebViewController implements Initializable {
        @FXML
        WebView webArea;
    
        WebEngine engine = null;
        JSObject window = null;
    
        String url = null;
    
        @Override
        public void initialize(URL arg0, ResourceBundle arg1) {
    
            engine = webArea.getEngine();
    
            String appPath;
            appPath = System.getProperty("user.dir");
            final String html = File.separator + "WebContent" + File.separator + "main-view.html";
            url = "file:///" + appPath + html;
    
            engine.setJavaScriptEnabled(true);
    
            // 初期表示
            engine.load(url);
        }
    
        // Firebugを起動するボタンを用意し、このメソッドを呼び出すと仮定します
        @FXML
        void handleFirebugButtonAction(ActionEvent event) {
            if (engine.getDocument() != null) {
                // ダウンロードしたFirebug Liteの展開物に含まれているfirebug-lite.jsのURLを指定する
                String firebugLiteUrl = "https://getfirebug.com/firebug-lite.js#startOpened";
                Document document = engine.getDocument();
                Element scriptElement = document.createElement("script");
                scriptElement.setAttribute("type", "text/javascript");
                scriptElement.setAttribute("src", firebugLiteUrl);
                NodeList bodyList = document.getElementsByTagName("body");
                if (bodyList != null && bodyList.getLength() > 0) {
                    bodyList.item(0).appendChild(scriptElement);
                }
            }
        }
    }
    
    <AnchorPane styleClass="Animation_bg" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1">
      <children>
         <fx:include source="webArea.fxml" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0"/>
      </children>
    </AnchorPane>
    
    <AnchorPane style="-fx-background-color: #FFFFFF;" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1" fx:controller="test.view.WebViewController">
      <children>
           <WebView fx:id="webArea" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0" />
    
           <Button onAction="#handleFirebugButtonAction"
                 text="Firebug"
                 AnchorPane.topAnchor="0.0" 
                 AnchorPane.leftAnchor="0.0" />
    
      </children>
    </AnchorPane>
    
[/code]


CC BY-SA 3.0
2015-04-09T04:38:11.203
8932
2015-07-22T10:02:33.000
2015-04-23T08:25:52.367
4578
4578
question
javascript java jquery
windowsでjava webview→javascript→javaでのデバック方法


使われているのは JavaFX の WebView ということでよろしいですよね？

WebView 上のコンテンツの JavaScript をデバッグしたいのならば Firebug Lite を利用するのが良いかもしれません。  
<https://getfirebug.com/firebuglite>

Firebug Lite のブックマークレットの URL を `WebEngie#executeScript()` で呼び出せば、WebView 上で
Firebug Lite が起動するはずです。

(追記)  
インターネットに接続不可能な環境であるとのことでしたので、その場合の対応方法を考えてみました。  
Firebug Lite は[ここ](https://getfirebug.com/releases/lite/latest/firebug-
lite.tar.tgz)からダウンロードすることができます。これをローカルに配置して読み込ませるようにすればいいのですが、JavaFX の WebView
は Web ページを表示している際に、同時のローカルのコンテンツを読み込むことができないような仕様になっています
([ここの説明が参考になります](http://www.hos.co.jp/blog/20130805/)) 。

そこで、イントラ環境に Web サーバを立てて、そこからダウンロードした Firebug Lite のコンテンツを参照できるようにし、JavaFX
アプリから参照すれば良いでしょう。

[code]

    // Firebugを起動するボタンを用意し、このメソッドを呼び出すと仮定します
    @FXML
    void handleFirebugButtonAction(ActionEvent event) {
        if (webEngine.getDocument() != null) {
            // ダウンロードしたFirebug Liteの展開物に含まれているfirebug-lite.jsのURLを指定する
            String firebugLiteUrl = "http://example/firebug-lite/build/firebug-lite.js#startOpened";
            Document document = webEngine.getDocument();
            Element scriptElement = document.createElement("script");
            scriptElement.setAttribute("type", "text/javascript");
            scriptElement.setAttribute("src", firebugLiteUrl);
            NodeList bodyList = document.getElementsByTagName("body");
            if (bodyList != null && bodyList.getLength() > 0) {
                bodyList.item(0).appendChild(scriptElement);
            }
        }
    }
    
[/code]

JavaFX は `WebEngine#getDocument()` メソッドで WebView に表示しているコンテンツの DOM
にアクセスできます。それを利用し、Firebug Lite の JavaScript コードを読み込む `<script>` 要素を DOM
に追加しています (URL の末尾に `#startOpened` を追記することで、いきなり起動するようになります) 。

別途 Web サーバを立てる必要がありますが、これならインターネットにつながらない環境でも Firebug Lite を起動することができます。


CC BY-SA 3.0
2015-04-10T01:20:33.687
8977
2015-04-16T09:51:56.023
2015-04-16T09:51:56.023
3374
3374
8932
answer