当前位置:u赢电竞手机版 > u赢电竞竞猜app > (一)初识WebViewu赢电竞竞猜app

(一)初识WebViewu赢电竞竞猜app

文章作者:u赢电竞竞猜app 上传时间:2019-05-22

默认情况下,在WebView中是不能使用javascript的。可以通过书写下面的代码:

知识预热

  • Hybrid App

混合开发总是被大家提及,什么是混合开发?其实就是原生(nagtive) 网页(html),网页用WebView控件来展示。webview通过与html交互实现功能。html可以在不升级的情况下更新,而且适配android或者ios。这大大节省了开发时间。但它的致命弱点在用户体验上(在Android 4.4之前WebView内核采用了WebKit),但在android4.4及其之上WebView采用了google的chromium内核,体验也略有提升。如果有特定需求也可以使用开源web引擎Crosswalk。
具体详情如下:
HTML5、Web引擎与跨平台移动App开发
webview的版本详情
谈谈Android App混合开发
一篇文章读懂开源web引擎Crosswalk
crosswalk文档

  • WebView

它是android访问网页的一个控件,它提供了一系列方法例如加在网页,设置网页展示方式,设置背景色,设置是否获取焦点等

  • WebSettings

当WebView调用loadUrl方法加在网页时,系统会有一个默认的属性设置,我们可以通过WebSetting来得到这个设置对象,设置相应的属性。

  • WebViewClient,WebChromeClient

处理各种通知、请求事件

<br />


<br />

WebView myWebView = (WebView) findViewById(R.id.webview);
WebSettings webSettings = myWebView.getSettings();
webSettings.setJavaScriptEnabled(true);

基本用法

  • 使用WebView加载一个网页
    1.首先在布局文件中添加webview控件
    <WebView
    android:id="@ id/webview"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"/>
    2.webview加载网页使用loadUrl()
    调用动态网页
    WebView myWebView = (WebView) findViewById(R.id.webview);
    myWebView.loadUrl("http://www.baidu.com");
    调用静态网页,新建assets文件夹然后放入web.html静态页面
    WebView myWebView = (WebView) findViewById(R.id.webview);
    webView.loadUrl("file:///android_asset/web.html");
    3.在加载之前请在清单文件中添加网络权限
    <uses-permission android:name="android.permission.INTERNET" />

  • javaScript调用android的方法
    如果加载的网页使用了javaScript,此时必须开启脚本,这个时候才能与javaScript进行交互,默认情况下WebView禁用脚本。
    1.通过WebSettings开启脚本
    WebView myWebView = (WebView) findViewById(R.id.webview);
    WebSettings webSettings =myWebView.getSettings();
    webSettings.setJavaScriptEnabled(true);
    2.将android对象注入到网页让其调用弹出一个Toast
    首先在android中定义一个类WebAppInterface
    public class WebAppInterface {
    Context mContext;
    /** Instantiate the interface and set the context /
    WebAppInterface(Context c) {
    mContext = c;
    }
    /
    * Show a toast from the web page */
    @JavascriptInterface
    public void showToast(String toast) {
    Toast.makeText(mContext, toast, Toast.LENGTH_SHORT).show();
    }
    }
    注意:如果你的targetSdkVersions是17或者更高请加上@JavascriptInterface并且访问权限为public,如果不加javaScript或者访问权限为保密将调不到此方法
    3.将对象注入到网页中
    WebView webView = (WebView)findViewById(R.id.webview);
    webView.addJavascriptInterface(new WebAppInterface(this), "Android");
    addJavascriptInterface的第二个参数Android是javaScript调用WebAppInterface对象的别名。javaScript调用时千万不要写错别名了。js代码如下
    <input type="button" value="Say hello" onClick="showAndroidToast('Hello Android!')" />
    <script type="text/javascript">
    function showAndroidToast(toast) {
    Android.showToast(toast);
    }
    </script>
    注意:对象绑定到js,js调用对象的方法与注入之前对象不在同一个线程上了。
    危险:当webview开启脚本,让js调用android的方法会存在非常严重的安全问题。当加载不可靠的页面。此时不可靠页面即攻击者可以调用它选择的android端的任何代码。为了保证安全你必须确保调用的页面全是自己的。那么此时可以使用 WebViewClient进行筛选。
    4.检查浏览链接
    创建一个MyWebViewClient类继承WebViewClient的覆shouldOverrideUrlLoading
    private class MyWebViewClient extends WebViewClient {
    @Override
    public boolean shouldOverrideUrlLoading (WebView view, String url) {
    if (Uri.parse(url).getHost().equals("www.example.com")) {
    // This is my web site, so do not override; let my WebView load the page
    return false;
    }
    // Otherwise, the link is not for a page on my site, so launch another Activity that handles URLs
    Intent intent = new Intent(Intent.ACTION_VIEW, Uri.parse(url));
    startActivity(intent);
    return true;
    }
    }
    WebView设置setWebViewClient
    WebView myWebView = (WebView) findViewById(R.id.webview);
    myWebView.setWebViewClient(new MyWebViewClient());

<br />


<br />

然后就可以使用了。

参考

1 .Android API
2 .菜鸟网络
3 .webview详细使用

绑定javascript和Android代码:

例如:你可以在你的应用程序中创建一个类:

public class JavaScriptInterface {
    Context mContext;

    /** Instantiate the interface and set the context */
    JavaScriptInterface(Context c) {
        mContext = c;
    }

    /** Show a toast from the web page */
    public void showToast(String toast) {
        Toast.makeText(mContext, toast, Toast.LENGTH_SHORT).show();
    }
}

绑定javascript,定义的接口名称为Android。

WebView webView = (WebView) findViewById(R.id.webview);
webView.addJavascriptInterface(new JavaScriptInterface(this), "Android");

然后在你的HTML代码中写:

本文由u赢电竞手机版发布于u赢电竞竞猜app,转载请注明出处:(一)初识WebViewu赢电竞竞猜app

关键词: iOS开发 android基础知识