长链形成短链,短链URL 重定向访问原链接

1. 长链生成短链

  • 长链:是一个较长且包含复杂路径的 URL,例如一个网页地址、文件下载链接、或是带有多个参数的 URL。

  • 短链 :是一个较短的 URL,通常通过短链服务(如 Bitly、TinyURL、百度短链接等)生成,通常表现为:

    vbnet 复制代码
    https://short.ly/abc123

生成短链的过程主要通过短链服务的 数据库映射 来实现。短链服务会将长 URL 映射为一个短的标识符,并存储在其数据库中。这些短链通常是一个编码后的字符串。

  • 例如,长链:

    vbnet 复制代码
    https://example.com/this-is-a-long-url/with-many/parameters?name=value&other=value

    被映射到一个短链:

    vbnet 复制代码
    https://short.ly/abc123

这个短链就变成了一个唯一的标识符,指向原来的长 URL。

2. 短链重定向到长链

  • 当用户点击短链(例如 https://short.ly/abc123)时,短链服务会读取该短链标识符 abc123,然后查找数据库中与该标识符关联的原始 URL(即长链)。
  • 找到原 URL 后,短链服务通过 HTTP 重定向 将用户引导到原始 URL。

3. HTTP 重定向的工作原理

在前端(浏览器端),HTTP 重定向是通过设置 3xx 状态码 来完成的,常见的包括:

  • 301 Moved Permanently:表示资源被永久转移到新的位置。
  • 302 Found(临时重定向):表示资源被临时转移。
  • 303 See Other307 Temporary Redirect 也常用于重定向。

例如,短链服务会返回一个响应,像这样:

http 复制代码
HTTP/1.1 301 Moved Permanently
Location: https://example.com/this-is-a-long-url/with-many/parameters?name=value&other=value

浏览器收到这个响应后,会自动跳转到新的 URL,也就是原始长链的内容。

4. 短链服务如何工作

  1. 用户访问短链(例如 https://short.ly/abc123)。
  2. 短链服务查找数据库中与 abc123 对应的原 URL。
  3. 短链服务返回 301302 重定向 状态码,告诉浏览器跳转到原始 URL。
  4. 浏览器跳转到原 URL,最终加载页面内容。

5. 常见的短链生成服务

常见的短链服务(如 Bitly、TinyURL、百度短链接等)会为每个长链生成一个唯一的短 URL。生成短链的过程通常包括:

  • 通过哈希算法或其他方法生成短链的标识符(如 abc123)。
  • 将该标识符与原始 URL 存储在服务的数据库中。
  • 当用户访问短链时,短链服务从数据库中查找原 URL,并通过 HTTP 重定向将用户引导到原网址。
相关推荐
eason_fan29 分钟前
从一则内存快照看iframe泄漏:活跃与Detached状态的回收差异
前端·性能优化
狗头大军之江苏分军1 小时前
年底科技大考:2025 中国前端工程师的 AI 辅助工具实战盘点
java·前端·后端
编程修仙2 小时前
第三篇 Vue路由
前端·javascript·vue.js
比老马还六2 小时前
Bipes项目二次开发/硬件编程-设备连接(七)
前端·javascript
掘金一周2 小时前
前端一行代码生成数千页PDF,dompdf.js新增分页功能| 掘金一周 12.25
前端·javascript·后端
张就是我1065922 小时前
漏洞复现指南:利用 phpinfo() 绕过 HttpOnly Cookie 保护
前端
Kagol2 小时前
🎉TinyVue v3.27.0 正式发布:增加 Space 新组件,ColorPicker 组件支持线性渐变
前端·vue.js·typescript
潍坊老登2 小时前
大前端框架汇总/产品交互参考UE
前端
方安乐2 小时前
获取URL参数如何避免XSS攻击
前端·xss
十二AI编程2 小时前
MiniMax M2.1 实测,多语言编程能力表现出色!
前端