AWS-Amplify Authenticator supporting authenticated and non-authenticated pages

Question

Is it possible to use the Authenticator in aws-amplify to only secure certain pages so that authenticated users can access them while still allowing others pages to be accessed by anyone regardless of whether they are logged in or not? I see in the documentation examples where the entire app is forced to login but I'm not sure if you could wrap certain routes inside a react router to only be secured.

Answer 1

The documentation shows example of wrapping entire App class. One easiest alternative is to withAuthenticator(Whatever_Component_That_Requires_Auth) instead of the whole App.

Or use Authenticator component instead of withAuthenticator HOC to have more flexiblility.

Another approach is to check auth state from API in your components.

import { Auth } from 'aws-amplify';

    Auth.currentAuthenticatedUser()
      .then(user => console.log('is in'))
      .catch(err => console.log('is not in'));

This tutorial provides another approach: https://github.com/richardzcode/Journal-AWS-Amplify-Tutorial