2016-09-23 65 views
3

我只是想與我的Java應用程序與web視圖上的內容進行通信。在Android中使用Javascript橋樑

詳細地說,可能只是在按鈕上點擊烤麪包?

在谷歌搜索和做一些研究後,結束了以下代碼。

P.S: - 使用Android Studio的Im,是否有任何外部庫需要編譯inorder才能完成任務?或者是其他東西 ?

以下是我WebviewActivity代碼: -

public class WebviewActivity extends AppCompatActivity { 

private static final String TAG = "Main"; 

@Override 
public void onCreate(Bundle savedInstanceState) { 
    super.onCreate(savedInstanceState); 
    setContentView(R.layout.activity_webview); 
    //WebView Object 
    WebView browser; 
    browser=(WebView)findViewById(R.id.webView); 
    //Enable Javascript 
    browser.getSettings().setJavaScriptEnabled(true); 
    //Inject WebAppInterface methods into Web page by having Interface 'Android' 
    browser.addJavascriptInterface(new WebAppInterface(this), "Android"); 
    browser.loadUrl("http://www.somewebsite.com/app/form.html"); 
} 
//Class to be injected in Web page 
public class WebAppInterface { 
    Context mContext; 

    /** Instantiate the interface and set the context */ 
    WebAppInterface(Context c) { 
     mContext = c; 
    } 

    /** 
    * Show Toast Message 
    * @param toast 
    */ 
    public void showToast(String toast) { 
     Toast.makeText(mContext, toast, Toast.LENGTH_SHORT).show(); 
    } 

    /** 
    * Show Dialog 
    * @param dialogMsg 
    */ 
    public void showDialog(String dialogMsg){ 
     AlertDialog alertDialog = new AlertDialog.Builder(mContext).create(); 

     // Setting Dialog Title 
     alertDialog.setTitle("JS triggered Dialog"); 

     // Setting Dialog Message 
     alertDialog.setMessage(dialogMsg); 

     // Setting alert dialog icon 
     //alertDialog.setIcon((status) ? R.drawable.success : R.drawable.fail); 

     // Setting OK Button 
     alertDialog.setButton("OK", new DialogInterface.OnClickListener() { 
      public void onClick(DialogInterface dialog, int which) { 
       Toast.makeText(mContext, "Dialog dismissed!", Toast.LENGTH_SHORT).show(); 
      } 
     }); 

     // Showing Alert Message 
     alertDialog.show(); 
    } 

    /** 
    * Intent - Move to next screen 
    */ 
    public void moveToNextScreen(){ 
     AlertDialog.Builder alertDialog = new AlertDialog.Builder(mContext); 
     // Setting Dialog Title 
     alertDialog.setTitle("Alert"); 
     // Setting Dialog Message 
     alertDialog.setMessage("Are you sure you want to leave to next screen?"); 
     // Setting Positive "Yes" Button 
     alertDialog.setPositiveButton("YES", 
       new DialogInterface.OnClickListener() { 
        public void onClick(DialogInterface dialog, int which) { 
         //Move to Next screen 

        } 
       }); 
     // Setting Negative "NO" Button 
     alertDialog.setNegativeButton("NO", 
       new DialogInterface.OnClickListener() { 
        public void onClick(DialogInterface dialog, int which) { 
         // Cancel Dialog 
         dialog.cancel(); 
        } 
       }); 
     // Showing Alert Message 
     alertDialog.show(); 
    } 
    } 
} 

form.html: -

<html> 
<head> 
    <style> 
    body{ 
background-color: #FA5858; 
color:#fff; 
    } 
input{ 
background-color: #F7D358; 
width: 300px; 
padding:10px; 
color: #000; 
} 
div#content{ 
padding:20px; 
background-color: #F7D358; 
    color: #000; 
} 
</style> 
<script type="text/javascript"> 
    function showAndroidToast(toastmsg) { 
    Android.showToast(toastmsg); 
    } 
function showAndroidDialog(dialogmsg) { 
     Android.showDialog(dialogmsg); 
    } 
    function moveToScreenTwo() { 
    Android.moveToNextScreen(); 
    } 
</script> 
    </head> 
    <body> 
    <center> 
    <h3>Binding JavaScript code to Android code</h3> 
     <div id="content"> 
//some content here 
     </div> 
    <div> 
    Here are few examples: 
    </div> 
    <div> 
     <input type="button" value="Make Toast" onClick="showAndroidToast('Toast made by Javascript')" /><br/> 
     <input type="button" value="Trigger Dialog" onClick="showAndroidDialog('This dialog is triggered by Javascript ')" /><br/> 
     <input type="button" value="Take me to Next Screen" onClick="moveToScreenTwo()" /> 
      </div> 
     </center> 
    </body> 
    </html> 

我有這樣上面的代碼,但它不是在Android的工作室工作,嘗試了所有posiblities所以最後在這裏發佈我的問題。

我給這家研究: -

https://developer.android.com/guide/webapps/webview.html 
https://developer.android.com/reference/android/webkit/WebView.html 
http://stackoverflow.com/questions/4325639/android-calling-javascript-functions-in-webview 

回答

2

你裏面WebAppInterface類方法缺少@JavascriptInterface註解。

WebAppInterface類應該是這樣的,

public class WebAppInterface { 
    Context mContext; 

    WebAppInterface(Context c) { 
     mContext = c; 
    } 

    @JavascriptInterface 
    public void showToast(String toast) { 
    } 

    @JavascriptInterface 
    public void showDialog(String dialogMsg){ 
    } 

    @JavascriptInterface 
    public void moveToNextScreen(){ 
    } 

} 

編輯

不要忘了你的應用程序限制爲API17 +加載網頁內容到WebView中時,否則您的應用程序將是脆弱的攻擊。閱讀@羅伯特的評論如下。

+0

你剛剛救了我的一天! ,愚蠢的錯誤在那裏..工作順利! 。感謝幫助我朋友。 – Vikrant

+0

很高興我能幫到你。祝你好運:) –

+1

@Vikrant當將Web內容加載到WebView時,不要忘記限制你的應用程序到API17 +,否則你的應用程序將容易受到攻擊。 – Robert