Andord 使用Webview调用H5 html文件及跳转页面的问题
- 背景:使用Android+H5混合开发APP,并从云服务器获取APP数据。Android调用H5代码需要使用
WebView接口,首先使用Android Studio或其它idea创建一个Android原生项目(本示例使用Android Studio),将左侧的目录显示类型切换至“Project”,如图:
并在与JAVA主程序所在目录的同级目录下新建一个assets目录来放置前端代码和静态资源,如图:
然后在MainActivity.java中引入并调用WebView,并使用类似
webView.loadUrl("file:///android_asset/web/index.html");
来调用html文件,file:///android_asset/ 即对应之前创建的assets目录。
MainActivity.java中完整调用代码:
package com.example.myapplication001;
import androidx.appcompat.app.AppCompatActivity;
import android.view.View;
import android.webkit.JavascriptInterface;
import android.webkit.WebView;
import android.webkit.WebViewClient;
public class MainActivity extends AppCompatActivity {
private WebView webView;
@SuppressLint("SetJavaScriptEnabled")
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//加载页面
webView = (WebView) findViewById(R.id.webview);
//允许JavaScript执行
webView.getSettings().setJavaScriptEnabled(true);
//找到Html文件,也可以用网络上的文件
webView.loadUrl("file:///android_asset/web/index.html");
}
}
同时在layout的activity_main.xml中定义WebView组件:
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<WebView
android:id="@+id/webview"
android:layout_width="match_parent"
android:layout_height="match_parent"></WebView>
</androidx.constraintlayout.widget.ConstraintLayout>
此时启动APP就会使用webView.loadUrl() 中html文件里所展示的页面了,应用js等静态文件使用相对路径即可。
运行app后,因为有一步验证是否登录的操作,如果未登录则跳转至login.html,让用户进行登录操作,发现没有正常跳转。
- 问题描述:Android Webview调用的html中 URL重定向失效,如:
window.location.href="./login.html";
经过一番文档查询,最终发现需要注册一个WebViewClient来监听管理webView中的事件,这其中也包括URL重定向的事件,详细文档地址:https://blog.csdn.net/harvic880925/article/details/51523983
这里我们只需要监听URL重定向事件即可:
webView.setWebViewClient(new WebViewClient(){
@Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
webView.loadUrl(url);
return false;
}
});
这里要注意return false;即为让Webview自己处理URL,return true 的话WebView接下来就不会再加载这个URL,声明后重新打包APP并在Android模拟器上运行就能正常跳转页面啦,这里也包括其它网络链接。
完整代码:
package com.example.myapplication001;
import androidx.appcompat.app.AppCompatActivity;
import android.view.View;
import android.webkit.JavascriptInterface;
import android.webkit.WebView;
import android.webkit.WebViewClient;
public class MainActivity extends AppCompatActivity {
private WebView webView;
@SuppressLint("SetJavaScriptEnabled")
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//加载页面
webView = (WebView) findViewById(R.id.webview);
//允许JavaScript执行
webView.getSettings().setJavaScriptEnabled(true);
//找到Html文件,也可以用网络上的文件
webView.loadUrl("file:///android_asset/web/index.html");
webView.setWebViewClient(new WebViewClient(){
@Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
webView.loadUrl(url);
return false;
}
});
}
}