Question

我如何从本地资产文件夹中将自定义css和js文件注入flutter Webview中例如：

<html>
<head>
<link rel="stylesheet" href="bootstrap.min.css">
<script src="jquery-3.2.1.min.js"></script>
<script src="bootstrap.min.js"></script>

<script type="text/javascript">
</script>
    $(document).ready(function() {
        try {
            console.log("onReady called...");
        } catch(err) {
            onError("Error in On Ready Function..! "+err.message);
        }
    });
</head>
</html>

Answer 1

您可以使用evalJavascript函数并使用JS代码注入CSS。

例如

var myJsCode = ```
   let linkElement = document.createElement('link');
   linkElement.setAttribute('rel', 'stylesheet');
   linkElement.setAttribute('type', 'text/css');
   linkElement.setAttribute('href', 'data:text/css;charset=UTF-8,' + encodeURIComponent('[url to css file]'));
```;

flutterWebviewPlugin.evalJavascript(myJsCode)

要从本地资产文件夹加载，您可以先将文件读入字符串并以类似方式注入。

我如何从本地资产文件夹中的Flutter WebView中注入自定义CSS和JS文件

1 个答案: