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’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Example] with-passport #10529

Merged
merged 19 commits into from
Mar 19, 2020
Merged

[Example] with-passport #10529

merged 19 commits into from
Mar 19, 2020

Conversation

lfades
Copy link
Member

@lfades lfades commented Feb 14, 2020

The example is not using a DB so it works with ZEIT Now deployments with no additional steps, and to make the install and setup faster.

The example does simple cookie based authentication, the cookie has very good defaults based on Auth0's example and it's encrypted with @hapi/iron.

No SSR, pages that depend on the user fetch may have an initial wrong state, which is fixed after the user request, usually you would use an skelethon and handle the loading state, that's not included in the example to avoid adding more complexity (more JS code) to it.

Read the readme for more details.

@ijjk
Copy link
Member

ijjk commented Feb 14, 2020

Stats from current PR

Default Server Mode
General
zeit/next.js canary lfades/next.js example/with-passport Change
buildDuration 12.5s 12.6s ⚠️ +135ms
nodeModulesSize 52.8 MB 52.8 MB
Client Bundles (main, webpack, commons)
zeit/next.js canary lfades/next.js example/with-passport Change
main-HASH.js gzip 5.13 kB 5.13 kB
webpack-HASH.js gzip 746 B 746 B
4952ddcd88e7..54d3.js gzip 4.68 kB 4.68 kB
commons.HASH.js gzip 4.06 kB 4.06 kB
de003c3a9d30..d239.js gzip 16.2 kB 16.2 kB
framework.HASH.js gzip 39.1 kB 39.1 kB
Overall change 70 kB 70 kB
Client Bundles (main, webpack, commons) Modern
zeit/next.js canary lfades/next.js example/with-passport Change
main-HASH.module.js gzip 4.13 kB 4.13 kB
webpack-HASH..dule.js gzip 746 B 746 B
4952ddcd88e7..dule.js gzip 5.56 kB 5.56 kB
de003c3a9d30..dule.js gzip 15.1 kB 15.1 kB
framework.HA..dule.js gzip 39.1 kB 39.1 kB
Overall change 64.6 kB 64.6 kB
Legacy Client Bundles (polyfills)
zeit/next.js canary lfades/next.js example/with-passport Change
polyfills-HASH.js gzip 4.76 kB 4.76 kB
Overall change 4.76 kB 4.76 kB
Client Pages
zeit/next.js canary lfades/next.js example/with-passport Change
_app.js gzip 1.15 kB 1.15 kB
_error.js gzip 4.07 kB 4.07 kB
hooks.js gzip 779 B 779 B
index.js gzip 222 B 222 B
link.js gzip 2.89 kB 2.89 kB
routerDirect.js gzip 283 B 283 B
withRouter.js gzip 282 B 282 B
Overall change 9.68 kB 9.68 kB
Client Pages Modern
zeit/next.js canary lfades/next.js example/with-passport Change
_app.module.js gzip 576 B 576 B
_error.module.js gzip 3.06 kB 3.06 kB
hooks.module.js gzip 371 B 371 B
index.module.js gzip 212 B 212 B
link.module.js gzip 2.46 kB 2.46 kB
routerDirect..dule.js gzip 273 B 273 B
withRouter.m..dule.js gzip 272 B 272 B
Overall change 7.22 kB 7.22 kB
Client Build Manifests
zeit/next.js canary lfades/next.js example/with-passport Change
_buildManifest.js gzip 61 B 61 B
_buildManife..dule.js gzip 61 B 61 B
Overall change 122 B 122 B
Rendered Page Sizes
zeit/next.js canary lfades/next.js example/with-passport Change
index.html gzip 1.04 kB 1.04 kB
link.html gzip 1.04 kB 1.04 kB
withRouter.html gzip 1.03 kB 1.03 kB
Overall change 3.11 kB 3.11 kB

