Firebase Security Rules Block Writing to Firebase

Question

Note: This question is tagged polymer because the Polymer library is used to generate the Javascript.

This question is about two different but related problems dealing with Firebase security. Problem 1 and Problem 2 seem to suggest opposite realities and opposite results when trying to get the Firebase security rules to work. (FWIW: Here is my prior unsuccessful attempt to write this question.)

Here is the live code in a JSBin.

http://jsbin.com/hinehoyigo/edit?html,output

Problem 1

Firebase Security Rules Block Writing to Firebase

Instructions

1. Enter your firebase ID. Example: "hot-sauce-123"
2. In a new tab or window, go to your firebase and open it
3. Allow anonymous auth: Your firebase > Login & Auth > Anonymous tab > Check "Enable Anonymous User Authentication"
4. Apply no security rules: Security & Rules >

   {
         "rules": {
           ".read": true,
           ".write": true
         }
       }

5. Return back to jsbin
6. Select "anonymous" as auth provider: dropdown menu > anonymous
7. Click button labeled "login"
8. Verify login status per fields to right
9. Open your console: Chrome > View > Developer > Developer Tools
10. Click button labeled "Print User to console"
11. Double-check login status by verifying user object printed to console
12. Click button labeled "Print Firebase to console"
13. Verify correct firebase by checking Firebase URL printed to console
14. Click button labeled "Write to Firebase — Plain Url"
15. Check your firebase data; notice no write occured
16. Click button labeled "Write to Firebase — .json Url"
17. Check your firebase data; notice successful write
18. Distinguish the two write attempts because former attempts to write {"quux":"baz"}; latter attempts to write {"jquux":"jbaz"}
19. Add security rules: Security & Rules >

    {
                "rules": {
                    "users": {
                        "$uid": {
                            ".read": "auth != null && auth.uid === $uid",
                            ".write": "auth != null && auth.uid === $uid"
                        }
                    }
                }
            }

20. Click again the button labeled "Write to Firebase — .json Url"
21. Check your firebase data; notice write NOW FAILS
22. Conclusion / Problem Statement: Firebase security rules block writing to Firebase.

Problem 2

Simulator blocks .json URL from being used (as required above)

Instructions

1. Open your Firebase
2. Verify security rules are in place (see above step #19 in Problem #1)...
3. Open your simulator: Vertical Navigation Menu > Simulator
4. Check radio button labeled "Custom Auth"
5. Custom Auth input field should read something like "{ provider: 'anonymous', uid: 'ag69g401-f097-4171-bca4-927fd1a6e1f3' }"
6. Click button labeled "Authenticate"
7. Verify little green check mark is next to radio button labeled "Custom Auth"
8. Go to section 2
9. Click tab labeled "Write"
10. In input field labeled URL, enter "users/ag69g401-f097-4171-bca4-927fd1a6e1f3/foo/bar"
11. Verify the user ID in the URL path you just entered, matches the uid value in the above Custom Auth field
12. Click button labeled "Simulate Write"
13. Notice response says something like:
    Attempt to write {"key":"value"} to /users/ag69g401-f097-4171-bca4-927fd1a6e1f3/foo/bar with auth={"provider":"anonymous","uid":"ag69g401-f097-4171-bca4-927fd1a6e1f3"}
    

    /
    /users
    /users/ag69g401-f097-4171-bca4-927fd1a6e1f3:.write: "auth != null && auth.uid === $uid"
        => true

    Write was allowed.
14. Notice: This result is the opposite result from above steps #14 and #15 where the plain URL (without .json appended) failed to write
15. Append ".json" to the URL so the input field reads something like "users/ag69g401-f097-4171-bca4-927fd1a6e1f3/foo/bar.json"
16. Click button labeled "Simulate Write"
17. Notice response says something like:
    Invalid path. Simulation aborted.
18. Notice: This result is the opposite result from above steps #16 and #17 where the .json appended URL was the only one that worked;
19. Notice these simulator tests suggest the opposite results than those tested from the live code in above Problem #1

Answer 1

Problem 1

You're using the Polymer firebase-auth element to authenticate with Firebase.

<firebase-auth id="firebaseLogin"
               user="{{user}}"
...

Under the hood this calls the Firebase.authAnonymously() method, which authenticates the current session in the Firebase JavaScript SDK.

You're writing to Firebase using:

computeFbTargetJson: function(f) {
    return f + '.json';
}

and

this.set('$.ajax.url'  , this.fbTargetJson);
this.set('$.ajax.body' , JSON.stringify({
    jquux: 'jbaz'
   }));
this.$.ajax.generateRequest();

This is doing an AJAX request to Firebase, which means that you're using Firebase's REST API. But since this is a regular HTTP call, it will not "inherit" then authentication from the Firebase JavaScript client.

To authenticate your REST request, you will need to pass in an auth parameter as documented in the Firebase documentation. You can get the token from the Firebase reference using ref.getAuth().token.

Problem 2

Each element in your Firebase database is accessibly by a unique URL. You can either access it with one of the Firebase SDKs or by directly accessing the REST API that Firebase exposes.

From what I can gather from the jsbin, you're writing to Firebase using:

computeFbTargetJson: function(f) {
    return f + '.json';
}

and

this.set('$.ajax.url'  , this.fbTargetJson);
this.set('$.ajax.body' , JSON.stringify({
    jquux: 'jbaz'
   }));
this.$.ajax.generateRequest();

This is doing an AJAX request to Firebase, which means that you're using Firebase's REST API. The first paragraph of that API documentation explains how Firebase database URLs map to the REST API:

We can use any Firebase app URL as a REST endpoint. All we need to do is append .json to the end of the URL and send a request from our favorite HTTPS client.

So in order to access any data in Firebase using the REST API, you append .json to the URL of that data.

When you're using the Firebase Simulator, the operation is similar to using Firebase's JavaScript SDK. In that case, you should not put the .json suffix at the end of the URL.

So given a Firebase database at https://mine.firebaseio.com/, say you have a user profile at /users/de01fc8104.

• You can access that record in the simulator or with a Firebase SDK as https://mine.firebaseio.com/users/de01fc8104
• To access the record using the REST API, the URL is https://mine.firebaseio.com/users/de01fc8104.json

Summary

Both of your problems are caused by the fact that you're using two different ways of accessing Firebase: the JavaScript SDK and the REST API. While these two methods can be used together, you will have to ensure you provide the information that is needed. In general you will have an easier experience if you stick to using one way of accessing Firebase from a single client.

Answer 2

@FrankvanPuffelen's answer in Polymer-speak translates into:

Use the <firebase-collection> element's .add() method to write data to Firebase from the client while under security rule enforcement. It's more efficient from a code standpoint as firebase-collection handles all the necessary auth tokens for you automatically.