Handling Logged in Users in Amp

Amp-Project

Amp is all well and good for serving the pages at a fast pace, google maintains cache at its own and serve the pages faster, however, you can’t use the Jquery or vanilla Java-script. For login you can just redirect them to signin/signup(non-amp), but when the users come back on amp pages, you want to see them as logged in, right. But there is no way to do that except for these tags.

These tags can help you manage the state of the user via the use of simple API’s.

1. amp-access
2. amp-mustache

amp-access — Basically a way for you to configure if else conditions along with the other variables needed for rendering the authorization part.

Amp Access

The authorization key in the above snippet basically calls the api while the page is getting loaded, you can return the variables in the form of json, for e.g. I am returning

{
“error”: false,
“loggedIn”: true,
“powerUser”: false,
“name”: current_user.name,
“image”: current_user.asset.url(:thumb)
}

If there is an issue with the api, it fallback to default parameters(authorizationFallbackResponse).

Amp Access Html

2. amp-mustache

This will help you in binding the variables you sent and assign it to the template, without this your variables won’t bind.

Just put the above in the html and see the magic, the user will be logged in and you will be able to see the image.