Code Monkey home page Code Monkey logo

flowpack.neos.frontendlogin's Introduction

Flowpack.Neos.FrontendLogin

Neos plugin demonstrating a simple "frontend login"

DISCLAIMER:

This package mainly serves for demonstration purpose. You should be fine using it in productive applications, but if you need any custom behavior/style it's probably the easiest to create your own login form plugin. It's just a few files.

How-To:

  • Install the package to Packages/Plugin/Flowpack.Neos.FrontendLogin (e.g. via composer require flowpack/neos-frontendlogin:~2.0)
  • Login to the Neos backend and create a new page "Login" (e.g. at /login)
  • On that page insert the new plugin Frontend login form
  • (Optionally) create a page (and subpages) for a "Members area" (e.g. at /members) and protect it as documented below
  • Publish all changes
  • Create a new Frontend User (you can use the typo3.neos:user:create command, e.g. ./flow user:create --authentication-provider "Flowpack.Neos.FrontendLogin:Frontend" --roles "Flowpack.Neos.FrontendLogin:User")

Now you should be able to test the frontend login by navigating to /login.html

Protected Member Area

If you want to create a "Member Area" that is only visible to authenticated frontend users, add the following Policy.yaml to your site package:

privilegeTargets:

  'TYPO3\TYPO3CR\Security\Authorization\Privilege\Node\ReadNodePrivilege':

    'Acme.YourPackage:MembersArea':
        # Replace <NodeIdentifier> with the node's identifier to be targeted (you can see the identifier in the "Additional info" group in the Property Inspector of the Neos Backend)
      matcher: 'isDescendantNodeOf("<NodeIdentifier>")'


roles:

  'Flowpack.Neos.FrontendLogin:User':
    privileges:
      -
          # Grant "frontend users" access to the "Member area"
        privilegeTarget: 'Acme.YourPackage:MembersArea'
        permission: GRANT


  'TYPO3.Neos:Editor':
    privileges:
      -
          # Grant "backend users" to access the "Member area" - Otherwise those pages would be hidden in the backend, too!
        privilegeTarget: 'Acme.YourPackage:MembersArea'
        permission: GRANT

The specified node and all its child-nodes will be hidden from anonymous users!

Note: Replace "Acme.YourPackage" with the package key of your site package and replace "<NodeIdentifier>" with the node identifier of the "member area" node (as described).

Rewriting the template path to your package:

You might want to modify the template(s) according to your needs. Create a Views.yaml file and add the following configuration there:

-
  requestFilter: 'isPackage("Flowpack.Neos.FrontendLogin") && isController("Authentication") && isAction("index")'
  options:
    templatePathAndFilename: 'resource://Acme.YourPackage/Private/Templates/Authenticate/Index.html'

Adjust the actual value in templatePathAndFilename to your needs and copy the original template to that location in order to adjust it at will.

Redirect after login/logout:

Since version 2.1 it's possible to specify pages the user will be redirected to after login and/or logout.

Hint: In order to redirect to an external URL you can create a Shortcut node pointing to that URL and specify it as target for the* redirect options.

flowpack.neos.frontendlogin's People

Contributors

afoeder avatar bwaidelich avatar dfeyer avatar dlubitz avatar ger4003 avatar gerdemann avatar johannessteu avatar kdambekalns avatar skurfuerst avatar

Watchers

 avatar  avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.