javascript - Wie interagiert die H5-Seite mit der APP-Anwendung?

Erstellen Sie eine Aktivität und betten Sie eine H5-Seite in die App ein.

Wie können Benutzer auf der H5-Seite auf die Schaltfläche klicken, um zu einer anderen Seite der APP zu springen?

Klicken Sie beispielsweise auf der H5-Seite auf die Schaltfläche „Aufladen“, um zur Aufladeoberfläche zu springen, und klicken Sie auf die Schaltfläche „Jetzt kaufen“, um zur Produktseite zu springen.

Wie interagieren H5 und APP mit Daten?

Wie schreibe ich den Hintergrund?

Gibt es Beispiele?

Bitte geben Sie mir einen Rat.

Antwortinhalt:

Erstellen Sie eine Aktivität und betten Sie eine H5-Seite in die App ein.

Wie können Benutzer auf der H5-Seite auf die Schaltfläche klicken, um zu einer anderen Seite der APP zu springen?

Klicken Sie beispielsweise auf der H5-Seite auf die Schaltfläche „Aufladen“, um zur Aufladeoberfläche zu springen, und klicken Sie auf die Schaltfläche „Jetzt kaufen“, um zur Produktseite zu springen.

Wie interagieren H5 und APP mit Daten?

Wie schreibe ich den Hintergrund?

Gibt es Beispiele?

Bitte geben Sie mir einen Rat.

Die oben genannten Methoden sind alle ziemlich gut. Tatsächlich handelt es sich jedoch nur um ein einfaches Sprungproblem, es muss nicht so kompliziert sein.
Erfassen Sie die Sprunginformationen aus der Webansicht, und dann besprechen das Android-Ende und das Front-End die Schnittstelle und verarbeiten sie direkt.
Zum Beispiel: Es gibt einen Sprung ins Netz

<code><a href="example://jumpToSettings">跳转设置</a></code>

Nach dem Klicken wird die Funktion ShouldOverrideUrlLoading in der Webansicht gestartet, Android-Seite:

<code>webView.setWebViewClient(new WebViewClient() {
            @Override
            public boolean shouldOverrideUrlLoading(WebView view, String url) {
                L.i(url); // 获取到 example://jumpToSettings ，然后接下来就是字符串处理了
                optionUrl(url); // 判断如果是跳转字符串，进行跳转
                return true; // 消费，不让网页跳转
            }

            @Override
            public void onPageStarted(WebView view, String url, Bitmap favicon) {
//                super.onPageStarted(view, url, favicon);
            }
        });</code>

JavaScriptCoreEs gibt viele Beispiele im Internet und auch die Dokumentation von Apple ist sehr ausführlich

Auf der Android-Seite lädt WebView H5, und der JS-Code in H5 kann wie folgt aussehen:

<code><script type="text/javascript">
        function jumpToAppPages(){
            toActivity.OpenLinkH5("https://www.baidu.com");
        }
</script>
</code>

Schreiben Sie dies in die Aktivität, in der sich das aktuelle WebView befindet:

<code>mWebViewContent.addJavascriptInterface(new JumpAppInterFace(mContext),"toActivity");
</code>

Darunter ist JumpAppInterFace die Klasse, die Sie injizieren müssen, um zu einer anderen Aktivität zu springen. Sie sieht so aus:

<code>public class JumpAppInterFace {
    private static final String TAG = "JumpAppInterFace";

        private android.content.Context Context;


        public JumpAppInterFace(android.content.Context Context) {
            this.Context = Context;

        }
        @JavascriptInterface
        public void OpenLinkH5(String url){
            if (!TextUtil.isEmpty(url)){
                Intent intent=new Intent(Context, AnotherActivity.class);
                intent.putExtra("url",url);
                Context.startActivity(intent);
            }

        }

}</code>

Ich habe das bei Stackoverflow gesehen, schau, ob es funktioniert.

<code>webview.addJavascriptInterface(new Object() {
    @JavascriptInterface
    public void openActivity(String activity){
        Intent i = new Intent(Intent.ACTION_VIEW, Uri.parse(activity));
        mContext.startActivity(i);
    }
}, "android");

<a href="javascript:void(0)" onclick="alert(android.openActivity('Recharge'))">充值</a>
<a href="javascript:void(0)" onclick="alert(android.openActivity('Goods'))">抢购</a></code>