5 Replies Latest reply on Dec 26, 2016 8:05 PM by banjodrill

    inappbrowser back button not appearing in  ios

    banjodrill

      I'm building an Angular app that pulls in PDFs from an AWS S3 bucket. The app is being packaged in PhoneGap Build.

       

      I have these in my config:

       

      <plugin name="cordova-plugin-whitelist" source="npm" spec="*"/>

      <plugin name="cordova-plugin-inappbrowser" source="npm" spec="*" />

       

      I'm calling for the browser to open the PDFs like this:

       

      <a ng-href="{{ resource.content }}" target="_blank" ng-click="window.open('{{ resource.content }}', '_blank','location=yes,toolbar=yes,closebuttoncaption=Done');"></a>

       

      The PDF opens but I get no toolbar or close button to return to the app.

       

      NOTE: This app also pulls in videos from YouTube. To make the videos appear, I am using this in my config:

       

      <allow-navigation href="https://*youtube.com/*"/>

       

      If I remove this, I will get a back button at the top left of the browser, but the videos will not appear.

       

      Any suggestions?

       

       

      Here are all the plugins in config:

      <plugin name="cordova-plugin-whitelist" source="npm" spec="*"/>

      <plugin name="cordova-plugin-inappbrowser" source="npm" spec="*" />

      <allow-navigation href="https://*youtube.com/*"/>

       

      Thanks in advance.

        • 1. Re: inappbrowser back button not appearing in  ios
          banjodrill Level 1

          The app ID is 2405521

          • 2. Re: inappbrowser back button not appearing in  ios
            VectorP Level 4

            Are you sure it's the inAppBrowser window you are seeing when viewing such PDF?

            Could it be that an 'intent' was invoked which triggers the PDF to be viewed in a local PDF Reader?

             

            Are you seeing the issue on all OS/devices, or just on an iOS device?

            • 3. Re: inappbrowser back button not appearing in  ios
              banjodrill Level 1

              Thanks for responding VectorP. I'm not sure it's the inAppBrowser window I'm seeing...and I'm not sure if an intent was invoked. Can you point me in the right direction to determine those factors?

               

              Also, I've only tested on an iPhone 7s. Will be testing iPad Pro & iPad Air this week.

              • 4. Re: inappbrowser back button not appearing in  ios
                VectorP Level 4

                Well,

                 

                1. With the inappbrowser plugin and the '_blank' parameter, whitelisting is not a factor. No need to go deeper into that.

                2. You try PDF's and Youtube videos, both of which might be presented in their own viewer. Chances are, that you are not really invoking the inappbrowser for that.

                3. You may first want to do some testing with a simple, local website in the inappbrowser to see if the most basic case works as expected. If it does, it's time to see what to do with PDF's and videos.

                Simply use cordova.InAppBrowser.open() for a website like http://yourlocalsoftballteam.com or something similar and see if the expected behaviour shows up.

                • 5. Re: inappbrowser back button not appearing in  ios
                  banjodrill Level 1

                  VectorP,

                  Thanks again for offering your advice. After many days of running into a brick wall, I finally found the solution:

                   

                  In my config, I was calling <plugin name="cordova-plugin-inappbrowser" source="npm" spec="*"/>

                   

                  I tried window.open with all the params in the view (with a ng-href) and also via the controller.

                   

                  Removing the source and spec properties has solved the problem for now. Now I'm just calling it like this:

                   

                  <plugin name="cordova-plugin-inappbrowser" />

                   

                  All along, I thought it was something in my html or my controller. @#$%!!!

                   

                  Final solution for anyone who got stuck the same way I did:

                   

                  Config.xml: <plugin name="cordova-plugin-inappbrowser" />

                   

                  HTML: ng-click="openResourceInBrowser(resource)"

                   

                  Controller:

                  document.addEventListener("deviceready", onDeviceReady, false);

                    function onDeviceReady() {

                    window.open = cordova.InAppBrowser.open;

                    }

                   

                  $scope.openResourceInBrowser = function(resource){

                    var resourcePath = $filter('trustAsResourceUrl')(resource.content);

                  window.open(resourcePath,'_blank','location=no,','disallowoverscroll=no,','toolbar=yes',' closebuttoncaption=done');

                    };

                   

                  Hope this can save someone some time. Cheers.