A serverless URL shortening service based on Vercel.
本页还提供:简体中文版
- serverless
- Automatically prevent duplicate short URLs from being generated
- Background management page
- Add short URL
- list of short urls
- remove short url
- Companion API
- Secondary development possible
Link:https://short-url-demo.vercel.app/snQaWdG27M
Admin:https://short-url-demo.vercel.app/admin (session:123456)
Apply for Mongodb database
Video version: The first chapter on Youtube/Bilibili
Because the short link service needs to store URL data, it is necessary to apply for a free Mongodb database from Mongodb.com for data storage.
In this section, you will get a Mongodb url, please save it, we will use it in the next section.
Open https://account.mongodb.com/account/register to register an account
Create a database account and record the password of the account
Authorize all IP connections
create
Click this option Copy the connection URL Replace the "" in the URL with the password you just setVideo version: The second chapter on Youtube/Bilibili
You need to click the button below to go to the Vercel deployment page
If you have not logged in or registered Vercel, please click the deployment button above again after registering/logging in according to the page.
If everything is ready, you will see the following page after clicking the button:
You need to give your project a name, fill it in the "Repository Name" input box, and click the "Create" button,
At that time Vercel will automatically create a repository with the same name in your Github and pull the code of this project.
After the pull is complete, Vercel will start project deployment, which is also automatic.
When you see this page, the project has been deployed successfully.
After the deployment is complete, you need to click the "Continue to Dashboard" button located in the upper right corner of the page
If you accidentally close this button, you only need to open the item on the homepage. In the new page, click the "Settings" button in the menu bar
Click the "Environment Variables" button to open the environment variable settings page
On the environment variable setting page, create new environment variables named "AppSession" and "mongodbUrl" according to the figure below, and write the administrator login credentials and mongodbUrl (obtained in step 1) respectively.
Also check the "Production", "Preview" and "Development" options below.
Finally click the "Save" button to save
We need to click the "Deployments" button in the navigation bar to open the deployment tab
Click the "Redeploy" button in the "..." button to the right of the first record to redeploy the project
Check "Redeploy with existing Build Cache." and click the "REDEPLOY" button to redeploy
When you see this page, the service has been successfully deployed
You can access the domain name +/admin to access the management page, and the login password is the value of "AdminSession" in the environment variable you set.
If you need a custom domain name, you can bind it yourself on the settings page