Serverless Mode (Increase detected ⚠️)
General
zeit/next.js canary lfades/next.js example/with-passport Change
buildDuration 13.5s 13.7s ⚠️ +171ms
nodeModulesSize 52.8 MB 52.8 MB
Client Bundles (main, webpack, commons)
zeit/next.js canary lfades/next.js example/with-passport Change
main-HASH.js gzip 5.13 kB 5.13 kB
webpack-HASH.js gzip 746 B 746 B
4952ddcd88e7..54d3.js gzip 4.68 kB 4.68 kB
commons.HASH.js gzip 4.06 kB 4.06 kB
de003c3a9d30..d239.js gzip 16.2 kB 16.2 kB
framework.HASH.js gzip 39.1 kB 39.1 kB
Overall change 70 kB 70 kB
Client Bundles (main, webpack, commons) Modern
zeit/next.js canary lfades/next.js example/with-passport Change
main-HASH.module.js gzip 4.13 kB 4.13 kB
webpack-HASH..dule.js gzip 746 B 746 B
4952ddcd88e7..dule.js gzip 5.56 kB 5.56 kB
de003c3a9d30..dule.js gzip 15.1 kB 15.1 kB
framework.HA..dule.js gzip 39.1 kB 39.1 kB
Overall change 64.6 kB 64.6 kB
Legacy Client Bundles (polyfills)
zeit/next.js canary lfades/next.js example/with-passport Change
polyfills-HASH.js gzip 4.76 kB 4.76 kB
Overall change 4.76 kB 4.76 kB
Client Pages
zeit/next.js canary lfades/next.js example/with-passport Change
_app.js gzip 1.15 kB 1.15 kB
_error.js gzip 4.07 kB 4.07 kB
hooks.js gzip 779 B 779 B
index.js gzip 222 B 222 B
link.js gzip 2.89 kB 2.89 kB
routerDirect.js gzip 283 B 283 B
withRouter.js gzip 282 B 282 B
Overall change 9.68 kB 9.68 kB
Client Pages Modern
zeit/next.js canary lfades/next.js example/with-passport Change
_app.module.js gzip 576 B 576 B
_error.module.js gzip 3.06 kB 3.06 kB
hooks.module.js gzip 371 B 371 B
index.module.js gzip 212 B 212 B
link.module.js gzip 2.46 kB 2.46 kB
routerDirect..dule.js gzip 273 B 273 B
withRouter.m..dule.js gzip 272 B 272 B
Overall change 7.22 kB 7.22 kB
Client Build Manifests
zeit/next.js canary lfades/next.js example/with-passport Change
_buildManifest.js gzip 61 B 61 B
_buildManife..dule.js gzip 61 B 61 B
Overall change 122 B 122 B
Serverless bundles Overall increase ⚠️
zeit/next.js canary lfades/next.js example/with-passport Change
_error.js gzip 289 kB 290 kB ⚠️ +631 B
404.html gzip 1.45 kB 1.45 kB
hooks.html gzip 1.08 kB 1.08 kB
index.js gzip 289 kB 289 kB ⚠️ +196 B
link.js gzip 319 kB 319 kB -221 B
routerDirect.js gzip 316 kB 316 kB ⚠️ +40 B
withRouter.js gzip 316 kB 316 kB -53 B
Overall change 1.53 MB 1.53 MB ⚠️ +593 B

Commit: 7d80698

@vvo
Copy link
Member

vvo commented Mar 3, 2020

super cool example incoming @lfades, thanks! BTW, should we update the with-cookie example to also use hapi/iron by default + the useUser hook you added which seems to be basically what you folks are using on zeit.co? Thanks!

@lfades
Copy link
Member Author

lfades commented Mar 3, 2020

@vvo That would be great!

examples/with-passport/README.md Outdated Show resolved Hide resolved
examples/with-passport/README.md Outdated Show resolved Hide resolved
examples/with-passport/components/header.js Outdated Show resolved Hide resolved
examples/with-passport/pages/index.js Show resolved Hide resolved
examples/with-passport/lib/user.js Outdated Show resolved Hide resolved
@lfades lfades requested a review from chibicode March 3, 2020 19:07
Co-Authored-By: Shu Uesugi <shu@chibicode.com>
@ijjk
Copy link
Member

ijjk commented Mar 3, 2020

Stats from current PR

