<?xml version="1.0" encoding="UTF-8"?>
<rss xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:content="http://purl.org/rss/1.0/modules/content/"
    xmlns:atom="http://www.w3.org/2005/Atom" xmlns:media="http://search.yahoo.com/mrss/" version="2.0">
    <channel>
        
        <title>
            <![CDATA[ URL - freeCodeCamp.org ]]>
        </title>
        <description>
            <![CDATA[ freeCodeCamp 是一个免费学习编程的开发者社区，涵盖 Python、HTML、CSS、React、Vue、BootStrap、JSON 教程等，还有活跃的技术论坛和丰富的社区活动，在你学习编程和找工作时为你提供建议和帮助。 ]]>
        </description>
        <link>https://www.freecodecamp.org/chinese/news/</link>
        <image>
            <url>https://cdn.freecodecamp.org/universal/favicons/favicon.png</url>
            <title>
                <![CDATA[ URL - freeCodeCamp.org ]]>
            </title>
            <link>https://www.freecodecamp.org/chinese/news/</link>
        </image>
        <generator>Eleventy</generator>
        <lastBuildDate>Wed, 10 Jun 2026 20:41:10 +0000</lastBuildDate>
        <atom:link href="https://www.freecodecamp.org/chinese/news/tag/url/rss.xml" rel="self" type="application/rss+xml" />
        <ttl>60</ttl>
        
            <item>
                <title>
                    <![CDATA[ 三步带你开发一个短链接生成平台 ]]>
                </title>
                <description>
                    <![CDATA[ 前段时间在开发【葡萄城社区】公众号时有一个功能是需要用网页授权认证地址生成二维码，但类似像下面这样的网址url即便是看也觉得很头疼了。 用这个地址生成的二维码也是密密麻麻，虽不影响微信长按扫码，一旦二维码尺寸缩一点点，图片马上就会糊掉，导致摄像头直接扫码会难以识别。 那这种情况下， 我们自然就会想到如果使用短链接减少url的字符，生成的码自然就会变得容易识别了，同时还会使url更美观且易于转发。现在市面上可用的就是微博的t.cn和一些第三方的生成短链接工具，但这两类工具都有一些使用上的问题，例如：t.cn现在的规则是会出现一个中转页不会直接跳转，而第三方的工具因为是一个公共平台，有时可能会因一些不良信息导致整个平台无法访问。 那与其这样，不如我们自己来实现一个短链接平台吧，实现一个短链接平台原理上也非常简单，搞定两部分就行了：1.保存长短链接的对应关系。2.通过短链接查询长连接并重定向。 为了高效，我这使用的是node和mongodb，下面我们就来开始动手吧。 首先，我们先创建一个express工程： express -e demo    change directory ]]>
                </description>
                <link>https://www.freecodecamp.org/chinese/news/shorter-url/</link>
                <guid isPermaLink="false">5f6d4a1f027c3105323f551e</guid>
                
                    <category>
                        <![CDATA[ URL ]]>
                    </category>
                
                    <category>
                        <![CDATA[ Node.js ]]>
                    </category>
                
                    <category>
                        <![CDATA[ MongoDB ]]>
                    </category>
                
                <dc:creator>
                    <![CDATA[ Willie.ji ]]>
                </dc:creator>
                <pubDate>Fri, 25 Sep 2020 09:22:20 +0000</pubDate>
                <media:content url="https://chinese.freecodecamp.org/news/content/images/2020/09/radek-grzybowski-eBRTYyjwpRY-unsplash.jpg" medium="image" />
                <content:encoded>
                    <![CDATA[ <p>前段时间在开发【葡萄城社区】公众号时有一个功能是需要用网页授权认证地址生成二维码，但类似像下面这样的网址url即便是看也觉得很头疼了。</p><figure class="kg-card kg-image-card"><img src="https://chinese.freecodecamp.org/news/content/images/2020/09/image-9.png" class="kg-image" alt="image-9" width="634" height="115" loading="lazy"></figure><p>用这个地址生成的二维码也是密密麻麻，虽不影响微信长按扫码，一旦二维码尺寸缩一点点，图片马上就会糊掉，导致摄像头直接扫码会难以识别。</p><p>那这种情况下， 我们自然就会想到如果使用短链接减少url的字符，生成的码自然就会变得容易识别了，同时还会使url更美观且易于转发。现在市面上可用的就是微博的t.cn和一些第三方的生成短链接工具，但这两类工具都有一些使用上的问题，例如：t.cn现在的规则是会出现一个中转页不会直接跳转，而第三方的工具因为是一个公共平台，有时可能会因一些不良信息导致整个平台无法访问。</p><p>那与其这样，不如我们自己来实现一个短链接平台吧，实现一个短链接平台原理上也非常简单，搞定两部分就行了：1.保存长短链接的对应关系。2.通过短链接查询长连接并重定向。</p><p>为了高效，我这使用的是node和mongodb，下面我们就来开始动手吧。</p><p>首先，我们先创建一个express工程：</p><!--kg-card-begin: markdown--><pre><code>express -e demo

   change directory:
     &gt; cd demo

   install dependencies:
     &gt; npm install

   run the app:
     &gt; SET DEBUG=demo:* &amp; npm start
</code></pre>
<!--kg-card-end: markdown--><p>然后进入demo目录并安装express必要依赖：</p><!--kg-card-begin: markdown--><pre><code>npm install
</code></pre>
<!--kg-card-end: markdown--><p>同时通过 <code>npm</code> 安装我们需要用到的 <code>mongoose</code> 和 <code>shortid</code> 和 <code>body-parser</code>：</p><!--kg-card-begin: markdown--><pre><code>npm install mongoose
npm install shortid
npm install body-parser
</code></pre>
<!--kg-card-end: markdown--><p>下面分别对使用到的这三个包简单说明一下：</p><ul><li>在这个应用中，我们使用了 mongodb，之所以选择它是因为执行高效且低开销，所以执行起来也很高效，不过如果使用其他数据库也是没问题的。这里的<strong>mongoose</strong>就是npm的一个包，主要是为程序提供连接mongodb并增删查改的功能。</li><li>通过使用<strong>shortid</strong>可以生成一个指定字符不重复的编码，便于我们生成类似xxx.com/ngTsfdgh 类似红字部分的编码。</li><li>由于我们生成短链接部分的api使用的是post方法，使用<strong>body-parser</strong>可以多扩展一种body编码类型解析能力。</li></ul><h2 id="-mongodb-">首先设置MongoDB的连接信息</h2><!--kg-card-begin: markdown--><pre><code>module.exports = {
    mongo_base_connection_url: 'mongodb://localhost:27017',
    mongo_db: 'mongodb://localhost:27017/shorturl',
    mongo_options: {
        autoReconnect: true,
        keepAlive: true,
        reconnectTries: 50,
        reconnectInterval: 1000,
        connectTimeoutMS: 5000000,
    }
}
console.log("Connection local mongo db");
</code></pre>
<!--kg-card-end: markdown--><h2 id="-">数据库模型定义</h2><p>因为我们的对应关系是需要通过短链接查询长连接，所以这里我们主要以存储短链接和长连接为主，另外大家也可以根据自己需要添加链接点击统计之类的字段，方便后期统计。</p><!--kg-card-begin: markdown--><pre><code>var mongoose = require('mongoose');
var Schema = mongoose.Schema;
 
var urlSchema = new Schema({
  shortUrl: String,
  longUrl: String
});
 
module.exports = mongoose.model('UrlTable', urlSchema);
</code></pre>
<!--kg-card-end: markdown--><h2 id="-express-">定义express路由</h2><p>因为这个应用我们只有生成和Redirect两个功能，所以这里只有两个页面即可完成所有工作。</p><!--kg-card-begin: markdown--><pre><code>var index = require('./routes/index');
var url = require('./routes/url');
app.use('/', index);
app.use('/url', url);
</code></pre>
<!--kg-card-end: markdown--><h4 id="--1">生成短链接页面</h4><!--kg-card-begin: markdown--><pre><code>const express = require("express");
const router = express.Router();
const shortId = require('shortid');
const UrlTable = require('../models/urltable');
const mongoose = require('mongoose');
var setup = require('../dbconfig/db');
 
router.post('/', function(req, res, next) {
    var params = req.body;
    var url = params.longUrl;
shortId.characters(' 0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ^*')
    var shortid = shortId.generate();
    var objurl = { shortUrl: shortid, longUrl: url};
    mongoose.connect(setup.mongo_db, setup.mongo_options);
    UrlTable.create(objurl, function (err, objurl) {
      //if (err) console.log(err);
      res.send("http://localhost:3000/" + shortid);
    });
    return;
});
</code></pre>
<!--kg-card-end: markdown--><p>指定生成 <code>shortId</code> 字符的范围并生成：</p><!--kg-card-begin: markdown--><pre><code>shortId.characters('0123456789abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ')

var shortid = shortId.generate();
</code></pre>
<!--kg-card-end: markdown--><p>为数据库构建符合要求的数据模型：</p><!--kg-card-begin: markdown--><pre><code>var objurl = { shortUrl: shortid, longUrl: url};
</code></pre>
<!--kg-card-end: markdown--><p>最后，连接数据库并保存后将短链接结果返回客户端：</p><!--kg-card-begin: markdown--><pre><code>mongoose.connect(setup.mongo_db, setup.mongo_options);
UrlTable.create(objurl, function (err, objurl) {
//if (err) console.log(err);
res.send("http://localhost:3000/" + shortid);
});
</code></pre>
<!--kg-card-end: markdown--><h4 id="--2">短链接跳转页面</h4><!--kg-card-begin: markdown--><pre><code>const express = require("express");
const router = express.Router();
const UrlTable = require('../models/urltable');
const mongoose = require('mongoose');
var setup = require('../dbconfig/db');
 
router.get('/:shortUrl', function (req, res, next) {
    var shortUrl = req.params.shortUrl;
    mongoose.connect(setup.mongo_db, setup.mongo_options);
    UrlTable.findOne({ shortUrl:shortUrl }).then((result) =&gt; {
       //待添加错误处理
    res.redirect(result.longUrl);
    })
});
 
module.exports = router;
</code></pre>
<!--kg-card-end: markdown--><p>这个页面为了便于快速跳转，我们就使用get接收参数，这个页面功能就很简单了，接参查询并跳转。</p><p>接收短链接码：</p><!--kg-card-begin: markdown--><pre><code>var shortUrl = req.params.shortUrl;
</code></pre>
<!--kg-card-end: markdown--><p>连接数据库查询并跳转：</p><!--kg-card-begin: markdown--><pre><code>mongoose.connect(setup.mongo_db, setup.mongo_options);

    UrlTable.findOne({ shortUrl:shortUrl }).then((result) =&gt; {

           //待添加错误处理

      res.redirect(result.longUrl);

 })
</code></pre>
<!--kg-card-end: markdown--><p>后期大家可以对一些错误异常处理，数据统计等做一些增强，这里就不做补充了。</p><p>下面让我们启用应用开始测试吧。</p><h2 id="--3">启动应用并测试</h2><!--kg-card-begin: markdown--><pre><code>npm start
</code></pre>
<!--kg-card-end: markdown--><p>启动后，默认的访问端口为3000，我们首先测试下短链接生成页，这里我们post一个名为longUrl的长链接参数，数据对象为：</p><p>{"longUrl" : "<a href="https://demo.grapecity.com.cn/spreadjs/SpreadJSTutorial/features/tables/basic-table/purejs">https://demo.grapecity.com.cn/spreadjs/SpreadJSTutorial/features/tables/basic-table/purejs</a>"}</p><figure class="kg-card kg-image-card"><img src="https://i.v2ex.co/Kne07O7El.gif" class="kg-image" alt="Kne07O7El" width="833" height="572" loading="lazy"></figure><p>成功升成了如下短链接：</p><p><a href="http://localhost:3000/iGE6ZlDmh">http://localhost:3000/iGE6ZlDmh</a></p><p>我们只要通过访问短链接能正常跳转至保存的长连接即可。</p><figure class="kg-card kg-image-card"><img src="https://i.v2ex.co/mcZ74Zv2l.gif" class="kg-image" alt="mcZ74Zv2l" width="788" height="634" loading="lazy"></figure><p>这样就测试通过了，其实代码量不大，原理也很简单。大家如果自己有较短的域名的话，上线后会让链接变得更短、更美观，这样一个属于我们自己短链接生成平台就开发完成了。下面附上源码，执行npm install 即可自动安装所有依赖，如果大家有问题，可通过评论区告诉我。</p><p><a href="https://files.cnblogs.com/files/powertoolsteam/shorturl.zip">源码下载&gt;&gt;</a></p><p>我们在<a href="https://www.grapecity.com.cn/">葡萄城官网</a>发布更多文章，欢迎阅读！</p> ]]>
                </content:encoded>
            </item>
        
    </channel>
</rss>
