首页 » 网站推广 » webview播放php音乐技巧_关于webview最具体讲解包含 h5 和android 交互

webview播放php音乐技巧_关于webview最具体讲解包含 h5 和android 交互

访客 2024-11-02 0

扫一扫用手机浏览

文章目录 [+]

微信,QQ空间等大量软件都内嵌了H5,不得不说是一种趋势。
Android与H5互调可以让我们的实现稠浊开拓,至于稠浊开拓便是在一个App中内嵌一个轻量级的浏览器,一部分原生的功能改为Html 5来开拓。

上风:利用H5实现的功能能够在不升级App的情形下动态更新,而且可以在Android或iOS的App上同时运行,节约了本钱,提高了开拓效率。

webview播放php音乐技巧_关于webview最具体讲解包含 h5 和android 交互

事理:实在便是Java代码和JavaScript之间的调用。

webview播放php音乐技巧_关于webview最具体讲解包含 h5 和android 交互
(图片来自网络侵删)

开局插入一张文章的目录构造:

WebView简介

要实现Android与H5互调,WebView是一个很主要的控件,WebView可以很好地帮助我们展示html页面,以是有必要先理解一下WebView。

一丶WebView常用方法

loadUrl加载界面,其次还有LoadData和LoadDataWithBase方法

//加载assets目录下的test.html文件webView.loadUrl(\"大众file:///android_asset/test.html\"大众);//加载网络资源(把稳要加上网络权限)webView.loadUrl(\公众http://blog.csdn.net\"大众);12341234setWebViewClient(如果用户设置了WebViewClient,则在点击新的链接往后就不会跳转到系统浏览器了,而是在本WebView中显示。
把稳:并不须要覆盖 shouldOverrideUrlLoading 方法,同样可以实现所有的链接都在 WebView 中打开。
)WebViewClient紧张用来赞助WebView处理各种关照、要求等事宜,通过setWebViewClient方法设置。
以下是它的几种常见用法:实现对网页中超链接的拦截(比如如果是极客导航的主页,则直接拦截转到百度主页): 当点击页面中的链接后,会在WebView加载URL前回调shouldOverrideUrlLoading(WebView view, String url)方法,一样平常点击一个链接此方法调用一次。

