Giter Club home page Giter Club logo

vercel-basic-auth's Introduction

Goal

This repo contains examples of how to add Basic Authentication to a Vercel deployment using various languages / frameworks, along with some numbers that show the differences between each method.

Each example contains its own README file with some additional information.

Adding basic auth to SSR / API routes

All the examples in this repo only show how to add basic auth to static pages. If you want to add basic auth to SSR or API routes, you'll have to do it manually or use a package specifically designed for the framework you're using, like nextjs-basic-auth-middleware if your project uses Next.js.

Structure

  • The _static directory contains the source code for the "website" that each implementation serves for demonstration purposes : HTML, CSS, images ... 1
  • All the other directories are the different ways you can add Basic Authentication to a Vercel deployment. Checkout their code to see how to implement it in your project

1 The demo website has a public area and a restricted /admin area (username / pass : admin / admin).

Comparison

Example πŸ“¦ Lambda size πŸ”— Deployment URL πŸ‘¨β€πŸ’» Ease of implementation
node 0.08 MB Link ⭐
node-express 0.38 MB Link ⭐⭐
node-static-auth 0.08 MB Link ⭐⭐⭐

Contributing

Issues and PR are welcome!

  • πŸ”€ Fork and clone the project
  • πŸ†• Create a directory named after the language / framework you want to add (for example php or node-polka)
  • πŸ‘¨β€πŸ’» Add the implementation
  • πŸŽ‰ Submit your PR

vercel-basic-auth's People

Contributors

dennishzg avatar dependabot[bot] avatar hormesiel avatar ubergarm avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar

vercel-basic-auth's Issues

How to exclude the protected folder from the builds-process

Hi,
how can i exclude the protected folder from the build process. I added a nuxt project in the protected route, when i deploy to now there will be always an error that says

Error: The lambda function size (104.57mb) exceeds the maximum size limit (50mb). Learn more: https://zeit.co/docs/v2/deployments/concepts/lambdas/#maximum-bundle-size

But when i deploy the static site without those protected features it works without any problems

node and node-static-auth recipes are vulnerable to timing attacks

πŸ‘‹ thank you for making these recipes available, it’s been very helpful for me.

Just wanted to point out that both the node and node-static-auth examples are in theory vulnerable to a timing attack to determine the login/password.

Here is how express-basic-auth fixed this: LionC/express-basic-auth#21

For further reference, see also how Rails fixed the same issue in their basic auth check, and how that CVE is classified: rails/rails@a6fa396.

Serving `*.js` files as static assets

Hi MickaΓ«l,
Thank you very much for you work and making this repo with basic-auth examples! I found these examples pretty useful!

Issue

I've tested things locally with my own repo and compared it to your examples and noticed that _static directory doesn't contain any *.js files and there are no <script src="*.js"></script> lines in the _static/index.html.
It seems that express serves all *.css and .svg files however fails on *.js (and maybe on some other extension, I didn't test it that far)

Reproduce steps

  1. Create an empty main.js within _static/.
  2. Add <script src="main.js"></script> line in _static/index.html.
  3. Deploy via now.
    All *.js files will fail with 404:
    image
    (note that styles.css loaded just fine)

What I've tried

  • I've checked all the paths many times to make sure they are correct.
  • I've tried to add a second build with @now/static.
  • I've played with the router in now.json.

Nothing helped me but I'm new to now so I think I'm missing something.

Conclusion

I would appreciate if you could find time and try to update your examples with *.js files added. I also would be really thankful if you could give me a hint to point me in the right direction in my investigation of this problem.

Have a nice day! πŸ‘

How to get it working

Hi - thank you for putting this together. I've been trying to figure out how to password protect a standard static HTML site on Vercel. It looks like I can use one of these as a wrapper.

In testing these examples, should I just run vercel from a local copy of the repo, and specify the "root directory" as node or the other two, correct? Or is it better to use ./?

Custom 404 page (404.html)

First of all, thank you for this very useful repository. πŸ‘

I have a small question about the now-basic-auth/node code in this file: https://github.com/flawyte/now-basic-auth/blob/master/node/index.js .

(My entire website is password-protected and my output directory is called dist instead of _static)

How do i show a custom 404 page instead of the "404 Not Found" message (when authorized)?
https://github.com/flawyte/now-basic-auth/blob/86e9bdd5b6f39a8635fe2b01ec4273738961dfe8/node/index.js#L35

I want to show my 404.html file instead of the "404 Not Found" message. The file is located at /dist/404.html.
Vercel supports custom 404 pages via a 404.html file in the output directory. How can i use that feature together with your now-basic-auth/node code? Vercel should detect the 404.html file automatically right? I don't have to reference the /dist/404.html file in the index.js right? Do i have to remove the handle404 part at line 33-36?:

// Serve files
-  return serve(req, res, () => {
-    res.statusCode = 404;
-    res.end('404 Not Found');
-  });
+  return serve(req, res);

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.