

Onsen UI V2 Angular 1 Splitterテンプレートを使って開発を始めました。  
実行環境は Android です。

<http://docs.monaca.io/ja/reference/cordova_6.2/file/>  
<http://poyo.hatenablog.jp/entry/2016/11/05/014205>

を参考にCordovaプラグインのFileを有効にして、開発を進めているのですが、以下のエラーが出てファイル一覧が取得できません。

[code]

    Uncaught TypeError: window.requestFileSystem is not a function
    
[/code]

何をどうしたらエラーが出なくなるのか分からずに困っています。  
コメントアウトは試行錯誤の跡として残してあります。  
どうか助けをよろしくお願いします。

[code]

    <!DOCTYPE HTML>
    <html id="myApp">
    <head>
      <meta charset="utf-8">
      <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
      <meta http-equiv="Content-Security-Policy" content="default-src * data:; style-src * 'unsafe-inline'; script-src * 'unsafe-inline' 'unsafe-eval'">
      <script src="lib/angular/angular.min.js"></script>
      <script src="lib/onsenui/js/onsenui.min.js"></script>
      <script src="lib/onsenui/js/angular-onsenui.min.js"></script>
      <script src="components/loader.js"></script>
      
      <link rel="stylesheet" href="components/loader.css">
      <link rel="stylesheet" href="lib/onsenui/css/onsenui.css">
      <link rel="stylesheet" href="lib/onsenui/css/onsen-css-components.css">
      <link rel="stylesheet" href="css/style.css">
    
      <script>
        document.addEventListener("deviceready", onDeviceReady, false);
        function onDeviceReady() {
            //alert("Fileプラグインが利用できます。");
            window.requestFileSystem  = window.requestFileSystem || window.webkitRequestFileSystem;
            //window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, success, error);
            var grantedBytes = 0;// 1024*1024*10; // 10MB
            window.requestFileSystem(PERSISTENT, grantedBytes, /*$scope.*/fileSystemReceived, /*$scope.*/errorHandler);
        }
        
        myApp = ons.bootstrap();
        myApp.controller('AppController', function($scope) {
            this.load = function(page) {
              $scope.splitter.content.load(page);
              $scope.splitter.left.close();
            };
    
            this.toggle = function() {
              $scope.splitter.left.toggle();
            };
          });
    
    myApp.controller("SampleController", ["$scope", "FileSystem", function($scope, FileSystem){
      FileSystem.getFileSystem()
      .then(function(fs){
        $scope.ROOT_PATH = fs.root.toURL(); /* ルートへのパスを取得 */
      }, 
      function(error){
        alert("エラーです");
      });
      
        $scope.fileSystemReceived = function (fileSystem) {
            fileSystem.root.getFile("souvenirs.json", { create: true, exclusive: false }, $scope.fileEntryReceived, $scope.errorHandler);
        }
    
        $scope.fileEntryReceived = function (fileEntry) {
            fileEntry.createWriter($scope.fileWriterReceived, errorHandler);
        }
    
        $scope.fileWriterReceived = function (fileWriter) {
            var listeSouvenirsText = angular.toJson($scope.listeSouvenirs);
            fileWriter.write(listeSouvenirsText);
        }
    
        $scope.errorHandler = function (error) {
            console.log(error);
        }
      
    }]);
    
    myApp.factory("FileSystem", ["$q", function($q){
        return {
            getFileSystem: function(){
                let deferred = $q.defer();
                //window.requestFileSystem  = window.requestFileSystem || window.webkitRequestFileSystem;
                
                var requestedBytes = 1024*1024*10; // 10MB
                navigator.webkitPersistentStorage.requestQuota (
                    requestedBytes,
                    function (grantedBytes) {
                        window.requestFileSystem(PERSISTENT, grantedBytes, /*$scope.*/fileSystemReceived, /*$scope.*/errorHandler);
                    },
                    /*$scope.*/errorHandler
                );
                /*
                window.requestFileSystem(window.PERSISTENT, 0, function(filesystem){
                    deferred.resolve(filesystem);
                }, function(error){
                    deferred.reject(error);
                });
                */
                return deferred.promise;
            }
            
        };
    }]);
    
        function errorHandler(error) {
            console.log(error);
        }
    
        function fileSystemReceived(fileSystem) {
            fileSystem.root.getFile("souvenirs.json", { create: true, exclusive: false }, $scope.fileEntryReceived, $scope.errorHandler);
        }
        
        ons.ready(function() {
            //console.log("Onsen UI is ready!");
            //window.requestFileSystem  = window.requestFileSystem || window.webkitRequestFileSystem;
        });
      </script>
    </head>
    <body>
    
      <ons-splitter ng-controller="AppController as app" var="splitter">
        <ons-splitter-side side="left" width="220px" collapse swipeable>
          <ons-page>
            <ons-list>
              <ons-list-item ng-click="app.load('home.html')" tappable>
                Home
              </ons-list-item>
              <ons-list-item ng-click="app.load('settings.html')" tappable>
                Settings
              </ons-list-item>
              <ons-list-item ng-click="app.load('about.html')" tappable>
                About
              </ons-list-item>
            </ons-list>
          </ons-page>
        </ons-splitter-side>
        <ons-splitter-content page="test.html"></ons-splitter-content>
      </ons-splitter>
    
     <ons-template id="test.html" ng-controller="SampleController">
      <ons-page>
        <ons-toolbar>
          <div class="center">Test</div>
        </ons-toolbar>
        <h1>てすと</h1>
        <span>{{ROOT_PATH}}</span>
      </ons-page>
    </ons-template>
    </body>
    </html>
    
[/code]


CC BY-SA 4.0
2017-01-23T12:06:33.367
32086
2022-01-12T01:10:29.780
2022-01-12T01:10:29.780
3060
20359
question
android monaca cordova
FileプラグインのAPIで「Uncaught TypeError: window.requestFileSystem is not a function」のエラーが発生する


Android6.0の端末で試してみました。  
CordovaのFileプラグインがインストールされていない場合に同じエラーが発生します。  
[![エラーログ](https://i.stack.imgur.com/J34yh.png)](https://i.stack.imgur.com/J34yh.png)

この後にCorodvaのFileプラグインをインストールすることでエラーが発生しなくなりました。  
正しくプラグインをインストールできているかご確認ください。


CC BY-SA 3.0
2017-01-24T03:10:56.980
32102
2017-01-24T03:10:56.980
20272
32086
answer