Default Server Mode
General
zeit/next.js canary lfades/next.js example/with-passport Change
buildDuration 11.5s 11.5s ⚠️ +20ms
nodeModulesSize 56.3 MB 56.3 MB
Client Bundles (main, webpack, commons)
zeit/next.js canary lfades/next.js example/with-passport Change
main-HASH.js gzip 5.76 kB 5.76 kB
webpack-HASH.js gzip 746 B 746 B
de003c3a9d30..67cb.js gzip 9.69 kB 9.69 kB
framework.HASH.js gzip 39.1 kB 39.1 kB
Overall change 55.3 kB 55.3 kB
Client Bundles (main, webpack, commons) Modern
zeit/next.js canary lfades/next.js example/with-passport Change
main-HASH.module.js gzip 4.79 kB 4.79 kB
webpack-HASH..dule.js gzip 746 B 746 B
de003c3a9d30..dule.js gzip 6.64 kB 6.64 kB
framework.HA..dule.js gzip 39.1 kB 39.1 kB
Overall change 51.3 kB 51.3 kB
Legacy Client Bundles (polyfills)
zeit/next.js canary lfades/next.js example/with-passport Change
polyfills-HASH.js gzip 18.9 kB 18.9 kB
Overall change 18.9 kB 18.9 kB
Client Pages
zeit/next.js canary lfades/next.js example/with-passport Change
_app.js gzip 1.07 kB 1.07 kB
_error.js gzip 2.98 kB 2.98 kB
hooks.js gzip 664 B 664 B
index.js gzip 222 B 222 B
link.js gzip 1.89 kB 1.89 kB
routerDirect.js gzip 279 B 279 B
withRouter.js gzip 278 B 278 B
Overall change 7.38 kB 7.38 kB
Client Pages Modern
zeit/next.js canary lfades/next.js example/with-passport Change
_app.module.js gzip 589 B 589 B
_error.module.js gzip 2.08 kB 2.08 kB
hooks.module.js gzip 370 B 370 B
index.module.js gzip 212 B 212 B
link.module.js gzip 1.48 kB 1.48 kB
routerDirect..dule.js gzip 271 B 271 B
withRouter.m..dule.js gzip 270 B 270 B
Overall change 5.27 kB 5.27 kB
Client Build Manifests
zeit/next.js canary lfades/next.js example/with-passport Change
_buildManifest.js gzip 61 B 61 B
_buildManife..dule.js gzip 61 B 61 B
Overall change 122 B 122 B
Rendered Page Sizes
zeit/next.js canary lfades/next.js example/with-passport Change
index.html gzip 936 B 936 B
link.html gzip 946 B 946 B
withRouter.html gzip 934 B 934 B
Overall change 2.82 kB 2.82 kB

Serverless Mode (Increase detected ⚠️)
General
zeit/next.js canary lfades/next.js example/with-passport Change
buildDuration 12.4s 12.4s -9ms
nodeModulesSize 56.3 MB 56.3 MB
Client Bundles (main, webpack, commons)
zeit/next.js canary lfades/next.js example/with-passport Change
main-HASH.js gzip 5.76 kB 5.76 kB
webpack-HASH.js gzip 746 B 746 B
de003c3a9d30..67cb.js gzip 9.69 kB 9.69 kB
framework.HASH.js gzip 39.1 kB 39.1 kB
Overall change 55.3 kB 55.3 kB
Client Bundles (main, webpack, commons) Modern
zeit/next.js canary lfades/next.js example/with-passport Change
main-HASH.module.js gzip 4.79 kB 4.79 kB
webpack-HASH..dule.js gzip 746 B 746 B
de003c3a9d30..dule.js gzip 6.64 kB 6.64 kB
framework.HA..dule.js gzip 39.1 kB 39.1 kB
Overall change 51.3 kB 51.3 kB
Legacy Client Bundles (polyfills)
zeit/next.js canary lfades/next.js example/with-passport Change
polyfills-HASH.js gzip 18.9 kB 18.9 kB
Overall change 18.9 kB 18.9 kB
Client Pages
zeit/next.js canary lfades/next.js example/with-passport Change
_app.js gzip 1.07 kB 1.07 kB
_error.js gzip 2.98 kB 2.98 kB
hooks.js gzip 664 B 664 B
index.js gzip 222 B 222 B
link.js gzip 1.89 kB 1.89 kB
routerDirect.js gzip 279 B 279 B
withRouter.js gzip 278 B 278 B
Overall change 7.38 kB 7.38 kB
Client Pages Modern
zeit/next.js canary lfades/next.js example/with-passport Change
_app.module.js gzip 589 B 589 B
_error.module.js gzip 2.08 kB 2.08 kB
hooks.module.js gzip 370 B 370 B
index.module.js gzip 212 B 212 B
link.module.js gzip 1.48 kB 1.48 kB
routerDirect..dule.js gzip 271 B 271 B
withRouter.m..dule.js gzip 270 B 270 B
Overall change 5.27 kB 5.27 kB
Client Build Manifests
zeit/next.js canary lfades/next.js example/with-passport Change
_buildManifest.js gzip 61 B 61 B
_buildManife..dule.js gzip 61 B 61 B
Overall change 122 B 122 B
Serverless bundles Overall increase ⚠️
zeit/next.js canary lfades/next.js example/with-passport Change
_error.js gzip 292 kB 293 kB ⚠️ +968 B
404.html gzip 1.34 kB 1.34 kB
hooks.html gzip 975 B 975 B
index.js gzip 292 kB 292 kB ⚠️ +173 B
link.js gzip 299 kB 300 kB ⚠️ +405 B
routerDirect.js gzip 298 kB 298 kB -123 B
withRouter.js gzip 299 kB 298 kB -1.14 kB
Overall change 1.48 MB 1.48 MB ⚠️ +288 B

