Question

我使用的是this InAppbrowser插件按照答案中的建议后，我仍然无法正常工作。

我的app.js

(function () {
  'use strict';

  var app = angular
      .module('starter', ['ionic', 'ngCordova'])
      .run(function($ionicPlatform){
        $ionicPlatform.ready(function() {
          if(window.cordova && window.cordova.plugins.Keyboard) {
            cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
            cordova.plugins.Keyboard.disableScroll(true);
          }
          if(window.StatusBar) {
            StatusBar.styleDefault();
          }
        });
      });

      app.controller("starter", function($scope, $rootScope, $cordovaInAppBrowser){

          console.log("inside controller");

          $cordovaInAppBrowser.open('https://google.com','_self', {location: "no"})
              .then(function(event) {
                console.log("success");
              })
              .catch(function(event) {
                console.log(event)
              });

          $rootScope.$on('$cordovaInAppBrowser:loadstop', function(e, event){
              console.log("loadstop called");
              $cordovaInAppBrowser.executeScript({                      
                  code: 'alert("from app to browser");'
              });
          });

          $rootScope.$on('$cordovaInAppBrowser:loaderror', function(e, event){
            console.log(e);
          });

        })

        angular.element(document).ready(function() {
          document.addEventListener("deviceready", function() {
            console.log("deviceready called");
            angular.bootstrap(document, ["starter"]);
          }, false);
        });


}());

的index.html

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
   <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com; style-src 'self' 'unsafe-inline'; media-src *">
    <title></title>
    <link href="lib/ionic/css/ionic.css" rel="stylesheet">
    <link href="css/style.css" rel="stylesheet">

    <!-- IF using Sass (run gulp sass first), then uncomment below and remove the CSS includes above
    <link href="css/ionic.app.css" rel="stylesheet">
    -->

    <!-- ionic/angularjs js -->
    <script src="lib/ionic/js/ionic.bundle.js"></script>
    <script src="lib/ngCordova/dist/ng-cordova.js"></script>

    <script src="cordova.js"></script>     
    <!-- your app's js -->
    <script src="src/app.js"></script>
  </head>
  <body>
   <ion-pane ng-controller="starter">
   </ion-pane>
  </body>
</html>

config.xml中

 <content src="index.html"/>
  <allow-navigation href="http://*/*"/>
  <allow-navigation href="https://*/*"/>
  <access browserOnly="true" origin="*" />
  <preference name="webviewbounce" value="false"/>
  <preference name="UIWebViewBounce" value="false"/>
  <preference name="DisallowOverscroll" value="true"/>
  <preference name="android-minSdkVersion" value="16"/>
  <preference name="BackupWebStorage" value="none"/>
  <preference name="SplashScreen" value="screen"/>
  <preference name="SplashScreenDelay" value="5000"/>
  <preference name="orientation" value="portrait"/>
  <feature name="StatusBar">
    <param name="ios-package" onload="true" value="CDVStatusBar"/>
  </feature>
  <platform name="android">
    <icon src="resources/android/icon/drawable-ldpi-icon.png" density="ldpi"/>
    <icon src="resources/android/icon/drawable-mdpi-icon.png" density="mdpi"/>
    <icon src="resources/android/icon/drawable-hdpi-icon.png" density="hdpi"/>
    <icon src="resources/android/icon/drawable-xhdpi-icon.png" density="xhdpi"/>
    <icon src="resources/android/icon/drawable-xxhdpi-icon.png" density="xxhdpi"/>
    <icon src="resources/android/icon/drawable-xxxhdpi-icon.png" density="xxxhdpi"/>
    <splash src="resources/android/splash/drawable-port-ldpi-screen.png" density="port-ldpi"/>
    <splash src="resources/android/splash/drawable-port-mdpi-screen.png" density="port-mdpi"/>
    <splash src="resources/android/splash/drawable-port-hdpi-screen.png" density="port-hdpi"/>
    <splash src="resources/android/splash/drawable-port-xhdpi-screen.png" density="port-xhdpi"/>
    <splash src="resources/android/splash/drawable-port-xxhdpi-screen.png" density="port-xxhdpi"/>
    <splash src="resources/android/splash/drawable-port-xxxhdpi-screen.png" density="port-xxxhdpi"/>
  </platform>
  <icon src="resources/android/icon/drawable-xhdpi-icon.png"/>

控制台输出

I/chromium(18704): [INFO:library_loader_hooks.cc(130)] Chromium logging enabled: level = 0, default verbosity = 0
I/chromium(18704): [INFO:CONSOLE(46)] "deviceready called", source: file:///android_asset/www/src/app.js (46)
I/chromium(18704): [INFO:CONSOLE(20)] "inside controller", source: file:///android_asset/www/src/app.js (20)

$cordovaInAppBrowser:loadstop事件永远不会发生。 Cordova版本6.0.0，离子版本1.7.14

Answer 1

如果您使用_self，

事件侦听器不起作用。

当您使用_self时，您正在加载cordova webview内的网站，而不是inAppBrowser webview，然后您将使用您加载的网站中的代码替换所有现有代码，因此当您的页面完成加载时，你的代码消失了，不会被执行。

您必须使用_blank打开真正的inAppBrowser窗口。

Answer 2

看起来您可以使用此插件将Cordova注入您加载到Webview的任何网站中：https://github.com/sberan/cordova-plugin-injectview

此外，https://issues.apache.org/jira/browse/CB-9148已经关闭

在Cordova Webview中执行脚本

2 个答案: