JS和Android本地方法之间的调用

最新推荐文章于 2023-10-20 22:16:48 发布
最新推荐文章于 2023-10-20 22:16:48 发布
阅读量1.5k 收藏
点赞数 2
文章标签： android javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/u011586609/article/details/52294306
版权

      最近在学习JS和Android本地方法之间的调用，上网查了好多资料，这里总结一下，便于像我一样的新手借鉴，学习。

     首先，打开编辑工具，新建一个Android项目，我这就叫JS和Android本地方法之间的调用了。

    fragment_main.xml  布局代码：

<span style="font-family: Arial; font-size: 14px; line-height: 26px;"><span style="font-size: 18px; color: rgb(255, 0, 0);"><textarea readonly="readonly" name="code" class="xml"> </span></span>

<span style="font-family: Arial; font-size: 14px; line-height: 26px;"><span style="font-size: 18px; color: rgb(255, 0, 0);"><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:gravity="center"
    tools:context="com.example.js2android.MainActivity$PlaceholderFragment" >


    <Button
        android:id="@+id/changeWorld"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="#00ff00"
        android:text="Native调用JS方法" />
    <WebView 
        android:id="@+id/web_test"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        />
</LinearLayout>
</span></span>
<span style="font-family: Arial; font-size: 14px; line-height: 26px;"><span style="font-size: 18px; color: rgb(255, 0, 0);"><span style="font-family: Arial; font-size: 18px; line-height: 26px;"><span style="color: rgb(255, 0, 0);"></textarea></span></span>
</span></span>
<span style="font-family: Arial; font-size: 14px; line-height: 26px;"><span style="font-size: 18px; color: rgb(255, 0, 0);">
</span></span>

           初始化控件：

<span style="font-family: Arial; font-size: 14px; line-height: 26px;"><span style="font-size: 18px; color: rgb(255, 0, 0);"><textarea readonly="readonly" name="code" class="java"> </span></span>

<span style="font-family: Arial; font-size: 14px; line-height: 26px;"><span style="font-size: 18px; color: rgb(255, 0, 0);"></span></span><pre name="code" class="html">//初始化控件
            View rootView = inflater.inflate(R.layout.fragment_main, container, false);
            changeWorld = (Button) rootView.findViewById(R.id.changeWorld);
            changeWorld.setOnClickListener(this);
            mWebView = (WebView) rootView.findViewById(R.id.web_test);

 

<span style="font-family: Arial; font-size: 14px; line-height: 26px;"><span style="font-size: 18px; color: rgb(255, 0, 0);"></textarea></span></span>
 

</pre><p></p><p>给webview添加本地操作接口及设置参数：</p><p></p><pre name="code" class="html"><span style="font-family: Arial; font-size: 14px; line-height: 26px;"><span style="font-size: 18px; color: rgb(255, 0, 0);"><textarea readonly="readonly" name="code" class="java"> </span></span>

 

<span style="font-family: Arial; font-size: 14px; line-height: 26px;"><span style="font-size: 18px; color: rgb(255, 0, 0);"> //给webview添加本地操作接口
           //实例化NativeInterface接口对象
            nif = new NativeInterface(getActivity());
           //设置参数
            mWebView.getSettings().setBuiltInZoomControls(true);
            mWebView.getSettings().setJavaScriptEnabled(true);
          //内容的渲染需要webviewChromClient去实现，设置webviewChromClient基类
    <span style="white-space:pre">		</span>mWebView.setWebChromeClient(new WebChromeClient());
    <span style="white-space:pre">		</span>//给webview添加本地操作接口
    <span style="white-space:pre">		</span>//把实例化的NativeInterface接口对象nif绑定到全局的nif上，nif的作用域是全局的，初始化后可随处使用
    <span style="white-space:pre">		</span>mWebView.addJavascriptInterface(nif, "nif");
</span></span>
 

<span style="font-family: Arial; font-size: 14px; line-height: 26px;"><span style="font-size: 18px; color: rgb(255, 0, 0);"><span style="font-size: 18px; line-height: 26px;"></textarea></span>
</span></span>
 

 


  加载本地html： 

 

 
 
<span style="font-family: Arial; font-size: 14px; line-height: 26px;"><span style="font-size: 18px; color: rgb(255, 0, 0);"><textarea readonly="readonly" name="code" class="java"> </span></span>

 
 
<span style="font-family: Arial; font-size: 14px; line-height: 26px;"><span style="font-size: 18px; color: rgb(255, 0, 0);"> //加载本地html
    <span style="white-space:pre">		</span>mWebView.loadUrl("file:///android_asset/index.html");
</span></span>
 
 
<span style="font-family: Arial; font-size: 14px; line-height: 26px;"><span style="font-size: 18px; color: rgb(255, 0, 0);"></textarea></span></span>
 
 
 

 


  NativeInterface.java代码： 
 
 

 

 
 
