android与H5交互和一些交互过程中的问题

最新推荐文章于 2024-03-23 04:39:40 发布

不再皱眉✔

最新推荐文章于 2024-03-23 04:39:40 发布

阅读量324

点赞数 1

分类专栏： android 文章标签： java webview

本文链接：https://blog.csdn.net/hellojavastring/article/details/105333624

版权

android 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

今天来记录一下关于android与h5交互的内容满足日常需求,带参数传值的,我也是业务中的需求,解决了问题决定记录一下~
声明:都可以复制直接拿来用的~
认真看注释哦~
认真看注释哦~
认真看注释哦~
认真看注释哦~
重要的事情说四遍！

public class MainActivity extends AppCompatActivity {
	
    @SuppressLint("JavascriptInterface")
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        //找资源id  WebView 
        final WebView webView = findViewById(R.id.webview);
	
        //设置支持js
        WebSettings webSettings = webView.getSettings();
        webSettings.setJavaScriptEnabled(true);


        Button bt_jump = findViewById(R.id.bt_jump);
        //通过点击加载网页
        bt_jump.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                //加载网页
                webView.loadUrl("https://www.baidu.com/");
            }
        });

        //加载网络网页
        //webView.loadUrl("https://www.baidu.com/");

        //加载本地网页 //本地网页路径file:///android_asset
        //先把你的工程切换为Project模式 在src/main文件夹下建立一个assets的资源文件夹,放入本地html
        webView.loadUrl("file:///android_asset/login.html");

        //设置弹出对话框
        webView.setWebChromeClient(new WebChromeClient() {
            @Override
            public boolean onJsAlert(WebView view, String url, String message, JsResult result) {
                //默认是不弹出对话框 返回false会弹出对话框
                return false;
            }
        });


        //android调js方法

        webView.setOnLongClickListener(new View.OnLongClickListener() {
            @Override
            public boolean onLongClick(View v) {
               // android调js无参方法
                webView.loadUrl("javascript:login()");
				//android 调用js方法带参数 helloword会传到H5页面
				// webView.loadUrl("javascript:login(\"HelloWord\")");
				//这个myString 支持一些需要上传网页内容 private String myString = "";
				//webView.loadUrl("javascript:test1(\"" + myString + "\")");
                return false;
            }
        });


        //js调用android方法
       //添加支持js调用android方法
       //这个的this 可以换成一个类 例如: new UserBean()在里面定义android的方法也可以 第二个参数 android 是一个双方都认识的标识 这个需要跟你的H5同事进行沟通定义
        webView.addJavascriptInterface(this,"android");
		


    }

    //定义android方法
    //添加注解，showUserInfo方法是H5页面也有的方法 在这里相当于重写,但是不是重写,方法不对的话 js调用不到android的showUserInfo方法
  /**  @JavascriptInterface
    public void showUserInfo(){
        Toast.makeText(this, "js调用android方法", Toast.LENGTH_SHORT).show();
    } */
    //定义带参数的方法
 @JavascriptInterface
    public void showUserInfo(String name,String pwd){
        Toast.makeText(this, "js调用android方法" + name + pwd, Toast.LENGTH_SHORT).show();
    }
   
    
}

上面android这边介绍完了下面贴一个h5页面把简单版的

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>登录</title>
	</head>
	
	<style type="text/css">
		div.crm{
			position: absolute;
			top: 20%;
			left: 20%;
			
		}
		.username{
			background:#00ff96;
			width: 200px;
			height:20px ;
		}
		.password{
			background: #00FF96;
			width: 200px;
			height:20px ;
			
		}
		.login{
			position: absolute;
			left: 40%;
		}
		
	</style>
	<body>
		<div class="crm">
		<h1>这是一个网站登录页面</h1>	
			
		<form>
			用户名<input name="name" type="text" class="username" id="username"/><br />
			密&nbsp&nbsp&nbsp&nbsp码<input name="pwd" type="password" class="password" id="password"/> <br/>
			<input type="button" value="登录" class="login" onclick="login()"/>
			
			
		</form>	
		</div>
		
	</body>
	<script type="text/javascript">
		function login(){
			var name =document.getElementById('username').value;
		  var pwd =document.getElementById('password').value;
			android.showUserInfo(name,pwd);
			//android.showUserInfo();
			alert("用户名："+name+",密码："+pwd);
			
		}
		
	</script>
</html>

满足刚入门的开发人员需求啦~

关于这个js交互还有一些小问题,下面我啰嗦两句
有些需求是不想用自带的浏览器加载网页
那么你可以设置禁用

 webView.setWebViewClient(new WebViewClient() {
            @Override
            public boolean shouldOverrideUrlLoading(WebView view, String url) {
                view.loadUrl(url);
                return true;
            }
        });

原文链接

xml是通过一个线性布局addView()

WebView  web  = new WebView(this);
layout.addView(web);
//这样就可以加载网页了
web.loadUrl("http://www.baidu.com")

1.关于有些网页加载不出来的原因
听说天猫的网页加载不出来，报错原因是

chromium: [INFO:CONSOLE(1)] "Uncaught TypeError: Cannot read property 'getItem'

可以试试这个代码

webView.getSettings().setDomStorageEnabled(true);

原文链接,关于这个报错的详细解释
然而,还没有结束,你设置完这个代码后,会出现网页比屏幕大的情况
然后你再设置下代码

//设置适应屏幕
        mWebView.getSettings().setUseWideViewPort(true);
        mWebView.getSettings().setLoadWithOverviewMode(true);
        mWebView.getSettings().setSupportZoom(true);
        mWebView.getSettings().setBuiltInZoomControls(true);
        mWebView.getSettings().setDisplayZoomControls(false);

这是原作者
原文链接
记录代码的漫长之路~

不再皱眉✔

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
2
评论
android与H5交互和一些交互过程中的问题

今天来记录一下关于android与h5交互的内容满足日常需求,带参数传值的,我也是业务中的需求,解决了问题决定记录一下~public class MainActivity extends AppCompatActivity { @SuppressLint("JavascriptInterface") @Override protected void onCreate...
复制链接

扫一扫