在Apache Cordova中从“inappbrowser”打开相机或图库

5

我有一个使用Apache Cordova开发的混合应用程序,在该应用程序中我正在使用“inappbrowser”。现在的要求是从inappbrowser打开相机或图库,我无法弄清如何实现。

为了开发这个应用程序,我正在使用backbone.js,JQuery,bootstrap.js。

这里是Backbone视图的代码片段:

  var mainScreenView = Backbone.View.extend({

        el: $('.panel'),

        templateMainScreen: _.template($('#templateOne').html()),

        events: {

            "click #inputBtnSubmit": "openWebView",
            "click #clickSettings": "openSettings"
        },

        initialize: function(){
            this.render();
        },

        render: function () {

            alert($(this.el).find('.panel-body'));
            var bindElement = $(this.el).find('.panel-body');
            bindElement.html(this.templateMainScreen());
            return this;
        },

        openWebView: function () {

            var textValue = $('#inputValue').val();
                       cordova.InAppBrowser.open('**Link to an external webpage which asks for Camera or Gallery control** ', '_blank', 'location=no');

       //  After inappbrowser is called to load a external webpage (On a button click Camera Intent or Gallery should open)
        }

    });

    var appView = new mainScreenView;

提前感谢。


你不能在应用程序浏览器中执行插件代码。唯一的选择是使用文件输入类型,它应该可以工作,至少在iOS上。 - jcesarmobile
是的,jcesarmobile,我最终采用了<iframe>来实现。也就是说,我使用<iframe>来代替inappBrowser来显示网页。现在我可以像使用本机手机浏览器一样使用相机或图库。 - Shashank HS
2个回答

3

我没有使用inappBrowser,而是采用了HTML iframe实现。也就是说,我想让inappBrowser做的事情,现在我可以通过iframe来完成。您可以像本机手机浏览器一样访问相机、相册或文件浏览器。

以下是我解决上述问题所做的内容:

   <html>
   <head>
      <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
      <meta name="format-detection" content="telephone=no" />
      <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
      <title>Hello World!</title>
      <style type='text/css'>
        body, html, iframe {
                     margin: 0;
                     padding: 0;
                     border: 0px none;
                     width: 100%;
                     height: 100%;
        }
      </style>
 </head>
 <body>
     <script type="text/javascript" src="cordova.js"></script>


     <iframe src="http://SomeWebPage" width="97%" height="97%"></iframe>
 </body>

希望这能帮助其他人。


你能告诉我你是如何使用上述代码来浏览或打开本机相机的吗?我正在使用https://github.com/apache/cordova-plugin-inappbrowser这个IAB,在其中我调用了我的外部网站。 - Nak Android Dev
你能给我一个完整的工作示例吗?我已经尝试了上面的代码,但在我的InAppBrowser中没有起作用。 - Nak Android Dev
请问您能否为我提供解决问题的方案? - Nak Android Dev
你的错误在于,你将上面的代码添加到了InAppBrowser的代码中。这就是你犯错的地方。不要使用InAppBrowser,而要使用“IFRAME”来呈现你想要在InAppBrowser中呈现的内容。这样相机和文件浏览器就能正常工作了。 - Shashank HS
1
我的整个应用程序都在IAB中;在其中的一个页面中,我有上传图片到服务器的选项,所以为了这个目的,我需要在IAB中浏览图片。对于默认的index.html文件,html5文件API运行良好。但是我需要IAB的解决方案。 - Nak Android Dev
显示剩余4条评论

0

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接