• 测试Android webview 加载本地html


    最近开发一个需要未联网功能的App, 不熟悉使用Java原生开发界面,于是想使用本地H5做界面,本文测试了使用本地html加载远程数据。直接上代码:

    MainActivity.java

    package com.alex.webviewlocal;
    
    import androidx.appcompat.app.AppCompatActivity;
    
    import android.os.Build;
    import android.os.Bundle;
    import android.webkit.CookieManager;
    import android.webkit.WebResourceRequest;
    import android.webkit.WebSettings;
    import android.webkit.WebView;
    import android.webkit.WebViewClient;
    
    import java.lang.reflect.InvocationTargetException;
    import java.lang.reflect.Method;
    
    public class MainActivity extends AppCompatActivity {
    
        private WebView webView;
        private String url="file:///android_asset/web/index.html";
    
        @Override
        protected void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
            webView = findViewById(R.id.webview);
            WebSettings webSettings = webView.getSettings();
            CookieManager cookieManager = CookieManager.getInstance();
            cookieManager.setAcceptCookie(true);
            webSettings.setJavaScriptEnabled(true); // 设置支持javascript
            webSettings.setUseWideViewPort(true);   // 将图片调整到适合webview的大小
            webSettings.setLoadWithOverviewMode(true);  // 缩放至屏幕的大小
            webSettings.setLayoutAlgorithm(WebSettings.LayoutAlgorithm.SINGLE_COLUMN);
            webSettings.setUserAgentString("User-Agent");
            webSettings.setLightTouchEnabled(true); // 设置用鼠标激活被选项
            webSettings.setBuiltInZoomControls(true);   // 设置支持缩放
            webSettings.setDomStorageEnabled(true); //设置DOM缓存,当H5网页使用localstorage时,一定要设置
            webSettings.setDatabaseEnabled(true);
            webSettings.setCacheMode(WebSettings.LOAD_NO_CACHE); // 设置去缓存,防止加载的为上一次加载的数据
            webSettings.setSupportZoom(true);   // 设置支持变焦
            webView.setHapticFeedbackEnabled(false);
            webSettings.setPluginState(WebSettings.PluginState.ON);
            webSettings.setAllowFileAccess(true);
            webSettings.setAllowContentAccess(true);
            webSettings.setAllowUniversalAccessFromFileURLs(true);
            webSettings.setAllowFileAccessFromFileURLs(true);
    
            webView.loadUrl(url);
    
    //        try{
    //            if(Build.VERSION.SDK_INT>=16){
    //                Class clazz = webView.getSettings().getClass();
    //                Method method = clazz.getMethod(
    //                        "setAllowUniversalAccessFromFileURLs", boolean.class);
    //                if(method!=null){
    //                    method.invoke(webView.getSettings(),true);
    //                }
    //            }
    //        } catch (NoSuchMethodException e) {
    //            throw new RuntimeException(e);
    //        } catch (InvocationTargetException e) {
    //            throw new RuntimeException(e);
    //        } catch (IllegalAccessException e) {
    //            throw new RuntimeException(e);
    //        }
    //
    //        webView.loadUrl(url);
    //        webView.setWebViewClient(new WebViewClient(){
    //            @Override
    //            public boolean shouldOverrideUrlLoading(WebView view, WebResourceRequest request) {
    //                return super.shouldOverrideUrlLoading(view, request);
    //            }
    //        });
    
        }
    }
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36
    • 37
    • 38
    • 39
    • 40
    • 41
    • 42
    • 43
    • 44
    • 45
    • 46
    • 47
    • 48
    • 49
    • 50
    • 51
    • 52
    • 53
    • 54
    • 55
    • 56
    • 57
    • 58
    • 59
    • 60
    • 61
    • 62
    • 63
    • 64
    • 65
    • 66
    • 67
    • 68
    • 69
    • 70
    • 71
    • 72
    • 73
    • 74
    • 75

    activity_main.xml

    
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">
    <WebView
        android:id="@+id/webview"
        android:layout_width="match_parent"
        android:layout_height="match_parent">WebView>
    LinearLayout>
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10

    h5 文件

    DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Documenttitle>
        <script src="./vue.min.js">script>
        <script src="./axios.min.js">script>
    head>
    <body>
        <div id="app">
            <h2>{{message}}h2>
            <ul>
                <li v-for="user in users" :key="user.id">{{user.name}}li>
            ul>
        div>
        <script>
            var app = new Vue({
                el:'#app',
                data(){
                    return {
                        message:'Hello Vue!',
                        users:[]
                    }
                },
                mounted(){
                    axios.get('https://jsonplaceholder.typicode.com/users').then(response => {
                        this.users = response.data
                    }).catch(error => {
                        console.log(error)
                    })
                }
            })
        script>
    body>
    html>
    
    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 8
    • 9
    • 10
    • 11
    • 12
    • 13
    • 14
    • 15
    • 16
    • 17
    • 18
    • 19
    • 20
    • 21
    • 22
    • 23
    • 24
    • 25
    • 26
    • 27
    • 28
    • 29
    • 30
    • 31
    • 32
    • 33
    • 34
    • 35
    • 36

    在这里插入图片描述
    最终效果:
    在这里插入图片描述

  • 相关阅读:
    C语言for循环高手小技巧
    Java 8新特性
    2022最新前端vue面试题
    【图像分割】基于布谷鸟算法实现二维Tsallis熵、kapur、oust多阈值图像分割附matlab代码
    SIT3232E:高静电防护 3.3V 单电源供电双通道 RS232 收发器
    什么是数据中心的测试负载?
    专精特新是指的哪些企业?专精特新通过有什么补贴?
    flink1.15源码笔记
    网络爬虫的意义:连接信息世界的纽带
    【Android -- 开发】初级工程师进阶
  • 原文地址:https://blog.csdn.net/xingkongtianyuzhao/article/details/133955192