Android之webview详解_android onjscall

文章大纲

一、webview基本介绍
1.什么是webview
2.为什么要使用webview
3.webview基本操作

二、webview高级使用
1.WebView状态
2.资源加载
3.WebView加载优化
4.数据缓存
5.Android 和 JavaScript 交互
6.网页前进与后退
7.内存管理
8.Cookie操作
9.页面监听与拦截
10.定位设置
11.常见问题处理

三、参考文章

                                    

文章干货很长，请朋友耐心看下去肯定有收获，文末有福利放送

 

webview基本介绍

1.什么是webview

  WebView是Android中的原生UI控件，主要用于在app应用中方便地访问远程网页或本地html资源。同时，WebView也在Android中充当Java代码和JS代码之间交互的桥梁。实际上，也可以将WebView看做一个功能最小化的浏览器。

2.为什么要使用webview

  目前很多公司的 App 使用一个 WebView 作为网页加载， App 中的所有网页内容使用 HTML5 进行展示，这样只需要写一次 HTML5 代码，就可以在 Android 和 iOS 平台上运行，这就是所谓的跨平台 。随着 HTML5 的普及，很多 App 都会内嵌 WebView 来加载 HTML5 页面，即 原生和HTML5 共存，这就是当下最流行的「 混合开发 」。HTML5 最大的优势是迭代方便, 只需要修改服务端的 HTML5 页面，App 会同步更新，无论是做活动推广 App 还是及时修复 Bug 都带来的极大的便利。不过 HTML5 劣势也很明显，当网速不尽如人意时候，加载速度会很慢（不知道5G出现后结果会带来什么变革），也就是HTML5 加载受限于网络，没有原生控件流畅，用户体验相对较差， 所以目前完全使用 HTML5 开发 App 并没有成为主流。

3.webview基本操作

添加网络权限
在AndroidManifest.xml中添加以下内容

<uses-permission android:name="android.permission.INTERNET" />

新建webview_simple.xml布局

<?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">
 
    <WebView
        android:id="@+id/webview"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />
 
</LinearLayout>

在AndroidManifest.xml中注册WebViewActivity

<activity android:name=".WebViewActivity"></activity>

WebViewActivity中代码如下：

import android.app.Activity;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.webkit.WebView;
 
public class WebViewActivity extends AppCompatActivity {
 
    WebView webView;
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.webview_simple);
 
        webView = (WebView) findViewById(R.id.webview);
 
        //加载网页链接
        webView.loadUrl("https://www.baidu.com");
    }
}

主页面跳转代码如下：

import android.content.Intent;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import android.widget.Button;
 
import butterknife.BindView;
import butterknife.ButterKnife;
import butterknife.OnClick;
 
public class MainActivity extends AppCompatActivity {
 
    @BindView(R.id.button)
    Button button;
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
 
        ButterKnife.bind(this);
 
 
    }
 
    @OnClick({R.id.button, R.id.button2})
    public void onViewClicked(View view) {
 
        switch (view.getId()) {
 
            //简单webview加载
            case R.id.button:
 
                startActivity(new Intent(MainActivity.this, WebViewActivity.class));
 
                break;
        }
    }
}
 

运行截图如下所示：

                                                                   

                                                                       

网页弹窗

//message：alert弹出窗口中的提示信息（提示或警告信息对话框，仅一个确认按钮）
//result：向网页中的Javascript代码反馈本次操作结果(result.confirm代表点击了确定按钮，result.cancel代表点击了取消按钮)
public boolean onJsAlert(WebView view, String url, String message,JsResult result)
///message：confirm弹出窗口中的提示信息（确认对话框，有确认、取消两个按钮）
//result：向网页中的Javascript代码反馈本次操作结果(result.confirm代表点击了确定按钮，result.cancel代表点击了取消按钮)
public boolean onJsConfirm(WebView view, String url, String message,JsResult result)
 
//message：prompt弹出窗口中的提示信息（输入信息对话框，有一个输入框，还有确认、取消两个按钮）
//defaultVa