webView.setWebViewClient(new WebViewClient(){@Overridepublic boolean shouldOverrideUrlLoading(WebView view, String url) { if(\公众http://www.jikedaohang.com/\"大众.equals(url)) { view.loadUrl(\公众https://www.baidu.com/\"大众); } return true; } });12345678910111234567891011关于shouldOverrideUrlLoading返回值的误区:网上很多阐明是return true代表在本WebView中打开链接,return false代表调用系统浏览器打开链接。
实在只要设置了WebViewClient,则就不会调用系统浏览器。
那么shouldOverrideUrlLoading的返回值到底代表什么呢?return true,则在打开新的url时WebView就不会再加载这个url了,所有处理都须要在WebView中操作,包含加载;return false,则系统就认为上层没有做处理,接下来还是会连续加载这个url的;默认return false。
详细的差异展示如下: 加载百度主页,设置WebViewClient后,重写shouldOverrideUrlLoading(WebView view, String url)方法,第一张是返回false的截图(点击后正常跳转),第二章是返回true的截图(点击无反应,如果希望能够跳转,则须要我们自己进行处理):

还有一点须要把稳的是,如果我们拦截了某个url,那么return false 和 return true差异不大,以是一样平常建议 return false。
加载网页时更换某个资源(比如在加载一个网页时,须要加载一个logo图片,而我们想要更换这个logo图片,用我们assets目录下的一张图片替代) 我们知道我们在加载一个网页的同时也会加载js,css,图片等资源,以是会多次调用shouldInterceptRequest方法,我们可以在shouldInterceptRequest中进行图片更换。
把稳:shouldInterceptRequest有两个重载: ①public WebResourceResponse shouldInterceptRequest (WebView view, String url) 【已过期】 ②public WebResourceResponse shouldInterceptRequest (WebView view, WebResourceRequest request) 这两种方法紧张是第二个参数的不同,WebResourceRequest 将能够获取更多的信息,供应了getUrl(),getMethod,getRequestHeaders等方法。
这里紧张是为了展示效果,利用了第一种回调方法。
实现方法如下:

mWebView.setWebViewClient(new WebViewClient(){ @Override public WebResourceResponse shouldInterceptRequest(WebView view, String url) { WebResourceResponse response = null; if (url.contains(\"大众logo\"大众)) { try { InputStream logo = getAssets().open(\公众logo.png\"大众); response = new WebResourceResponse(\"大众image/png\"大众, \"大众UTF-8\"大众, logo); } catch (IOException e) { e.printStackTrace(); } } return response; } });123456789101112131415123456789101112131415设置开始加载网页、加载完成、加载缺点时处理

webView.setWebViewClient(new WebViewClient() { @Override public void onPageStarted(WebView view, String url, Bitmap favicon) { super.onPageStarted(view, url, favicon); // 开始加载网页时处理 如:显示\公众加载提示\公众 的加载对话框 ... } @Override public void onPageFinished(WebView view, String url) { super.onPageFinished(view, url); // 网页加载完成时处理 如:让 加载对话框 消逝 ... } @Override public void onReceivedError(WebView view, int errorCode, String description, String failingUrl) { super.onReceivedError(view, errorCode, description, failingUrl); // 加载网页失落败时处理 如:提示失落败,或显示新的界面 ... } }); 123456789101112131415161718192021222324123456789101112131415161718192021222324处理https要求,为WebView处理ssl证书设置WebView默认是不处理https要求的,须要在WebViewClient子类中重写父类的onReceivedSslError函数

webView.setWebViewClient(new WebViewClient() { @Override public void onReceivedSslError(WebView view, SslErrorHandler handler, SslError error) { handler.proceed(); // 接管信赖所有网站的证书 // handler.cancel(); // 默认操作 不处理 // handler.handleMessage(null); // 可做其他处理 } }); 123456789123456789setWebChromeClientWebChromeClient紧张用来赞助WebView处理Javascript的对话框、网站图标、网站标题以及网页加载进度等。
通过WebView的setWebChromeClient()方法设置。
显示页面加载进度在WebChromeClient子类中重写父类的onProgressChanged函数,progress表示当前页面加载的进度,为1至100的整数

webView.setWebChromeClient(new WebChromeClient() { public void onProgressChanged(WebView view, int progress) { setTitle(\"大众页面加载中,请稍候...\公众 + progress + \"大众%\公众); setProgress(progress 100); if (progress == 100) { //... } } }); 12345678910111234567891011加快HTML网页加载完成速率(默认情形html代码下载到WebView后,webkit开始解析网页各个节点,创造有外部样式文件或者外部脚本文件时,会异步发起网络要求下载文件,但如果在这之前也有解析到image节点,那势必也会发起网络要求下载相应的图片。
在网络情形较差的情形下,过多的网络要求就会造成带宽紧张,影响到css或js文件加载完成的韶光,造成页面空缺loading过久。
办理的方法便是见告WebView先不要自动加载图片,等页面finish后再发起图片加载。

//1.首先在WebView初始化时添加如下代码if(Build.VERSION.SDK_INT >= 19) { /对系统API在19以上的版本作了兼容。
由于4.4以上系统在onPageFinished时再规复图片加载时,如果存在多张图片引用的是相同的src时,会只有一个image标签得到加载,因而对付这样的系统我们就先直接加载。
/ webView.getSettings().setLoadsImagesAutomatically(true); } else { webView.getSettings().setLoadsImagesAutomatically(false); } //2.在WebView的WebViewClient子类中重写onPageFinished()方法添加如下代码: @Override public void onPageFinished(WebView view, String url) { if(!webView.getSettings().getLoadsImagesAutomatically()) { webView.getSettings().setLoadsImagesAutomatically(true); } } 12345678910111213141234567891011121314setDownloadListener常日webview渲染的界面中含有可以下载文件的链接,点击该链接后,该当开始实行下载的操作并保存文件到本地中。
创建DownloadListener

class MyDownloadListenter implements DownloadListener{ @Override public void onDownloadStart(String url, String userAgent,String contentDisposition, String mimetype, long contentLength) { //下载任务...,紧张有两种办法 //(1)自定义下载任务 //(2)调用系统的download的模块 Uri uri = Uri.parse(url); Intent intent = new Intent(Intent.ACTION_VIEW, uri); startActivity(intent); }}12345678910111234567891011给webview加入监听

webview.setDownloadListener(new MyDownloadListenter());11goBack()返回上一浏览页面,通过重写onKeyDown方法实现点击返回键返回上一浏览页面而非退出程序

public boolean onKeyDown(int keyCode, KeyEvent event) { //个中webView.canGoBack()在webView含有一个可退却撤退的浏览记录时返回true if ((keyCode == KeyEvent.KEYCODE_BACK) && webView.canGoBack()) { webView.goBack(); return true; } return super.onKeyDown(keyCode, event); }}1234567891012345678910

二丶WebSettings配置

获取WebSettings工具

WebSettings webSettings = webView.getSettings();

常用设置方法(1)支持js

settings.setJavaScriptEnabled(true);

(2)设置缓存办法,紧张有以下几种: LOAD_CACHE_ONLY: 不该用网络,只读取本地缓存数据。
LOAD_DEFAULT: 根据cache-control决定是否从网络上取数据。
LOAD_CACHE_NORMAL: API level 17中已经废弃, 从API level 11开始浸染同LOAD_DEFAULT模式。
LOAD_NO_CACHE: 不该用缓存,只从网络获取数据。
LOAD_CACHE_ELSE_NETWORK:只要本地有,无论是否过期,或者no-cache,都利用缓存中的数据。

settings.setCacheMode(WebSettings.LOAD_NO_CACHE);

(3)开启DOM storage API功能(HTML5 供应的一种标准的接口,紧张将键值对存储在本地,在页面加载完毕后可以通过 JavaScript 来操作这些数据。

settings.setDomStorageEnabled(true);

(4)设置数据库缓存路径

settings.setDatabasePath(cacheDirPath);

(5)设置Application Caches缓存目录

settings.setAppCachePath(cacheDirPath);

(6)设置默认编码

settings.setDefaultTextEncodingName(“utf-8”);

(7)将图片调度到适宜webview的大小

settings.setUseWideViewPort(false);

(8)支持缩放

settings.setSupportZoom(true);

(9)支持内容重新布局

settings.setLayoutAlgorithm(WebSettings.LayoutAlgorithm.SINGLE_COLUMN);

(10)多窗口

settings.supportMultipleWindows();

(11)设置可以访问文件

settings.setAllowFileAccess(true);

(12)当webview调用requestFocus时为webview设置节点

settings.setNeedInitialFocus(true);

(13)设置支持缩放

settings.setBuiltInZoomControls(true);

(14)支持通过JS打开新窗口

settings.setJavaScriptCanOpenWindowsAutomatically(true);

(15)缩放至屏幕的大小

settings.setLoadWithOverviewMode(true);

(16)支持自动加载图片

settings.setLoadsImagesAutomatically(true);

三丶WebViewClient 的回调方法列表

WebViewClient紧张用来赞助WebView处理各种关照、要求等事宜,通过setWebViewClient方法设置。

(1)更新历史记录

doUpdateVisitedHistory(WebView view, String url, boolean isReload)

(2)运用程序重新要求网页数据

onFormResubmission(WebView view, Message dontResend, Message resend)

(3)在加载页面资源时会调用,每一个资源(比如图片)的加载都会调用一次。

onLoadResource(WebView view, String url)

(4)开始载入页面调用,常日我们可以在这设定一个loading的页面,见告用户程序在等待网络相应。

onPageStarted(WebView view, String url, Bitmap favicon)

(5)在页面加载结束时调用。
同样道理,我们知道一个页面载入完成,于是我们可以关闭loading 条,切换程序动作。

onPageFinished(WebView view, String url)

(6)报告缺点信息

onReceivedError(WebView view, int errorCode, String description, String failingUrl)

(7)获取返复书息授官僚求

onReceivedHttpAuthRequest(WebView view, HttpAuthHandler handler, String host,String realm)

(8)重写此方法可以让webview处理https要求。

onReceivedSslError(WebView view, SslErrorHandler handler, SslError error)

(9)WebView发生改变时调用

onScaleChanged(WebView view, float oldScale, float newScale)

(10)Key事宜未被加载时调用

onUnhandledKeyEvent(WebView view, KeyEvent event)

(11)重写此方法才能够处理在浏览器中的按键事宜。

shouldOverrideKeyEvent(WebView view, KeyEvent event)

(12)在网页跳转时调用,这个函数我们可以做很多操作,比如我们读取到某些分外的URL,于是就可以不打开地址,取消这个操作,进行预先定义的其他操作,这对一个程序是非常必要的。

shouldOverrideUrlLoading(WebView view, String url)

(13)在加载某个网页的资源的时候多次调用(已过期)

shouldInterceptRequest(WebView view, String url)

(14)在加载某个网页的资源的时候多次调用

shouldInterceptRequest(WebView view, WebResourceRequest request)

把稳:

shouldOverrideUrlLoading在网页跳转的时候调用,且一样平常每跳转一次只调用一次。

shouldInterceptRequest只假如网页加载的过程中均会调用,资源加载的时候都会回调该方法,会多次调用。

四丶WebChoromeClient的回调方法列表

WebChromeClient紧张用来赞助WebView处理Javascript的对话框、网站图标、网站标题以及网页加载进度等。
通过WebView的setWebChromeClient()方法设置。

(1)监听网页加载进度

onProgressChanged(WebView view, int newProgress)

(2)监听网页标题 : 比如百度页面的标题是“百度一下,你就知道”

onReceivedTitle(WebView view, String title)

(3)监听网页图标

onReceivedIcon(WebView view, Bitmap icon)

Java和JavaScript互调

为方便展示,利用addJavascriptInterface办法实现与本地js交互(存在漏洞)。
也可通过其他办法实现,比如拦截ur进行参数解析l等。

Java调JS

首先是JS的一段代码:

function javaCallJs(arg){ document.getElementById(\"大众content\公众).innerHTML = (\"大众欢迎:\"大众+arg ); }12341234然后是在java中调用JS中的方法

webView.loadUrl(\公众javascript:javaCallJs(\"大众+\公众'\"大众+name+\"大众'\"大众+\公众)\"大众);11

以上代码便是调用了JS中一个叫javaCallJs(arg)的方法,并传入了一个name参数。
(详细效果下面有展示)

JS调java

配置Javascript接口

webView.addJavascriptInterface(new JSInterface (),\公众Android\"大众);1212实现Javascript接口类

class JSInterface { @JavascriptInterface public void showToast(String arg){ Toast.makeText(MainActivity.this,arg,Toast.LENGTH_SHORT).show(); }}123456123456JS中调用java代码

<input type=\"大众button\"大众 value=\公众点击Android被调用\"大众 onclick=\"大众window.Android.showToast('JS中传来的参数')\"大众/>11

window.Android.showToast(‘JS中传来的参数’)”中的”Android”即addJavascriptInterface()中指定的,并且JS向java通报了参数,类型为String。
而showToast(String arg)会以Toast的形式弹出此参数。

java与JS互调代码示例

先看效果图:

不好意思,传错了,是这张:

代码非常大略,并且加了注释,直接看代码就可以了。

首先是本地的JavaAndJavaScriptCall.html文件,放在asstes目录下

<html><head> <meta http-equiv=\"大众Content-Type\"大众 content=\"大众text/html;charset=UTF-8\公众> <script type=\"大众text/javascript\公众> function javaCallJs(arg){ document.getElementById(\"大众content\"大众).innerHTML = (\公众欢迎:\"大众+arg ); } </script></head><body> <div id=\"大众content\"大众> 请在上方输入您的用户名</div> <input type=\"大众button\"大众 value=\公众点击Android被调用\"大众 onclick=\"大众window.Android.showToast('JS中传来的参数')\"大众/></body></html>12345678910111213141516171234567891011121314151617

javaCallJs是java调用JS的方法,showToast方法是JS调用java的方法

接下来是布局文件,activity_main.xml

<?xml version=\公众1.0\公众 encoding=\公众utf-8\"大众?><LinearLayout xmlns:android=\公众http://schemas.android.com/apk/res/android\"大众 xmlns:tools=\公众http://schemas.android.com/tools\"大众 android:id=\"大众@+id/ll_root\"大众 android:layout_width=\公众match_parent\"大众 android:layout_height=\"大众match_parent\"大众 android:orientation=\公众vertical\公众 tools:context=\公众.MainActivity\"大众> <LinearLayout android:layout_width=\"大众match_parent\"大众 android:layout_height=\"大众wrap_content\"大众 android:orientation=\公众horizontal\"大众 android:padding=\"大众20dp\"大众 android:background=\"大众#000088\公众> <EditText android:id=\"大众@+id/et_user\公众 android:layout_width=\公众0dp\公众 android:layout_height=\"大众wrap_content\"大众 android:hint=\"大众输入WebView中要显示的用户名\"大众 android:background=\"大众#008800\"大众 android:textSize=\公众16sp\"大众 android:layout_weight=\公众1\公众/> <Button android:layout_width=\公众wrap_content\"大众 android:layout_height=\"大众wrap_content\"大众 android:layout_marginLeft=\公众40dp\"大众 android:layout_marginRight=\"大众20dp\"大众 android:textSize=\"大众16sp\"大众 android:text=\"大众确定\公众 android:onClick=\公众click\公众/> </LinearLayout> </LinearLayout>1234567891011121314151617181920212223242526272829303132333412345678910111213141516171819202122232425262728293031323334

很大略,便是一个输入框和一个确定按钮,点击按钮会调用JS中的方法。

MainActivity

package com.wangjian.webviewdemo; import android.annotation.SuppressLint;import android.support.v7.app.AppCompatActivity;import android.os.Bundle;import android.view.View;import android.view.ViewGroup;import android.webkit.JavascriptInterface;import android.webkit.WebSettings;import android.webkit.WebView;import android.webkit.WebViewClient;import android.widget.EditText;import android.widget.LinearLayout;import android.widget.Toast; public class MainActivity extends AppCompatActivity { private WebView webView; private LinearLayout ll_root; private EditText et_user; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); ll_root = (LinearLayout) findViewById(R.id.ll_root); et_user = (EditText) findViewById(R.id.et_user); initWebView(); } //初始化WebView private void initWebView() { //动态创建一个WebView工具并添加到LinearLayout中 webView = new WebView(getApplication()); LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT); webView.setLayoutParams(params); ll_root.addView(webView); //不跳转到其他浏览器 webView.setWebViewClient(new WebViewClient() { @Override public boolean shouldOverrideUrlLoading(WebView view, String url) { view.loadUrl(url); return true; } }); WebSettings settings = webView.getSettings(); //支持JS settings.setJavaScriptEnabled(true); //加载本地html文件 webView.loadUrl(\"大众file:///android_asset/JavaAndJavaScriptCall.html\公众); webView.addJavascriptInterface(new JSInterface(),\"大众Android\公众); } //按钮的点击事宜 public void click(View view){ //java调用JS方法 webView.loadUrl(\公众javascript:javaCallJs(\"大众 + \"大众'\"大众 + et_user.getText().toString()+\"大众'\"大众+\公众)\"大众); } //在页面销毁的时候将webView移除 @Override protected void onDestroy() { super.onDestroy(); ll_root.removeView(webView); webView.stopLoading(); webView.removeAllViews(); webView.destroy(); webView = null; } private class JSInterface { //JS须要调用的方法 @JavascriptInterface public void showToast(String arg){ Toast.makeText(MainActivity.this,arg,Toast.LENGTH_SHORT).show(); } }}12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879801234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980

须要把稳的地方

参考链接:安卓webview的一些坑

webView.addJavascriptInterface()方法在API 17之前有一些漏洞(有兴趣的可以参考本篇文章,WebView 远程代码实行漏洞浅析),以是在API 17往后,须要在JavaScript接口类的方法加上@JavascriptInterface表明。
仔细看的话你会创造我们上面的WebView工具并不是直接写在布局文件中的,而是通过一个LinearLayout容器,利用addview(webview)动态向里面添加的。
其余须要把稳创建webview须要利用applicationContext而不是activity的context,销毁时不再霸占activity工具,末了离开的时候须要及时销毁webview,onDestory()中该当先从LinearLayout中remove掉webview,再调用webview.removeAllViews();webview.destory();如果想要webView在产生OOM的时候不影响主进程,可以另开一个进程,在androidmanifest.xml的activity标签里加上Android:process属性就可以了。
在activity被杀去世之后,依然保持webView的状态,方便用户下次打开的时候可以回到之前的状态。
webview支持saveState(bundle)和restoreState(bundle)方法。
保存状态

@Override protected void onSaveInstanceState(Bundle outState) { super.onSaveInstanceState(outState); wv.saveState(outState); Log.e(TAG, \"大众save state...\公众); } 123456123456

规复状态(在activity的onCreate(bundle savedInstanceState)里)

if(null!=savedInstanceState){ wv.restoreState(savedInstanceState); Log.i(TAG, \"大众restore state\"大众); }else{ wv.loadUrl(\"大众http://3g.cn\"大众); } 123456123456

其他一些常见问题:

1. WebViewClient.onPageFinished()。

你永久无法确定当WebView调用这个方法的时候,网页内容是否真的加载完毕了。
当前正在加载的网页产生跳转的时候这个方法可能会被多次调用,StackOverflow上有比较详细的阐明(How to listen for a Webview finishing loading a URL in Android?), 但个中列举的办理方法并不完美。
以是当你的WebView须要加载各种各样的网页并且须要在页面加载完成时采纳一些操作的话,可能WebChromeClient.onProgressChanged()比WebViewClient.onPageFinished()都要靠谱一些。

2. WebView后台耗电问题。

当你的程序调用了WebView加载网页,WebView会自己开启一些线程(?),如果你没有精确地将WebView销毁的话,这些残余的线程(?)会一贯在后台运行,由此导致你的运用程序耗电量居高不下。
对此我采取的处理办法比较偷

3. 切换WebView闪屏问题。

如果你须要在同一个ViewGroup中来回切换不同的WebView(包含了不同的网页内容)的话,你就会创造闪屏是不可避免的。
这该当是Android硬件加速的Bug,如果关闭硬件加速这种情形会好很多,但无法得到很好的浏览体验,你会觉得网页滑动的时候一卡一卡的,不跟手。

4. 在某些手机上,Webview有视频时,activity销毁后,视频资源没有被销毁,乃至还能听到在后台播放。
即便是像刚才那样各种销毁webview也无济于事,办理办法:在onDestory之前修正url为空地址。

5.WebView硬件加速导致页面渲染闪烁问题

关于Android硬件加速 开始于Android 3.0 (API level 11),开启硬件加速后,WebView渲染页面更加快速,拖动也更加顺滑。
但有个副浸染便是随意马虎会涌现页面加载白块同时界面闪烁征象。
办理这个问题的方法是设置WebView暂时关闭硬件加速 代码如下:

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB) {

webview.setLayerType(View.LAYER_TYPE_SOFTWARE, null);

}

标签:

相关文章