How to use Node-Casbin in Angular?

Question

Got a question regarding Node-Casbin library. I want to use this library in Angular, on the Front-end side. Unfortunately, I don't have a clue how could I do that. I want to use this library with strings. So I want to declare policies and data as a string - not as files.

1. Used Angular: 10.0.0
2. Used Casbin Version: 5.1.6

All I did with coding: In package.json I added this code:

  "browser": {
    "fs": false,
    "path": false,
    "os": false
  },

And I added code to service like:

  async loadEnforcer() {
    const enforcer = (await new Enforcer().initWithString(
      this.policy,
      this.dataSet
    )) as any;
    const sub = 'alice'; // the user that wants to access a resource.
    const obj = '/alice_data/'; // the resource that is going to be accessed.
    const act = 'GET'; // the operation that the user performs on the resource.

    console.log(enforcer);

    console.log(
      'the user permission is : ' + enforcer.getPermissionsForUser('alice')
    );

    if (enforcer.enforce(sub, obj, act) === true) {
      console.log('permit alice to read data1');
    } else {
      console.log('deny the request, show an error');
    }
  }

But still I receive an error from Angular like:

core.js:4197 ERROR Error: Uncaught (in promise): TypeError: fs_1.readFileSync is not a function
TypeError: fs_1.readFileSync is not a function
    at Config.parse (config.js:64)
    at Function.newConfig (config.js:29)
    at Model.loadModel (model.js:109)
    at Object.newModel (model.js:291)
    at Enforcer.<anonymous> (enforcer.js:62)
    at Generator.next (<anonymous>)
    at enforcer.js:21
    at new ZoneAwarePromise (zone-evergreen.js:960)
    at push.../../node_modules/casbin/lib/enforcer.js.__awaiter (enforcer.js:17)
    at Enforcer.initWithAdapter (enforcer.js:61)
    at resolvePromise (zone-evergreen.js:798)
    at zone-evergreen.js:705
    at rejected (tslib.es6.js:72)
    at ZoneDelegate.invoke (zone-evergreen.js:364)
    at Object.onInvoke (core.js:27437)
    at ZoneDelegate.invoke (zone-evergreen.js:363)
    at Zone.run (zone-evergreen.js:123)
    at zone-evergreen.js:857
    at ZoneDelegate.invokeTask (zone-evergreen.js:399)
    at Object.onInvokeTask (core.js:27425)

I tried to do in the same way as it is there https://github.com/kowthalganesh/casbin-angular/blob/master/src/app/app.component.ts - But still I receive an Error.

Can you help me with it? Thank you so much!

Answer 1

You should never include such logic on the client side. Besides that you have no file system in the browser (on which the libary seems to depend on) it would be a high security issue to include such stuff in the frontend.

If you really need to include such features into your application it should be placed in the backend only.