@vvo
Copy link
Member

vvo commented Mar 5, 2020

side note @lfades, I just made a module that wraps @hapi/iron into a simple session store you can plug anywhere, let me know what you think here: https://github.com/vvo/iron-session/

I'll then plug it to my Next.js application.

@ijjk
Copy link
Member

ijjk commented Mar 18, 2020

Stats from current PR

Default Server Mode
General
zeit/next.js canary lfades/next.js example/with-passport Change
buildDuration 10.6s 10.5s -77ms
nodeModulesSize 53.2 MB 53.2 MB
Client Bundles (main, webpack, commons)
zeit/next.js canary lfades/next.js example/with-passport Change
main-HASH.js gzip 5.77 kB 5.77 kB
webpack-HASH.js gzip 746 B 746 B
de003c3a9d30..8eb0.js gzip 9.78 kB 9.78 kB
framework.HASH.js gzip 39.1 kB 39.1 kB
Overall change 55.4 kB 55.4 kB
Client Bundles (main, webpack, commons) Modern
zeit/next.js canary lfades/next.js example/with-passport Change
main-HASH.module.js gzip 4.78 kB 4.78 kB
webpack-HASH..dule.js gzip 746 B 746 B
de003c3a9d30..dule.js gzip 6.71 kB 6.71 kB
framework.HA..dule.js gzip 39.1 kB 39.1 kB
Overall change 51.4 kB 51.4 kB
Legacy Client Bundles (polyfills)
zeit/next.js canary lfades/next.js example/with-passport Change
polyfills-HASH.js gzip 26.3 kB 26.3 kB
Overall change 26.3 kB 26.3 kB
Client Pages
zeit/next.js canary lfades/next.js example/with-passport Change
_app.js gzip 1.09 kB 1.09 kB
_error.js gzip 2.97 kB 2.97 kB
hooks.js gzip 664 B 664 B
index.js gzip 222 B 222 B
link.js gzip 1.89 kB 1.89 kB
routerDirect.js gzip 279 B 279 B
withRouter.js gzip 278 B 278 B
Overall change 7.39 kB 7.39 kB
Client Pages Modern
zeit/next.js canary lfades/next.js example/with-passport Change
_app.module.js gzip 594 B 594 B
_error.module.js gzip 2.08 kB 2.08 kB
hooks.module.js gzip 370 B 370 B
index.module.js gzip 212 B 212 B
link.module.js gzip 1.48 kB 1.48 kB
routerDirect..dule.js gzip 271 B 271 B
withRouter.m..dule.js gzip 270 B 270 B
Overall change 5.28 kB 5.28 kB
Client Build Manifests
zeit/next.js canary lfades/next.js example/with-passport Change
_buildManifest.js gzip 61 B 61 B
_buildManife..dule.js gzip 61 B 61 B
Overall change 122 B 122 B
Rendered Page Sizes
zeit/next.js canary lfades/next.js example/with-passport Change
index.html gzip 916 B 916 B
link.html gzip 924 B 924 B
withRouter.html gzip 913 B 913 B
Overall change 2.75 kB 2.75 kB

