Firestore rules restrict access to the data, however the Angular project is still able to retrieve the collection - ERROR Error: Insufficient permissions or missing

I am currently working on an Angular project that is connected to a Firestore database.

Within the database, there is a collection called users, and each document within this collection contains a nested collection named hugeCollection. I have updated the default rules of Firestore with the following settings in order to restrict access to these nested collections:

service cloud.firestore {
  match /databases/{database}/documents {
    match /users/{userId}/hugeCollection/{document} {
        allow read : if false;
        allow write : if false;
    }
  }
}

Despite implementing these rule changes, my Angular project is still able to fetch data from the subCollections. When the rules are set as above, the browser's console displays the error message:

ERROR Error: Missing or insufficient permissions

However, when I modify the rules by changing the attribute values from false to true, the console errors cease to appear. Although this resolves the issue, I expected that setting the value to false would prevent querying the subCollections.

What could be causing this discrepancy? Any assistance would be greatly appreciated. Thank you.

Answer №1

After some investigation, I finally pinpointed the source of the issue.

It turns out that Firestore was functioning offline and storing data locally before I established any rules. This led to a discrepancy between the offline cache and the online database once rules were put in place in my Angular project. As a result, an error message was displayed in the browser console.

The problem became apparent when I noticed that changes made in the Firebase console were not reflected in my Angular project, indicating an issue with offline data caching.

Attempts to clear the firestore cache using the browser's 'empty cache and hard reload' feature proved fruitless. However, loading the project in incognito mode prevented the denied data from being loaded. Subsequently, normal browsing windows also refreshed the cache, effectively blocking access to restricted data.

I share this experience in the hopes that it may assist others facing similar challenges.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Displaying notification in Ionic 2

Whenever I click on the register button, if I fill out all the fields I am taken to the regsuccess page. Otherwise, I receive a message saying to fill in all required fields. However, I want to display an alert message using Ionic2 and TypeScript. HTML: ...

Getting an Angular TypeError after upgrading to version 9? It seems that the property 'selectors' cannot be read from null

After upgrading my Angular app from v7 to v8 and then v8 to v9, I encountered an issue. My app works perfectly locally when I run ng serve, but when I build for production using ng build --prod and deploy the app, I get an error in the application's c ...

Notification from the background has been received and parameters have been restored

Sending a post request from "angular->port 4200" to "expressjs server->port 8000". Referencing this example: https://github.com/kuncevic/angular-httpclient-examples/blob/master/client/src/app/app.component.ts Encountering two errors: 1) Undefined respon ...

How can we effectively test arrow functions in unit tests for Angular development?

this.function = () => { -- code statements go here -- } I am looking to write jasmine unit tests in Angular for the function above. Any suggestions on how to achieve this? it("should call service",()=>{ // I want to invoke the arrow funct ...

Changing the Text of an Anchor Tag When Clicked in Angular 2

Is there a way to toggle the text between "View" and "Hide" without using JQuery, only Angular? I've tried several methods but none have worked. Can anyone offer guidance on how to achieve this? <a class="history-link view-history-class" id="show- ...

Utilizing Angular to Handle Undefined Variables in String Interpolation

Seeking a way to showcase data obtained from an external API on a webpage using Angular's string interpolation. If no data is retrieved or is still pending, the aim is to display 'N/A'. An attempt was made following this method, but encoun ...

Issue with Angular Checkbox: Inconsistencies in reflection of changes

I'm encountering a challenge with my Angular application where I have implemented multiple checkboxes within an options form. The issue arises when changes made to the checkboxes are not consistently displayed as expected. Below is the pertinent code ...

Protected HTTP Live Streaming 128-bit AES encryption key location

After encrypting a video using HLS AES-128 with the apple tool, I have generated an m3u8 file that looks like this: #EXTM3U #EXT-X-TARGETDURATION:10 #EXT-X-MEDIA-SEQUENCE:0 #EXT-X-PLAYLIST-TYPE:VOD #EXT-X-KEY:METHOD=AES-128,URI="https://xxxxx.com/api/ ...

Running Angular/Rxjs store (ngrx) calls synchronously

After fetching 2 items from my store using ngrx, I need both requests to complete before taking further action. Here's an example of what I'm trying to achieve: const item1$: Observable<Item> = this._store$.select( ItemStoreSelectors.sele ...

When using the Angular Material table with selection enabled, the master toggle functionality should always deselect the

I made modifications to the original Angular Material Table example - Stackblitz. In my version, when some rows are selected and the master toggle is clicked, all selected rows should be deselected (similar to Gmail behavior). The functionality works, but ...

Using Angular, you can easily add a <div> dynamically to all elements that share a class

In order to implement a solution, I am tasked with adding a new div element with the class '.cart-list-value .delete-product', which will contain a background image, to all elements that have the class .cart-list-item. Although I successfully man ...

What is the best way to implement multiple HTTP subscriptions in a loop using Angular?

I find myself in a predicament where I need to iterate through an array of strings passed as parameters to a service, which then responds through the HTTP subscribe method. After that, some operations are performed on the response. The issue arises when t ...

Sign up for the category that failed to assign a worth

Currently, I have a service that includes a getter and setter: // Service import { Subject } from 'rxjs'; export class MyService { public currentUser: any = new Subject(); ... there is a function where I call setCurrent and assign value ...

CSS styling is not being applied to buttons within Ionic 2

I'm completely new to Ionic and hybrid apps as a whole. I've been experimenting with a test app, but for some reason, none of the CSS seems to be working. Could someone please help me figure out what mistake I might have made? Here are my files: ...

What is the best method for determining the color of the active angular theme for a particular component, such as the hover background of a button?

When using Angular 7 and material design to display a list, I encountered an issue with hover colors. The preset $primary, $accent, and $warn colors were not working well for this purpose. I wanted the hover color of the list items to match that of a butto ...

Having difficulty storing duplicate requests that are crucial for various services/components

Currently, I am tackling a project that involves displaying multiple sets of data to the user. Each set requires several requests to be made to the backend. Specifically, for the UserDetails dataset, I must query the getUser and getSigns endpoints. However ...

What is the process for including a version number in npm pack?

I've been working on deploying TeamCity with NPM pack, and I've noticed that it's packaging everything up as filename-0.0.0.tgz. So, I decided to switch to the command line to troubleshoot before running it through TC. When I run npm pack i ...

The TypeScript compiler throws an error when encountering nulls in conjunction with the isNull function

Whenever I set strictNullChecks: true in tsconfig.json and utilize the isNull function for null checks, the compiler throws the error TS2531: Object is possibly 'null'. Interestingly, isNull doesn't trigger any errors in VsCode, however, the ...

Angular 2 Unit test issue: Unable to resolve parameters for 'RequestOptions' class

I am currently working on testing a simple component that has some dependencies. One of the requirements is to provide certain providers for the test. /* tslint:disable:no-unused-variable */ import { By } from '@angular/platform-browser&ap ...

Executing Angular within a Virtual Directory on IIS

My query pertains to Angular2+ (not AngularJS) We are facing an issue while trying to host our Angular site under a virtual directory within a website on IIS. The specific setup involves a Website named Development located at: C:\inetpub\wwwroo ...