<span style="font-family: Arial; font-size: 14px; line-height: 26px;"><span style="font-size: 18px; color: rgb(255, 0, 0);"><textarea readonly="readonly" name="code" class="java"> </span></span>

 
 
<span style="font-family: Arial; font-size: 14px; line-height: 26px;"><span style="font-size: 18px; color: rgb(255, 0, 0);"> public class NativeInterface {
<span style="white-space:pre">	</span>
<span style="white-space:pre">	</span>private Context context;


<span style="white-space:pre">	</span>public NativeInterface(Context context) {
<span style="white-space:pre">		</span>this.context = context;
<span style="white-space:pre">	</span>}
<span style="white-space:pre">	</span>@JavascriptInterface
<span style="white-space:pre">	</span>public void changeWorld(){
<span style="white-space:pre">		</span>MainActivity activity=(MainActivity) context;
<span style="white-space:pre">		</span>activity.count=0;
<span style="white-space:pre">		</span>activity.handler.removeMessages(0);
<span style="white-space:pre">		</span>activity.showToast("JS调用Native方法");
<span style="white-space:pre">	</span>}
}
</span></span>
 
 
<span style="font-family: Arial; font-size: 14px; line-height: 26px;"><span style="font-size: 18px; color: rgb(255, 0, 0);"></textarea></span></span>
index.html代码： 
 
 

 

 
 
<span style="font-family: Arial; font-size: 14px; line-height: 26px;"><span style="font-size: 18px; color: rgb(255, 0, 0);"><textarea readonly="readonly" name="code" class="html"> </span></span>

 
 
<span style="font-family: Arial; font-size: 14px; line-height: 26px;"><span style="font-size: 18px; color: rgb(255, 0, 0);"> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html40/strict.dtd">
<HTML>
<HEAD>
<meta name="viewport" content="width=device-width, target-densitydpi=device-dpi" />
<META http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script>
   function showMsg(){
      alert("Native调用JS方法!");
   }
   function showMsgInAndroid(){
    nif.changeWorld();
   }
</script>
</HEAD>
<BODY>
<span>JS调用Native方法的演示</span>


<button id='btntest' οnclick='showMsgInAndroid()'>JS调用Native方法</button>
</BODY>
</HTML>
</span></span>
 
 
<span style="font-family: Arial; font-size: 14px; line-height: 26px;"><span style="font-size: 18px; color: rgb(255, 0, 0);"></textarea></span></span>
 
 
 

 


  js调用的本地方法： 

 

 
 
<span style="font-family: Arial; font-size: 14px; line-height: 26px;"><span style="font-size: 18px; color: rgb(255, 0, 0);"><textarea readonly="readonly" name="code" class="java"> </span></span>

 
 
<span style="font-family: Arial; font-size: 14px; line-height: 26px;"><span style="font-size: 18px; color: rgb(255, 0, 0);"> public Handler handler=new Handler(){
<span style="white-space:pre">	</span>public void handleMessage(android.os.Message msg) {
<span style="white-space:pre">		</span>switch (msg.what) {
<span style="white-space:pre">		</span>case 0:
<span style="white-space:pre">			</span>if(count<20){
<span style="white-space:pre">				</span>showToast(stringmsg+"..."+count);
<span style="white-space:pre">			</span>}
<span style="white-space:pre">			</span>break;


<span style="white-space:pre">		</span>default:
<span style="white-space:pre">			</span>break;
<span style="white-space:pre">		</span>}
<span style="white-space:pre">		</span>
<span style="white-space:pre">		</span>
<span style="white-space:pre">	</span>};
};


     public String stringmsg;
     public int count;
<span style="white-space:pre">	</span>public void showToast(String string) {
<span style="white-space:pre">		</span>stringmsg = string;
<span style="white-space:pre">		</span>Toast.makeText(this, string, 0).show();
<span style="white-space:pre">		</span>count++;
<span style="white-space:pre">		</span>handler.sendEmptyMessageDelayed(0, 2000);
<span style="white-space:pre">	</span>}
</span></span>
 
 
<span style="font-family: Arial; font-size: 14px; line-height: 26px;"><span style="font-size: 18px; color: rgb(255, 0, 0);"></textarea></span></span>
本地按钮点击事件调用js代码： 

 

 
 
<span style="font-family: Arial; font-size: 14px; line-height: 26px;"><span style="font-size: 18px; color: rgb(255, 0, 0);"><textarea readonly="readonly" name="code" class="java"> </span></span>

 
 
