每天学习一点点，成功增加一大步

WebView加载（本地）网页

Android zhanghui 336℃

这次在做一个原生态+H5的混合型的 APP 项目，由于长时间没有做过 Android 的 APP 了，有些东西都遗忘了，曾着这次做这个项目的机会再重新的温故一下。

一、在布局文件中建立 WebView

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:background="@color/white">
    <WebView
        android:id="@+id/webview"
        android:layout_width="match_parent"
        android:layout_height="match_parent" >
    </WebView>
</LinearLayout>

二、在 Activity （或 Fragment）中初始及后续的操作

1、WebViewSettings: WebView相关配置的设置


private void setWebViewSettings() {
        //获取一个webviewsetting对象
        WebSettings setting = webview.getSettings();
        //支持JavaScript
        setting.setJavaScriptEnabled(true);
        //显示缩放控制工具
        setting.setDisplayZoomControls(true);
        //设置webview支持缩放
        setting.setSupportZoom(true);
        setting.setBuiltInZoomControls(true);
        //设置加载进来的页面自适应手机屏幕
        setting.setUseWideViewPort(true);
        setting.setLoadWithOverviewMode(true);
}

2、WebViewClient：辅助WebView处理各种通知与请求事件！

private void setWebClient() {

        webview.setWebViewClient(new WebViewClient() {

            public boolean shouldOverrideUrlLoading(WebView view, String url) {
                // TODO Auto-generated method stub
                view.loadUrl(url);
                return true;
            }

        });

}

3、将以上的代码融合起来

setWebViewSettings();
setWebClient();     
//要加载的页面   
webview.loadUrl("http://www.XXX.com");

如果加载的本项目中的H5页面，则 loadUrl 写成这样的代码：

webView.loadUrl("file:///android_asset/中间可自定义路径/index.html");

这里会引发一个问题：在 android studio 中没有找到 assets 目录，直接使用上述代码会无法找到这个文件。

解决方法是：

你要自己创建，创建方式为：依次展开工程下的 app 文件夹 -> src 文件夹，然后选中 main 文件夹，右键选择 New -> Folder -> Assets Folder，这样可就新建了 assets 文件夹了

这样就实现了加载网页的功能，注意页面会全部加载后才会显示出来。

2020.05.06 记载

今天遇到了一个特殊的问题，这个问题之前也没有遇到过，问题是这样：本地的 H5 在用 AJAX 访问线上服务器的资源时遇到了跨域权限的问题。直接抛出了以下的错误。
CONSOLE(0)] "Failed to load http://XXXXXX: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.", source: file:///android_asset/index.html (0)

起初是以为服务器端没有将权限打开，但检查后发现并不是这个的原因。于是在网上找了一下解决的方法是在 webView 的设置加入以下的设置代码： 

import android.os.Build;
……
// API >= 16
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.JELLY_BEAN) {
            webView.getSettings().setAllowUniversalAccessFromFileURLs(true);
        }

这个方法的含义是：是否允许file:// 协议下的js跨域加载http或者https的地址。
启用之后就无论是访问http的还是content的，还是file的，都没问题了，当然前提是html文件是放在本地的，

转载请注明：隨習筆記 » WebView加载（本地）网页

喜欢 (0)