Android
WebView

Einführung

Bemerkungen

<uses-permission android:name="android.permission.INTERNET" /> 

JavaScript-Warnungsdialogfelder in WebView - So funktionieren sie

Standardmäßig implementiert WebView keine JavaScript-Warnungsdialogfelder, z. alert() tut nichts. Um dies zu ermöglichen, müssen Sie zunächst JavaScript aktivieren (offensichtlich ..) und dann einen WebChromeClient , um Anforderungen für WebChromeClient auf der Seite zu bearbeiten:

webView.setWebChromeClient(new WebChromeClient() {
    //Other methods for your WebChromeClient here, if needed..

    @Override
    public boolean onJsAlert(WebView view, String url, String message, JsResult result) {
        return super.onJsAlert(view, url, message, result);
    }
});

Hier überschreiben wir onJsAlert und rufen dann die Super-Implementierung auf, die uns einen Standard-Android-Dialog gibt. Sie können die Nachricht und die URL auch selbst verwenden, z. B. wenn Sie ein benutzerdefiniertes Dialogfenster erstellen möchten oder wenn Sie sie protokollieren möchten.

Kommunikation von Javascript nach Java (Android)

Android-Aktivität

package com.example.myapp;

import android.os.Bundle;
import android.app.Activity;
import android.webkit.WebView;

public class WebViewActivity extends Activity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
    
        WebView webView = new WebView(this);
        setContentView(webView);

       /* 
        *   Note the label Android, this is used in the Javascript side of things
        *   You can of course change this.
        */
        webView.addJavascriptInterface(new JavascriptHandler(), "Android");
    
        webView.loadUrl("http://example.com");
    }
}

Java-Javascript-Handler

import android.webkit.JavascriptInterface;

public class JavascriptHandler {

    /**
     *  Key point here is the annotation @JavascriptInterface
     *
     */
    @JavascriptInterface
    public void jsCallback() {
       // Do something
    }

    @JavascriptInterface
    public void jsCallbackTwo(String dummyData) {
       // Do something
    }
}

Webseite, Javascript aufrufen

<script>
... 
Android.jsCallback();
...
Android.jsCallback('hello test');
...
</script>

Extra Tipp

Eine mögliche Lösung, die eine komplexe Datenstruktur übergibt, ist JSON.

Android.jsCallback('{ "fake-var" : "fake-value", "fake-array" : [0,1,2] }');

Verwenden Sie auf der Android-Seite Ihren bevorzugten JSON-Parser, z

Kommunikation von Java nach Javascript

Basisbeispiel

package com.example.myapp;

import android.os.Bundle;
import android.app.Activity;
import android.webkit.WebView;

public class WebViewActivity extends Activity {
    
    private Webview webView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
       super.onCreate(savedInstanceState);

       webView = new WebView(this);
       webView.getSettings().setJavaScriptEnabled(true);

       setContentView(webView);

       webView.loadUrl("http://example.com");

       /*
        * Invoke Javascript function
        */
       webView.loadUrl("javascript:testJsFunction('Hello World!')");
    }

   /**
    * Invoking a Javascript function
    */
   public void doSomething() {
     this.webView.loadUrl("javascript:testAnotherFunction('Hello World Again!')");
   }
}

Dialer-Beispiel öffnen

Wenn die Webseite a eine Telefonnummer enthält, können Sie mit dem Telefon Ihres Telefons einen Anruf tätigen. Dieser Code prüft die URL, die mit tel: beginnt: Warten Sie dann auf Dialer, und Sie können die geklickte Telefonnummer anrufen:

public boolean shouldOverrideUrlLoading(WebView view, String url) {
    if (url.startsWith("tel:")) { 
            Intent intent = new Intent(Intent.ACTION_DIAL,
                    Uri.parse(url)); 
            startActivity(intent); 
    }else if(url.startsWith("http:") || url.startsWith("https:")) {
        view.loadUrl(url);
    }
    return true;
}

Fehlerbehebung für WebView durch Drucken von Konsolennachrichten oder durch Remote-Debugging

Meldungen der Webview-Konsole in logcat drucken

Um console von Webseiten zu verarbeiten, können Sie onConsoleMessage in WebChromeClient :

final class ChromeClient extends WebChromeClient {
    @Override
    public boolean onConsoleMessage(ConsoleMessage msg) {
        Log.d(
            "WebView", 
            String.format("%s %s:%d", msg.message(), msg.lineNumber(), msg.sourceId())
        );
        return true;
    }
}

Und setze es in deine Aktivität oder dein Fragment:

webView.setWebChromeClient(new ChromeClient());

Also diese Beispielseite:

<html>
<head>
    <script type="text/javascript">
        console.log('test message');
    </script>
</head>
<body>
</body>
</html>

schreibt Protokoll 'Testnachricht' in Logcat:

WebView: Testnachricht sample.html: 4

console.info() , console.warn() und console.error() werden ebenfalls von Chrome-Client unterstützt.

Remote-Debugging von Android-Geräten mit Chrome

Ihre Webview-basierte Remote-Anwendung kann von Ihrem Desktop-Chrome aus ferngesteuert werden.

Aktivieren Sie das USB-Debugging auf Ihrem Android-Gerät

Öffnen Sie auf Ihrem Android-Gerät Einstellungen, finden Sie den Abschnitt Entwickleroptionen und aktivieren Sie das USB-Debugging.

Verbinden Sie sich und entdecken Sie Ihr Android-Gerät

Öffnen Sie die folgende Seite in Chrome: Chrome: // inspect / # devices

Wählen Sie im Dialogfeld "Geräte prüfen" Ihr Gerät aus und drücken Sie auf "Prüfen". Auf Ihrem Entwicklungscomputer wird eine neue Instanz von Chrome DevTools geöffnet.

Detailliertere Richtlinie und Beschreibung von DevTools finden Sie unter developers.google.com

Lokale Datei öffnen / Dynamischen Inhalt in Webview erstellen

Layout.xml

                <WebView
                android:id="@+id/WebViewToDisplay"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                android:layout_gravity="center"
                android:fadeScrollbars="false" />

Laden Sie Daten in WebViewToDisplay

        WebView webViewDisplay;
        StringBuffer LoadWEb1;

        webViewDisplay = (WebView) findViewById(R.id.WebViewToDisplay);
        LoadWEb1 = new StringBuffer();
        LoadWEb1.append("<html><body><h1>My First Heading</h1><p>My first paragraph.</p>");
        //Sample code to read parameters at run time
        String strName = "Test Paragraph";
        LoadWEb1.append("<br/><p>"+strName+"</p>");
        String result = LoadWEb1.append("</body></html>").toString();
                WebSettings webSettings = webViewDisplay.getSettings();
                webSettings.setJavaScriptEnabled(true);
                webViewDisplay.getSettings().setBuiltInZoomControls(true);
                if (android.os.Build.VERSION.SDK_INT >= 11){
                    webViewDisplay.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
                    webViewDisplay.getSettings().setDisplayZoomControls(false);
                }

                webViewDisplay.loadDataWithBaseURL(null, result, "text/html", "utf-8",
                        null);
                //To load local file directly from assets folder use below code
                //webViewDisplay.loadUrl("file:///android_asset/aboutapp.html");