<span style="font-family: Arial; font-size: 14px; line-height: 26px;"><span style="font-size: 18px; color: rgb(255, 0, 0);"> @Override
<span style="white-space:pre">		</span>public void onClick(View v) {
<span style="white-space:pre">			</span>mWebView.loadUrl("javascript:showMsg()");
<span style="white-space:pre">		</span>}
</span></span>
 
 
<span style="font-family: Arial; font-size: 14px; line-height: 26px;"><span style="font-size: 18px; color: rgb(255, 0, 0);"></textarea></span></span>
好了，就分享到这里了。新手手写，大神勿喷。 

 

 
 
 

 


  最后附上源码免费下载地址：http://download.csdn.net/detail/u011586609/9610946 

 

 

 

 


                

        

        

    

  


    

      

        

            

              
                
                  霸佔祢啲嘴
                
              
            

            

                关注
              
            

        

        

          
      

      









                



	

		

			

				
					
js调用android本地方法的实现

				
			

			

				

					12-28
				

			

		

		

			
				
js通过webview调用android的本地方法，避免addJavascriptInterface问题

			
		

	



                

              
                



	

		

			

				
					
Android中调用js方法及js中调用本地方法

				
			

			

				

					08-08
				

			

		

		

			
				
Android中调用js方法及js中调用本地方法，简单明了

			
		

	



                


  
              

                


	

		

			

				
					
js调用android 方法

					
最新发布

				
			

			

				

					weixin_42504805的博客
				

				

					10-20
					
					632
					
				

			

		

		

			
				
【代码】js调用android 方法。

			
		

	





	

		

			

				
					
JS调用Android方法

				
			

			

				

					lnny的博客
				

				

					11-14
					
					1055
					
				

			

		

		

			
				
记录一下下自己的成长啦啦。。莫要嫌弃
需求：H5界面传递了一些数据给客户端接收。。。 H5需要调用客户端的方法
   1.首先设置客户端支持JS

WebSettings webSettings = mWebView.getSettings();
//设置WebView属性，能够执行Javascript脚本
webSettings.setJavaScriptEnabled(true);

			
		

	



		

			
		



	

		

			

				
					
js调用安卓方法

				
			

			

				

					qq_36552707的博客
				

				

					06-12
					
					1820
					
				

			

		

		

			
				
步骤1：加载JS代码，如下：
index.html

以.html格式放到src/main/assets文件夹里


<!DOCTYPE html>
<html>
   <head>
      <meta charset="utf-8">
      <title>Carson_Ho</title>
   </hea...

			
		

	





	

		

			

				
					
android webview中使用Java调用JavaScript方法并获取返回值

				
			

			

				

					10-24
				

			

		

		

			
				
为了实现Java和JavaScript之间的通信，Android WebView提供了addJavascriptInterface()方法。这个方法允许你向WebView注入一个接口对象，JavaScript代码可以通过这个接口访问Java对象的方法。下面将详细解释如何实现...

			
		

	





	

		

			

				
					
Android  webview和js互相调用实现方法

				
			

			

				

					01-20
				

			

		

		

			
				
其次，JavaScript调用Android本地方法则需要使用`addJavascriptInterface`。这个方法允许我们在JavaScript中创建一个对象，该对象对应于Android中的一个类实例，从而实现JavaScript方法调用Android方法。以下是一个...

			
		

	





	

		

			

				
					
Android与JS之间跨平台异步调用实例详解

				
			

			

				

					09-01
				

			

		

		

			
				
例如，当需要访问本地设备的功能（如相机、存储等）或者解决跨域问题时，就需要 Android 和 JS 之间进行通信。  Android 调用 JS 主要是通过 WebView 的 `addJavascriptInterface` 方法。例如，在给定的代码片段中，...

			
		

	





	

		

			

				
					
JS怎样调用Android本地原生方法

				
			

			

				

					tingxuege
				

				

					04-28
					
					4742
					
				

			

		

		

			
				