Serverless Mode (Decrease detected ✓)
General
zeit/next.js canary lfades/next.js example/with-passport Change
buildDuration 11.6s 11.5s -43ms
nodeModulesSize 53.2 MB 53.2 MB
Client Bundles (main, webpack, commons)
zeit/next.js canary lfades/next.js example/with-passport Change
main-HASH.js gzip 5.77 kB 5.77 kB
webpack-HASH.js gzip 746 B 746 B
de003c3a9d30..8eb0.js gzip 9.78 kB 9.78 kB
framework.HASH.js gzip 39.1 kB 39.1 kB
Overall change 55.4 kB 55.4 kB
Client Bundles (main, webpack, commons) Modern
zeit/next.js canary lfades/next.js example/with-passport Change
main-HASH.module.js gzip 4.78 kB 4.78 kB
webpack-HASH..dule.js gzip 746 B 746 B
de003c3a9d30..dule.js gzip 6.71 kB 6.71 kB
framework.HA..dule.js gzip 39.1 kB 39.1 kB
Overall change 51.4 kB 51.4 kB
Legacy Client Bundles (polyfills)
zeit/next.js canary lfades/next.js example/with-passport Change
polyfills-HASH.js gzip 26.3 kB 26.3 kB
Overall change 26.3 kB 26.3 kB
Client Pages
zeit/next.js canary lfades/next.js example/with-passport Change
_app.js gzip 1.09 kB 1.09 kB
_error.js gzip 2.97 kB 2.97 kB
hooks.js gzip 664 B 664 B
index.js gzip 222 B 222 B
link.js gzip 1.89 kB 1.89 kB
routerDirect.js gzip 279 B 279 B
withRouter.js gzip 278 B 278 B
Overall change 7.39 kB 7.39 kB
Client Pages Modern
zeit/next.js canary lfades/next.js example/with-passport Change
_app.module.js gzip 594 B 594 B
_error.module.js gzip 2.08 kB 2.08 kB
hooks.module.js gzip 370 B 370 B
index.module.js gzip 212 B 212 B
link.module.js gzip 1.48 kB 1.48 kB
routerDirect..dule.js gzip 271 B 271 B
withRouter.m..dule.js gzip 270 B 270 B
Overall change 5.28 kB 5.28 kB
Client Build Manifests
zeit/next.js canary lfades/next.js example/with-passport Change
_buildManifest.js gzip 61 B 61 B
_buildManife..dule.js gzip 61 B 61 B
Overall change 122 B 122 B
Serverless bundles Overall decrease ✓
zeit/next.js canary lfades/next.js example/with-passport Change
_error.js gzip 293 kB 293 kB -493 B
404.html gzip 1.32 kB 1.32 kB
hooks.html gzip 957 B 957 B
index.js gzip 293 kB 294 kB ⚠️ +267 B
link.js gzip 301 kB 301 kB -152 B
routerDirect.js gzip 300 kB 300 kB -18 B
withRouter.js gzip 300 kB 300 kB -115 B
Overall change 1.49 MB 1.49 MB -511 B

Copy link
Member

@chibicode chibicode left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm not knowledgeable about passport but the UI looks good to me now.

@lfades lfades merged commit 7d42b07 into vercel:canary Mar 19, 2020
@followbl
Copy link
Contributor

@lfades thanks for this PR - great to see how someone leverages/interprets passport in this lambda world.

We have fought this alert on a number of endpoints in the pages/api directory and have seen conflicting reports on whether the alert is legit or benign. So I figured I'd ask you about the alert in the next logs and see if you could provide any color for this example and maybe the team could also provide any color on whether this alert is going to continue to show and how it should be interpreted/handled. Btw, happy to create a separate ticket if it's easier to track.

Steps to Reproduce.

1. npm run dev (in examples/with-passport)
2. navigate to '/login'
3. Login with any credentials
4. See log below
API resolved without sending a response for /api/login, this may result in stalled requests.

@lfades
Copy link
Member Author

lfades commented Mar 23, 2020

@followbl That's a false positive, downside of having an API endpoint with express, but it's also the only way of using Passport. You can see in the network tab that the endpoint finishes with 200 and with the body sent by the endpoint.

@Timer Can we do something here about this?

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

6 participants