Code Monkey home page Code Monkey logo

ddt_b2e_tinyurl's Introduction

短網址服務設計

短網址,把普通的網址轉換成比較短的網址。因為字符變少,在字數限制的平台發文可編輯的字變多,而且更容易發布傳送,太長的網址容易截斷或不能被辨識為連結

使用技術

  • 使用 Bootstrap 和 jQuery 來做前端部分
  • 後端以 PHP 完成
  • 佈署在⾃⾏架設的 AWS EC2 Ubuntu 主機

短網址系統設計

短網址系統設計看似簡單,裡頭包含眾多細節,關於資料儲存、算法、效能提升等等問題,圖中架構是比較完整的短網址設計。

短網址跳轉的基本原理

以 reurl 服務舉例,比如在瀏覽器輸入這一串短網址:https://reurl.cc/9X0gnv

  1. https://reurl.cc 的 IP 位置發送 GET 請求,查詢 9X0gnv 這串短碼
  2. https://reurl.cc Server 去資料庫查到它對應的 URL,會通過轉址,重定向到使用者真正要訪問的伺服器

實現短網址的生成

簡單來說,就是將長網址和通過算法得到的短碼在資料庫中關聯起來,比較好的算法有「自增序列算法」和「MurmurHash」兩種,因為作業時間有限就先以隨機產生代碼,之後會以這兩種算法來產生短碼的方向來優化。

另外,有些參考資料中,有提到先檢查資料庫是否已經有該網址對應的短碼,這是關於一對一或是一對多的選擇,我的設計步驟沒有這部分,考量到一個長網址在不同時空背景、不同使用者的狀況下,應該要生成不一樣的短網址。

URL redirection 有幾種方式,可以使用 HTML 的轉址、Javascript 轉址或 PHP 的轉址,我這裡選擇由 PHP 回給我原始網址,再以 JS 進行頁面跳轉。

參考資料

ddt_b2e_tinyurl's People

Contributors

zoeaeen13 avatar

Watchers

James Cloos avatar  avatar

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.