1.设置webview
webSettings.setJavaScriptEnabled(true);//设置js可用
MJavascriptInterface mJavascriptInterface = new MJavascriptInterface(this); //初始化本地方法接口
mWebView.addJavascriptInterface(mJavascriptInterfac

			
		

	





	

		

			

				
					
Android调用本地js方法（不显示h5界面）

				
			

			

				

					qq_30304193的博客
				

				

					09-11
					
					4870
					
				

			

		

		

			
				
在开发过程中有时会遇到这种情况，需要调用js的一些方法，又不需要显示h5界面。比如，在你开发的产品中，PC、h5，移动端（Android、IOS）都需要使用到同一个算法，而且这个算法又非常的复杂，若每个端都写一边，不仅浪费时间，而且如果算法涉及到复杂的数字计算，那么就可能会导致每个端写出来的算法结果不一致。

所以这个时候，使用js编写一个通用算法是比较理想的一个解决方法，因为pc、h5、Andr...

			
		

	





	

		

			

				
					
JavaScript调用安卓函数

				
			

			

				

					eeeeety6208的博客
				

				

					10-08
					
					444
					
				

			

		

		

			
				
哈哈无标题文档

			
		

	





	

		

			

				
					
JS调用Android里面的方法，Android调用JS里面的方法

					
热门推荐

				
			

			

				

					hj563308597的专栏
				

				

					04-22
					
					6万+
					
				

			

		

		

			
				
Android WebView


    在公司Android的开发过程中遇到一个新的问题，那就是让Java代码和Javascript代码进行交互,然后在网上找到了关于webView的资料，之前并没有深入去了解WebView，一直以为Android 的WebView是一个用来显示网页的组件而已，没想到功能如此强大，竟然能跟JS互调传参，太牛了！
WebView是一个webkit的内核，a

			
		

	





	

		

			

				
					
JS调用Android方法示例

				
			

			

				

					Jason_Flash的博客
				

				

					09-08
					
					1469
					
				

			

		

		

			
				
JS调用Android方法示例前言示例代码AndroidManifest.xmlAndroidtoJs.javaactivity_main.xmlMainActivity.javajavascript.html测试
前言
目前很多App里都内置了Web网页（Hybrid App），这就涉及到Android客户端与Web网页交互的实现，接下来通过示例说明JS如何调用Android方法。
示例代码
AndroidManifest.xml
AndroidManifest.xml需要加入INTERNET权限：
&l

			
		

	





	

		

			

				
					
Js与安卓互掉

				
			

			

				

					weixin_48020315的博客
				

				

					12-23
					
					214
					
				

			

		

		

			
				
安卓Js互掉XML代码安卓和js互掉
XML代码
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>Test Page</title>
		 <script>
                    /**
                    Android端调用的JavaScript方法
                    */
 

			
		

	





	

		

			

				
					
android 本地方法与js交互

				
			

			

				

					wh1076674227的博客
				

				

					09-06
					
					999
					
				

			

		

		

			
				
使用的第三方框架    这里要介绍2种交互的方式
com.github.lzyzsd.jsbridge.BridgeWebView

Android本地的初始化设置
webView = (BridgeWebView) view.findViewById(R.id.webView);
        webView.setDefaultHandler(new DefaultHandler())

			
		

	





	

		

			

				
					
【Android】安卓端执行本地js文件的某个函数

				
			

			

				

					冰冷的希望的博客
				

				

					11-12
					
					2532
					
				

			

		

		

			
				
最近有一个需求，就是要在安卓端获取某个值，这个值是由js文件里的某个函数生成的。问题是这个函数非常复杂，不容易将其换成Java代码重写，故需要安卓直接执行js代码获得那个值。
我在网上找了一段时间希望找到能直接运行js的Java类库，虽然找到了rhino，但是还是没有解决问题。所以我还是换一种思路吧，直接用WebView这个强大的东西
一、准备工作
准备一个html文档，里面嵌入需要运行js代码，...

			
		

	





	

		

			

				
					
html,js调用安卓本地方法,安卓本地最简单的写法

				
			

			

				

					安卓事件传递机制
				

				

					09-19
					
					967
					
				

			

		

		

			
				








 

点击链接加入群聊【武汉IT交流求职招聘群】：https://jq.qq.com/?_wv=1027&amp;k=5nIUsqe

武汉IT求职招聘技术交流QQ群  562286943

			
		

	





	

		

			

				
					
详解Android WebView：集成与JS交互方法

				
			

			

				

					
				

			

		

		

			
				
掌握Android WebView的使用方法和JavaScript交互调用，对于开发出功能完善且性能良好的Android应用至关重要。通过灵活运用这些技术，开发者能够创建出既具备原生体验又具有丰富功能的Web界面，极大地提升了应用的...

			
		

	



              




          




        



    





    



      

      

        
      

      





	

		评论	
	

	
	




  

    

      添加红包
      
    

    

      

        
        

          
          
        

        
请填写红包祝福语或标题

      

      

        
        

          
          个
        

        
红包个数最小为10个

      

      

        
        

          
          元
        

        
红包金额最低5元

      

      

        
        

          当前余额3.43元
          前往充值 >
        

      

      

        

          需支付：10.00元
        

        
        
      

    

  





  

    
    
  

  

    
    
  








  

    

      

        

          

            
            
成就一亿技术人!

          

          

        

        

          

          

            领取后你会自动成为博主和红包主的粉丝
            规则
          

        

      

      

        

          

            
              
            
            

              
hope_wisdom
 发出的红包
            

          

        

        

          

          

          

        

      

    

    

  



      
      

      
实付元

      
使用余额支付

      

        

          

            
            点击重新获取
          

        

        
扫码支付

      

      

        
          
            
          
          
        
      

      

        
        钱包余额
          0
          

            
            

              

                
抵扣说明：

                
 1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
 2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

              

            

          

      

      余额充值