Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We鈥檒l occasionally send you account related emails.

Already on GitHub? Sign in to your account

docs: add a tutorial about authentication #3046

Merged
merged 1 commit into from Jun 13, 2019

Conversation

Projects
None yet
6 participants
@emonddr
Copy link
Contributor

commented Jun 4, 2019

Add a tutorial about authentication.
Instructions to download and run the
completed loopback4-example-shopping application, and
an explanation of how authentication was
added to the loopback4-example-shopping application.

Related to: #2940

Checklist

馃憠 Read and sign the CLA (Contributor License Agreement) 馃憟

  • npm test passes on your machine
  • New tests added or existing tests modified to cover all changes
  • Code conforms with the style guide
  • API Documentation in code was updated
  • Documentation in /docs/site was updated
  • Affected artifact templates in packages/cli were updated
  • Affected example projects in examples/* were updated

馃憠 Check out how to submit a PR 馃憟

@emonddr emonddr force-pushed the dremond_authentication_tutorial branch from 81966f1 to c9c960b Jun 5, 2019

@emonddr emonddr marked this pull request as ready for review Jun 5, 2019

@emonddr emonddr requested review from bajtos and raymondfeng as code owners Jun 5, 2019

@emonddr emonddr requested a review from jannyHou Jun 5, 2019

@emonddr emonddr self-assigned this Jun 5, 2019

LoopBack 4 has an authentication package `@loopback/authentication` which allows
you to secure your API endpoints with custom authentication strategies that
implement a common interface and are registered via an extensionPoint/extension
pattern.

This comment has been minimized.

Copy link
@raymondfeng

raymondfeng Jun 5, 2019

Member

The sentence seems to be too long.

keywords: LoopBack 4.0, LoopBack 4, Authentication, Tutorial
sidebar: lb4_sidebar
permalink: /doc/en/lb4/authentication-tutorial.html
summary: A LoopBack 4 application that uses authentication

This comment has been minimized.

Copy link
@raymondfeng

raymondfeng Jun 5, 2019

Member

Maybe How to secure your LoopBack 4 application with authentication?

5. Build and start the application

```sh
npm start

This comment has been minimized.

Copy link
@raymondfeng

raymondfeng Jun 5, 2019

Member

Can we have all steps in one block? Such as:

git clone git@github.com:strongloop/loopback4-example-shopping.git
cd loopback4-example-shopping
npm i
npm run docker:start
npm start

This comment has been minimized.

Copy link
@dhmlau

dhmlau Jun 5, 2019

Contributor

should this be part of the README in the loopback4-example-shopping repo? In here, we can simply direct the users to go to that README for instructions? Just a suggestion.

This comment has been minimized.

Copy link
@dhmlau

dhmlau Jun 6, 2019

Contributor

FYI - I don't have a strong preference whether those commands should be inlined or in the example-shopping repo.

This comment has been minimized.

Copy link
@emonddr

emonddr Jun 6, 2019

Author Contributor

@dhmlau , I think we should have it in both.

implement a common interface and are registered via an extensionPoint/extension
pattern.

## Try it out

This comment has been minimized.

Copy link
@raymondfeng

raymondfeng Jun 5, 2019

Member

It's a bit out of context to have Try it out here. At least something like Try out authentication in an example.

This comment has been minimized.

Copy link
@raymondfeng

raymondfeng Jun 5, 2019

Member

Maybe we should add some more information before try it out.

This comment has been minimized.

Copy link
@emonddr

emonddr Jun 11, 2019

Author Contributor

@raymondfeng

It's a bit out of context to have Try it out here. At least something like Try out authentication in an example.

All the tutorials have a section title Try it out.

This comment has been minimized.

Copy link
@emonddr

emonddr Jun 11, 2019

Author Contributor

@raymondfeng

Maybe we should add some more information before try it out.

I added a section before Try it out.

{"id":"1","name":"User One"}
```

## Adding Authentication to a LoopBack 4 Application

This comment has been minimized.

Copy link
@raymondfeng

raymondfeng Jun 5, 2019

Member
  1. Can you describe how authentication is needed for the shopping example?
  2. Can you get one of the architectural diagrams to help our users establish the big picture first?

This comment has been minimized.

Copy link
@emonddr

emonddr Jun 11, 2019

Author Contributor

@raymondfeng

Can you describe how authentication is needed for the shopping example?
Can you get one of the architectural diagrams to help our users establish the big picture first?

I think my new intro paragraph and JWT diagram gives a decent idea. At the end of the document I point them to the Authentication Component document. It has architectual diagrams. I think it is best not to duplicate in many places.

Let me know if my new intro and diagram are sufficient. thanks.

@dhmlau
Copy link
Contributor

left a comment

@emonddr, nice tutorial. Is this tutorial only about JWT authentication? If yes, perhaps we can make it clear in the overview. If not but it's similar enough for other kinds of authentication, maybe we can add some side note or another session in how to get other authentication strategies to work.

I vaguely remember there might be another tutorial for the passport strategies after @jannyHou's task is done, so maybe it's only a matter of specifying this tutorial is for JWT. Thanks.

5. Build and start the application

```sh
npm start

This comment has been minimized.

Copy link
@dhmlau

dhmlau Jun 5, 2019

Contributor

should this be part of the README in the loopback4-example-shopping repo? In here, we can simply direct the users to go to that README for instructions? Just a suggestion.

@dhmlau dhmlau referenced this pull request Jun 6, 2019

Closed

Add documentation for this example #69

0 of 3 tasks complete

@emonddr emonddr force-pushed the dremond_authentication_tutorial branch 2 times, most recently from 8e55bea to 63f5e25 Jun 11, 2019

The core of authentication framework is found in the
[AuthenticationComponent](https://github.com/strongloop/loopback-next/blob/master/packages/authentication/src/authentication.component.ts),
so it is important to `add` the component in the `ShoppingApplication` class in
`loopback4-example-shopping/packages/shopping/src/application.ts`.

This comment has been minimized.

Copy link
@raymondfeng

raymondfeng Jun 11, 2019

Member

A link please.

interface.
A custom JWT authentication strategy `JWTAuthenticationStrategy` in
`loopback4-example-shopping/packages/shopping/src/authentication-strategies/jwt-strategy.ts`

This comment has been minimized.

Copy link
@raymondfeng

raymondfeng Jun 11, 2019

Member

A link please.

@raymondfeng
Copy link
Member

left a comment

Approved with some suggestions.

for more details.

To view and run the completed `loopback4-example-shopping` application, follow
the instructions in the [Try it out](try-it-out) section.

This comment has been minimized.

Copy link
@dhmlau

dhmlau Jun 11, 2019

Contributor

If it's pointing to the "try it out" section below, should it be:

[Try it out](#try-it-out) 

It's a broken link for me.

This comment has been minimized.

Copy link
@emonddr

emonddr Jun 11, 2019

Author Contributor

Oops, forgot the #.

@dhmlau

dhmlau approved these changes Jun 11, 2019

Copy link
Contributor

left a comment

I've left 2 comments regarding the broken links. Please fix it before merging. Other than that, LGTM. Thanks.


To understand the details of how JWT authentication can be added to a LoopBack 4
application, read the
[Adding JWT Authentication to a LoopBack 4 Application](adding-jwt-authentication-to-a-loopback-4-application)

This comment has been minimized.

Copy link
@dhmlau

dhmlau Jun 11, 2019

Contributor

same comment as above. I think it's:

[Adding JWT Authentication to a LoopBack 4 Application](#adding-jwt-authentication-to-a-loopback-4-application)

@emonddr emonddr force-pushed the dremond_authentication_tutorial branch from d9e8922 to aa70ef4 Jun 12, 2019

@emonddr emonddr requested review from b-admike and removed request for bajtos Jun 12, 2019

@nabdelgadir
Copy link
Contributor

left a comment

Don't forget to add it to https://loopback.io/doc/en/lb4/Tutorials.html 馃憤

@emonddr

This comment has been minimized.

Copy link
Contributor Author

commented Jun 12, 2019

Don't forget to add it to https://loopback.io/doc/en/lb4/Tutorials.html 馃憤

Hmm, this tutorial is different than the tutorials shipped with loopback-next. It is in its own strongloop/loopback4-example-shopping repo, and cannot be downloaded by the lb4 example .

@raymondfeng @dhmlau please provide your feedback on this one.

@b-admike
Copy link
Member

left a comment

Great writeup 馃憦 - please look at @nabdelgadir's comments before landing.

@emonddr emonddr force-pushed the dremond_authentication_tutorial branch from aa70ef4 to 1b299b2 Jun 12, 2019

@nabdelgadir
Copy link
Contributor

left a comment

LGTM besides the nitpick below and #3046 (comment) 馃憦

In the `UserController` class in the
[loopback4-example-shopping/packages/shopping/src/controllers/user.controller.ts](https://github.com/strongloop/loopback4-example-shopping/blob/master/packages/shopping/src/controllers/user.controller.ts),
a user can print out his/her user profile by performing a `GET`request on the

This comment has been minimized.

Copy link
@nabdelgadir

nabdelgadir Jun 12, 2019

Contributor

missing space between GET and request

@emonddr emonddr force-pushed the dremond_authentication_tutorial branch from 1b299b2 to c5d4a5c Jun 12, 2019

@emonddr emonddr force-pushed the dremond_authentication_tutorial branch 3 times, most recently from c5067f6 to 3410c56 Jun 12, 2019

docs: add a tutorial about authentication
Add a tutorial about authentication.
Instructions to download and run the
completed loopback4-example-shopping application, and
an explanation of how authentication was
added to the loopback4-example-shopping application.

@emonddr emonddr force-pushed the dremond_authentication_tutorial branch from 3410c56 to 794fff7 Jun 13, 2019

@emonddr emonddr removed the request for review from jannyHou Jun 13, 2019

@jannyHou
Copy link
Contributor

left a comment

Great effort 馃憤 馃憤 just two nitpicks, feel free to address them or ignore if you have a better reason :shipit:

`Authorization` header of the request.
Basically, the
[AuthenticateFn](https://github.com/strongloop/loopback-next/blob/master/packages/authentication/src/providers/auth-action.provider.ts)

This comment has been minimized.

Copy link
@jannyHou

jannyHou Jun 13, 2019

Contributor

@emonddr I think a more accurate word here would be Authenticate action

That action, exported as a provider, returns a function in type AuthenticateFn, so AuthenticateFn is actually a type. The action name should still be "authenticate"

`JWTService` is used in two places within the application:
`JWTAuthenticationStrategy` in
`loopback4-example-shopping/packages/shopping/src/authentication-strategies/jwt-strategy.ts`,

This comment has been minimized.

Copy link
@jannyHou

jannyHou Jun 13, 2019

Contributor

JWTAuthenticationStrategy in loopback4-example-shopping/packages/shopping/src/authentication-strategies/jwt-strategy.ts to generate the token and UserController in
loopback4-example-shopping/packages/shopping/src/controllers/user.controller.ts to decode the token.

This comment has been minimized.

Copy link
@emonddr

emonddr Jun 13, 2019

Author Contributor

I will address them in a different PR. I waited until late tonight to be able to merge...my branch is always behind the master during the day...because travis takes so long to run.

@emonddr emonddr merged commit 3d5ddc9 into master Jun 13, 2019

4 checks passed

clahub All contributors have signed the Contributor License Agreement.
Details
continuous-integration/appveyor/pr AppVeyor build succeeded
Details
continuous-integration/travis-ci/pr The Travis CI build passed
Details
coverage/coveralls Coverage remained the same at 91.714%
Details

@delete-merged-branch delete-merged-branch bot deleted the dremond_authentication_tutorial branch Jun 13, 2019

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can鈥檛 perform that action at this time.