时间戳

首页 > 解决方案 > Android webview 无法加载 javascript 和 css 文件

java - Android webview 无法加载 javascript 和 css 文件

问题描述

我有一个 Angular Web 应用程序，我想在我的 android 应用程序的 WebView 中本地运行它。打开应用程序时，我得到一个空白屏幕。

打开 chrome 检查工具时，我在 .js 和 .css 文件上收到 net::ERR_FILE_NOT_FOUND 错误，因此找到了 index.html 文件，但未加载 index.html 文件中引用的其他文件.

看起来它在错误的目录中查找文件，这很奇怪，因为所有文件都存在于 assets 文件夹中。

编码：

        setContentView(R.layout.activity_main);

        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
            WebView.setWebContentsDebuggingEnabled(true);
        }

        wv = findViewById(R.id.webView);;
        wv.getSettings().setSaveFormData(true);
        wv.getSettings().setJavaScriptEnabled(true);
        wv.getSettings().setLoadWithOverviewMode(true);
        wv.getSettings().setBuiltInZoomControls(false);
        wv.getSettings().setDatabaseEnabled(true);
        wv.getSettings().setAppCacheEnabled(true);
        wv.getSettings().setDomStorageEnabled(true);
        wv.getSettings().setAllowContentAccess(true);
        wv.getSettings().setAllowFileAccessFromFileURLs(true);
        wv.getSettings().setAllowUniversalAccessFromFileURLs(true);
        wv.setWebContentsDebuggingEnabled(true);
        wv.setWebViewClient(new WebViewClient());

        wv.loadUrl("file:///android_asset/index.html");

我已经尝试了其他 SO 主题的几件事，但我就是无法让它工作。

html文件：

!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Homecontrol</title>
  <base href="/">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
  <link rel="manifest" href="manifest.webmanifest">
  <meta name="theme-color" content="#1976d2">
  <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500&display=swap" rel="stylesheet">
  <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link rel="stylesheet" href="styles.6b8a2f2753f016f4d661.css"></head>
<body>
  <app-root></app-root>
  <noscript>Please enable JavaScript to continue using this application.</noscript>
<script src="runtime-es2015.edb2fcf2778e7bf1d426.js" type="module"></script><script src="runtime-es5.edb2fcf2778e7bf1d426.js" nomodule defer></script><script src="polyfills-es5.ef4b1e1fc703b3ff76e3.js" nomodule defer></script><script src="polyfills-es2015.2987770fde9daa1d8a2e.js" type="module"></script><script src="main-es2015.9c4c062fd851d4ee0231.js" type="module"></script><script src="main-es5.9c4c062fd851d4ee0231.js" nomodule defer></script></body>
</html>

标签： javaandroidangular

解决方案

我设法通过将以下代码添加到 WebView 配置来使其工作。

wv.setWebViewClient(new WebViewClient() {

            public String getMimeType(String url) {
                String type = null;
                String extension = MimeTypeMap.getFileExtensionFromUrl(url);
                if (extension != null) {
                    if (extension.equals("js")) {
                        return "text/javascript";
                    }
                    else if(extension.equals("html")) {
                        return "text/html";
                    }
                    else if (extension.equals("woff")) {
                        return "application/font-woff";
                    }
                    else if (extension.equals("woff2")) {
                        return "application/font-woff2";
                    }
                    else if (extension.equals("ttf")) {
                        return "application/x-font-ttf";
                    }
                    else if (extension.equals("eot")) {
                        return "application/vnd.ms-fontobject";
                    }
                    else if (extension.equals("svg")) {
                        return "image/svg+xml";
                    }
                    type = MimeTypeMap.getSingleton().getMimeTypeFromExtension(extension);
                }
                return type;
            }

            @SuppressLint("NewApi")
            @Override
            public WebResourceResponse shouldInterceptRequest(final WebView view, String url) {
                if(url.contains(baseUrl)) {
                    url = url.replace(baseUrl, "");

                    try {
                        return new WebResourceResponse(getMimeType(url), "UTF-8", getAssets().open(url));
                    } catch (IOException e) {
                        e.printStackTrace();
                    }
                }
                return null;
            }
        });


        wv.loadUrl(baseUrl + "index.html");

推荐阅读