繁体   English   中英

使用基于Web的文本编辑器(例如在WebView内加载的summernote)时无法加载图像

[英]Can't load images when using a web-based text editor like summernote loaded inside a WebView #javafx

使用基于Web的文本编辑器一样,当不能加载图像或任何文件summernote一个的WebView #javafx内加载。

我注意到在浏览器中打开summernote.html文件时,加载图像/文件的工作正常,但是当我在{嵌入在我的项目中的)WebView中尝试加载图像/文件时,图像/文件无法在编辑器中加载。

在此处输入图片说明

texteditor.fxml

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.layout.StackPane?>
<?import javafx.scene.web.WebView?>


<StackPane xmlns="http://javafx.com/javafx/8.0.171" xmlns:fx="http://javafx.com/fxml/1" fx:controller="patient.froala.TextEditorController">
   <children>
      <WebView fx:id="wv_texteditor" minHeight="300.0" minWidth="992.0" prefHeight="-1.0" prefWidth="-1.0" />
   </children>
</StackPane>

控制器文件

package patient.summernote;

import javafx.application.Platform;
import javafx.fxml.FXML;
import javafx.fxml.Initializable;
import javafx.scene.web.WebEngine;
import javafx.scene.web.WebView;
import java.net.URL;
import java.util.ResourceBundle;

public class TextEditorController implements Initializable {

    @FXML private WebView wv_texteditor;

    @Override
    public void initialize(URL location, ResourceBundle resources) {

        Platform.runLater((()->{
            WebEngine webEngine=wv_texteditor.getEngine();
            webEngine.load(getClass().getResource("summernote.html").toExternalForm());

        }));
    }
}

summernote.html文件

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <!-- include libraries(jQuery, bootstrap) -->
    <!-- include libraries(jQuery, bootstrap) -->
    <link href="http://netdna.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.css" rel="stylesheet">
    <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.js"></script>
    <script src="http://netdna.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.js"></script>

    <!-- include summernote css/js -->
    <link href="http://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.11/summernote.css" rel="stylesheet">
    <script src="http://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.11/summernote.js"></script>
<body>

<div id="summernote">Hello Summernote</div>

<script>
    $(document).ready(function() {
        $('#summernote').summernote();
    });
</script>

</body>
</html>

经过数小时的测试,我发现了错误。

代码4 FileReader:不能读取文件或目录,通常是由于在获取对文件的引用之后发生的权限问题(例如,文件或目录被另一个应用程序同时锁定)。

所以我用Java从本地文件系统访问文件。 让文件然后通过WebView提供的(javascript-java)桥将其传递给summernote,我设法插入了图像😃。 在此处输入图片说明

btn_insertimg.setOnAction(event->{
                            File file=fileChooser.showOpenDialog(webview.getScene().getWindow());
                            if(file==null)
                                return;
                            System.out.println(file.getAbsolutePath());
                            String string= "file:\\" + file.getAbsolutePath();
                            //as the script eats the single backslash we should double it
                            //before doubling file:\C:\Users\Muhammad\Pictures\Army\1.jpg
                            //after doubling  file:\\C:\\Users\\Muhammad\\Pictures\\Army\\1.jpg
                            //without doubling file:C:UsersMuhammadPicturesArmy.jpg
                            string=string.replaceAll("\\\\","\\\\\\\\");
                            System.out.println(string);
                            webEngine.executeScript("insertImg('"+string+"','1.jpg')");
                        });

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM