如何以编程方式获取适用于 android 和 iphone 的 webkit 应用程序的 html 源代码？

Question

我想在 Android 和 iPhone 上使用 JavaScript 来显示 webkit 应用程序的 HTML 源代码。

Answer 1

首先是安卓。在android应用程序中，我希望从网页运行html视图源javascript代码，并调用一个java函数，然后该函数将在网页上运行javascript。 Android代码中使用了SwipeRefreshLayout组件。

public class MainActivity extends AppCompatActivity {
     static WebView webview1;
     SwipeRefreshLayout swipeRefreshLayout;

     onCreate() {

         webview1.addJavascriptInterface(this, "android");    // creates a js interface
         ...
     }

     @JavascriptInterface
     public void view_source_code(String msg) {

        //Toast.makeText(main_activity, "html_view_source", Toast.LENGTH_SHORT).show();

        swipeRefreshLayout.post(new Runnable() {
            @Override
            public void run() {

                MainActivity.webview1.loadUrl("javascript:(function(){" +
                        "function get_doctype() { var doctype = '<!DOCTYPE ' + document.doctype.name + (document.doctype.publicId?' PUBLIC \"' + document.doctype.publicId + '\"':'') + (document.doctype.systemId?' \"' + document.doctype.systemId + '\"':'') + '>'; return doctype; } \n" +

                        "var a1 = get_doctype() + document.documentElement.outerHTML; " +
                        "    a1 = a1.replaceAll(\"<\", \"&lt;\").replaceAll(\">\", \"&gt;\").replaceAll(\"\\n\", \"<br>\"); \n" +

                        "var href = window.location.href;" +

                        "page_load = function() {" +
                        "    window.location.href = href;" +
                        "};" +

                        "view_html = function() {" +
                        " return '<center><br><button onclick=\"page_load();\">Go to Ultrazon.com</button></center><br>" +
                        "         <pre style=\"font-weight:bold;font-size:85%;padding-left:5px;\">'+ a1 + '</pre>'" +
                        "};" +
                        "" +
                        "document.body.style.backgroundColor = \"yellow\";" +
                        "document.body.style.fontSize = \"20px\"; " +

                        "document.body.innerHTML = view_html(); " +
                        "})();"
                );
            }
        });
}

iphone，swift代码是这样的

class ViewController: UIViewController, WKUIDelegate, WKNavigationDelegate, WKScriptMessageHandler {
        
        
        func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) {
                
                if (message.name == "iphoneViewSourceCode") {
                        
                        let javascript = "javascript:(function(){" +
                        "function get_doctype() { var doctype = '<!DOCTYPE ' + document.doctype.name + (document.doctype.publicId?' PUBLIC \"' + document.doctype.publicId + '\"':'') + (document.doctype.systemId?' \"' + document.doctype.systemId + '\"':'') + '>'; return doctype; } \n" +

                        "var a1 = get_doctype() + document.documentElement.outerHTML; " +
                        "        a1 = a1.replaceAll(\"<\", \"&lt;\").replaceAll(\">\", \"&gt;\").replaceAll(\"\\n\", \"<br>\"); \n" +
                        
                        "var href = window.location.href;" +

                        "page_load = function() {" +
                        "        window.location.href = href;" +
                        "};" +
                        
                        "view_html = function() {" +
                        "        return '<center><br><button onclick=\"page_load();\">Go To Page</button></center><br>" +
                        "                        <pre style=\"font-weight:bold;font-size:85%;padding-left:5px;\">'+ a1 + '</pre>'" +
                        "};" +
                        
                        "document.body.style.backgroundColor = \"yellow\";" +
                        "document.body.style.fontSize = \"20px\"; " +

                        "document.body.innerHTML = view_html(); " +
                        "})();"
                        
                        self.webView.evaluateJavaScript(javascript) { (response, error) in
                                debugPrint("javascript webkit")
                        }
                }



        var webView: WKWebView!


        override func viewDidLoad() {
                super.viewDidLoad()
                
                
                let contentController = WKUserContentController()
                contentController.add(self, name:"iphoneViewSourceCode")
                
                
                
                let configuration = WKWebViewConfiguration()
                
                configuration.userContentController = contentController
                
                configuration.ignoresViewportScaleLimits = false
                configuration.suppressesIncrementalRendering = true
                configuration.allowsInlineMediaPlayback = true
                configuration.allowsAirPlayForMediaPlayback = false
                configuration.allowsPictureInPictureMediaPlayback = true
                
                //configuration.requiresUserActionForMediaPlayback = false
                configuration.mediaTypesRequiringUserActionForPlayback = []

                configuration.defaultWebpagePreferences.allowsContentJavaScript = true
                
                webView = WKWebView(frame: CGRectMake(0, 0,      UIScreen.main.bounds.size.width, UIScreen.main.bounds.size.height), configuration: configuration)
                ...
      }

  }

最后是 html 中的 javascript 来调用 java 和 swift 方法，

    <script> 
            if ( is_android() ) { 
               android.view_source_code("html_source_code"); 
            }
    </script>

和

    <script> 
             if ( is_iphone() ) {
                window.webkit.messageHandlers.iphoneViewSourceCode.postMessage(''); 
             }
    </script>