Question

我观看并阅读了一堆视频和教程，但我收到403错误。

我正在使用Angular 1。

首先，我制作了一个Angular指令，因为ng-model不适用于文件。我打电话给我的指令file-model：

app.directive('fileModel',['$parse', function ($parse){
  return {
    restrict: 'A',
    link: function (scope, element, attrs) {
      element.bind('change', function () {
        $parse(attrs.fileModel)
        .assign(scope, element[0].files[0])
        scope.$apply();
      })
    }
  }
}]);

然后我在HTML模板中使用了我的指令：

<form ng-submit="uploadFile(file)">
      <input type="file" accept="txt" file-model="file" class="form-control">
      <button type="submit" class="btn btn-primary">Upload File</button>
</form>

我在控制器中创建了一个处理程序：

  app.controller('myController', ['$scope', '$firebaseStorage', function($scope, $firebaseStorage) {

  // Create a Firebase Storage reference
  var storage = firebase.storage();
  var storageRef = storage.ref();
  var filesRef = storageRef.child('files');

  $scope.uploadFile = function(file) {
    console.log("Let's upload a file!");
    console.log($scope.file);
    var storageRef = firebase.storage().ref("files");
    $firebaseStorage(filesRef).$put($scope.file);
  };

}]);

最后，我将Firebase存储规则设置为“public”：

service firebase.storage {
  match /b/myFirebaseProject.appspot.com/o {
    match /{allPaths=**} {
      allow read, write: if request.auth != null;
    }
  }
}

运行所有这些，我可以选择我的测试文件，点击Upload File，然后将文件加载到$scope。我的指示正在发挥作用但后来我收到一条错误消息：

POST https://firebasestorage.googleapis.com/v0/b/myFirebaseProject.appspot.com/o?name=files 403 ()

我尝试在Firebase存储中创建一个files文件夹，但我收到了相同的403错误。

谢谢！

Answer 1

您发布的规则不公开，需要身份验证。相反，你想使用类似的东西：

service firebase.storage {
  match /b/myFirebaseProject.appspot.com/o {
    match /{allPaths=**} {
      allow read, write;
    }
  }
}

或在您的应用中使用Firebase身份验证。

如何使用AngularFire将文件上传到Firebase存储？

1 个答案: