WebView学习一

    xiaoxiao2021-03-25  13

    为了学习webview,打算从官网API学起。因为我英文不好,所以打算译下这篇文章,慢慢去认识这个控件。(官网地址)

    Building Web Apps in WebView

          如果你想要传送一个web的应用 或者 仅仅是一个web 页面作为一个应用客户端。你可以使用webview。这个webview的类是安卓的一个拓展的视图控件允许你在activity中显示你web页面作为你页面布局的一部分。它不包含任何一个充分发展有特色的web浏览器,例如导航控制或者 一个地址栏。webview所做的是,默认是显示一个web页面的。 一个很普遍的情况,当你想要在你的应用中展示信息的时候,使用webview是很有用的。也许你可能需要更新才能实现,例如一份终端用户协议或者一份使用者指南。在你android应用中,你可以创建一个含有webview控件的activity,然后可以使用它去展示你的在线文档。 另外一种情况是使用webview有帮助的是如果你的应用提供的数据总是来源于一个网络连接的话,例如email。在这种情况下,也许你会发现在你的android中建立一个webview 来展示带有用户数据 的web页面,而不是执行一个 网络请求,然后解析这些数据,然后在android页面中显示出来。相反,你可以设计一个web页面专为android设备 然后实现一个webview在你android应用中去加载这些web页面。   以下文档展示你如何开始使用一个webview  和做一些额外的事。例如处理页面导航和绑定js从web页面到android客户端应用。

    Adding a WebView to Your Application

    为了在你的应用中增加一个webview控件 ,仅仅只要在的布局中引入webview控件。例如下面的布局文件: <?xml version="1.0" encoding="utf-8"?> <WebView  xmlns:android="http://schemas.android.com/apk/res/android"     android:id="@+id/webview"     android:layout_width="fill_parent"     android:layout_height="fill_parent" /> 为了在webview中加载一个web页面,使用   loadUrl() . 例如: yWebView = (WebView) findViewById(R.id.webview); myWebView.loadUrl("http://www.example.com"); 为了让这个起作用,然而你的应用必须添加联网权限。为了得到联网权限, 需要在你的 manifest 文件使用 INTERNET  permission. 例如: <manifest ... >     <uses-permission android:name="android.permission.INTERNET" />     ... </manifest> 这些就是所有你需要webview的一个最基本功能,去展示一个web页面。

    Using JavaScript in WebView

    如果你在webview 中你计划加载的web页面需要用到js,你必须在webview中允许JAVAScript。一旦你允许js,你也能创建一个接口在你的android 代码 和js代码中。

    Enabling JavaScript

    默认情况下JAVASCRIPT是不能用的,你可以通过websettings连接着你的webview。你能得到 websettings对象通过webview 的getsettings()的方法,然后 设置JavaScript可用 通过使用   setJavaScriptEnabled()方法。 如: WebSettings  提供各种各样的设置,也许你会发现很有用的设置。例如,如果你开发一个web应用,它是专门为你android应用的webview设计。然后你可以定制一个用户代理 字符串通过使用setUserAgentString()方法,然后通过查询你的web页面中询用户代理,去验证客户端请求你的web页面是确实是你的android应用程序。 WebView myWebView = (WebView) findViewById(R.id.webview); WebSettings webSettings = myWebView.getSettings(); webSettings.setJavaScriptEnabled(true); When developing a web application that's designed specifically for the  WebView in your Android application, you can create interfaces between your JavaScript code and client-side Android code. For example, your JavaScript code can call a method in your Android code to display a  Dialog, instead of using JavaScript's  alert() function.

    To bind a new interface between your JavaScript and Android code, call addJavascriptInterface(), passing it a class instance to bind to your JavaScript and an interface name that your JavaScript can call to access the class.

    大概意思是这样的:

         当你想要在你安卓应用的webview上设置一个web的应用时,你能在你android和js之间创立一个接口。例如,你的js代码能够调用你安卓代码去显示一个对话框,而不是用js的alert()方法。

        为了去绑定一个新的接口在js和android之间,你需要调用addJavascriptInterface()方法,然后通过一个类的实例去绑定你的js, 然后js可以通过接口名字访问该类。

    例如,你可以引入如下的类在你的android 应用中:

    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(); } } 注意:如果你应用的targetSdkVersion是17或者更高  你 必须每个的js需要调用的android类中的方法上  加上    @JavascriptInterface,而且这个方法必须是public的。 如果你不加的话,这些方法将会无效的。

    在这个例子中,这个 WebAppInterface类允许网页去创建一个Toast通过使用showToast()方法。

    你可以绑定这个类到js通过在你的WebView 使用addJavascriptInterface()方法然后命名这个接口为‘Android’(名字是可以任意取的).例如:

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

    以上为js在webview运行中创建了一个名为android的接口。在这一点上,你的web应用已经拿到了WebAppInterface类的访问权了。例如,以下有一些html和js的代码片断 当用户点击一个按钮的时候,就会创建一个toast通过使用这个新的接口:

    <input type="button" value="Say hello" onClick="showAndroidToast('Hello Android!')" /> <script type="text/javascript"> function showAndroidToast(toast) { Android.showToast(toast); } </script>

    在js中是无需实例化这个叫‘Android’的接口,WebView已经自动让你在网页中可以使用。所以在你点击button的时候 ,这个showAndroidToast()方法 使用这个 ‘Android’接口 去调用 WebAppInterface.showToast()  方法。

    Note: 这个绑定的sj的对象是运行在另外一个线程的,而不是在构造的这个线程。

    Caution:使用addJavascriptInterface()允许js控制你的android应用。这可以是一个非常有用的特点,也可以是一个危险的安全问题。当这个HTML 在这个webview中靠不住的时候(例如,这个HTML是被一个不认识的人或者 不认识的程序提供的时候),这时候一个攻击者能引用这个HTML然后提交你的客户端的代码或任何他想要的代码。像这样,你就不应该使用 addJavascriptInterface() 方法,除非你能保证在你的webview中的这个HTML和js都是你写的。你也不应该允许用户在你的webview中导航到其他不属于你的网页(相反,在默认情况下允许用户的默认浏览器打开一个外链接,用户的web浏览器就会打开所有的url链接,所以要当心只有你在以下描述中处理页面的导航)。

    Handling Page Navigation

    当用记在你的webview中点击了一个链接,对于Android这个默认的行为是打开一个应用去处理URLS。通常,默认浏览器打开和加载到目的链接。然而你可以 在你的webview中打开这些链接,通过在 WebView中覆盖这个行为。你可以允许用户向前和后退导航通过网页的历史记录在你的webview中维护。 用户点击打开链接,只需要为你的WebView提供一个 WebViweClient,使用 setWebViewClient().例如: WebView myWebView = (WebView) findViewById(R.id.webview); myWebView.setWebViewClient(new WebViewClient());  就这样,现在用户所有点击的链接都会在你的WebView加载。  如果你想要更多的控制加载点击的链接,创建你自己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; } } 然后通过 new WebViewClient 为WebView去创建一个实例: WebView myWebView = (WebView) findViewById(R.id.webview); myWebView.setWebViewClient(new MyWebViewClient()); 现在当用户点击一个链接的时候,系统就会回调shouldOverrideUrlLoading()方法,然后可以检查是否这个url主机是否匹配你需要的链接主机地址。如果匹配的话,然后这个方法会返回false为了不重写这个url的链接的加载(它允许这个WebView 像往常一样加载url);如果这个url 的主机 和条件不匹配的话,然后我们可以创建一个意图去处理这个链接(这解决了用户默认的浏览器?);

    Navigating web page history

    当你的WebView 重写了url的加载,WebView就会自动的积累你的历史访问路径。你可以向前导航和向后导航通过 历史的 goBack()和goForward()方法。

    例如,以下例子是 展示 如何使你页面通过设置的回退按钮导航回去:

    @Override public boolean onKeyDown(int keyCode, KeyEvent event) { // Check if the key event was the Back button and if there's history if ((keyCode == KeyEvent.KEYCODE_BACK) && myWebView.canGoBack()) { myWebView.goBack(); return true; } // If it wasn't the Back key or there's no web page history, bubble up to the default // system behavior (probably exit the activity) return super.onKeyDown(keyCode, event); }

    这个 canGoBack()方法返回 true 如果那确实有访问的历史路径 的话, 同样的你能使用 canGoForward() 方法去检查是否有向前的访问路径.如果你不执行这个检查, 一旦用户到达历史路径的结尾, goBack() or goForward() 什么也做不了。

    转载请注明原文地址: https://ju.6miu.com/read-300382.html

    最新回复(0)