สร้าง Local URL Shortener Service ที่น่าเชื่อถือ - คู่มือ Step-by-Step

คุณจะเจอ URLs (Uniform Resource Locators) ยาวมากบนอินเทอร์เน็ต หลาย sites ใส่ข้อมูลการเยี่ยมชมใน URL: ภาษา, ตำแหน่ง, รหัสระบุตัวตน, reference codes สำห specials และอื่นๆ ทำให้ URLs ยาวมาก

Premium URL Shortener บน Code Canyon เป็นวิธีทำ long URLs สั้นกว่า ใน tutorial นี้จะแสดงวิธีตั้ง URL shortener ของตัวเองบนระบบและใช้งาน

What Is a URL Shortener?

คุณใช้ URL ทุกครั้งที่ browse internet ระบุ web page และ content เฉพาะ เนื่องจากอาจมี parameters สำห form หรือ search engine URLs จึงใหญ่

https://tutsplus.com/tutorials/search/How%20to%20Draw%20Animals:%20Horses,%20Their%20Anatomy%20and%20Poses

URL นี้สำหค้นหา Tuts+ website สำห string "How to Draw Animals: Horses, Their Anatomy and Poses" สตริงนี้ 74 characters เห็น URLs ยาวกว่า 200 characters

https://bit.ly/2oO8BqO

用 URL shortening service อย่าง bit.ly ได้ shorter URL URL เดียวกันตอนนี้ 15 characters ตอนใคร browse link bit.ly server redirect browser ไป full URL extra lookup บน URL อื่น delay site load time แตไม่มาก

Installing Docker

วิธีง่ายสร้าง local server คือ virtualized environment แต run full system virtualizer resource intensive Docker เป็น minimal virtualizer สำห terminal-based systems รัน Docker container (small unix server) 用 system resources น้อย

รัน containers บนระบบ ต้อง install Docker เลือก download สำห OS จาก Docker website

Docker installed ต้องเตรียมระบบหา web service ที่จะสร้าง เปลี่ยน system file ใน /etc/hosts สำห Linux หรือ macOS และ c:\windows\System32\drivers\etc\lmhosts สำห Windows ใส่ statement:

127.0.0.1 s.dev

การเปลี่ยนนี้ทำให้ references ทั้งหมดไป https://s.dev ไป local system ทำเพื่อให้ service มี proper hostname ก่อน configure

สร้าง development area สร้าง directory วาง Premium URL Shortener zip file และ extract ควรได้ directory structure:

นี่คือ documentation กับ file main.zip Extract file นี้ด้วย ได้ directory structure:

main.zip มี source code files และ resources ทั้งหมดสำห service นี้จะเป็น directory ที่ add เข้า Docker instance

ตอนนี้ต้องการ Docker LAMP stack จาก fauria Docker running พิมพ์ใน terminal:

docker pull fauria/lamp

จะ download Fauria LAMP (Linux, Apache, MySQL, PHP) stack ไป Docker installation ดาวน์โหลดเสร็จ สร้าง container:

docker run --rm --name linkshort -p 80:80 -e LOG\_STDOUT=true -e LOG\_STDERR=true -e LOG\_LEVEL=debug -v {{service source directory}}:/var/www/html fauria/lamp 

แทนที่ {{service source directory}} ด้วย full path ไป directory ที่มี source files และ resources คำสั่งนี้สร้าง container ชื่อ linkshort ทำงาน port 80 ให้ error และ log messages ไป standard out

ตอนนี้ทุกครั้ง stop และ relaunch container จะสูญเสียข้อมูลทั้งหมด ต้องย้าย database ไป source code directory เพื่อ preserve ต่อ reboot ใน terminal:

docker exec -i -t linkshort bash
mkdir /var/www/html/data
cp -R /var/lib/MySQL/* /var/www/html/data
exit

คำสั่งแรกเปิด bash shell ไป container คำสั่งที่สองสร้าง directory data ใน source code directory Container มอง source code directory เป็น /var/www/html คำสั่งที่สาม copy database info ไป directory นั้น exit ออกจาก container

หยุด container ด้วย:

docker stop linkshort

ใช้คำสั่งนี้ทุกครั้งที่อยากหยุด container

Restart container 用 proper data directory:

docker run --rm --name linkshort -p 80:80 -e LOG\_STDOUT=true -e LOG\_STDERR=true -e LOG\_LEVEL=debug -v {{service source directory}}:/var/www/html -v {{service source directory}}/data:/var/lib/mysql fauria/lamp

ครั้งนี้สร้าง container กับ MarianDB server 用 database data ที่เก็บบนคอมพิวเตอร์ คำสั่งนี้ใช้ launch service ผม用 keyboard expander Typinator พิมพ์ให้

ตอนนี้ database สำห URL shortener ต้องสร้าง ต้องเปิด shell เข้า container ใน terminal instance ใหม่พิมพ์:

docker exec -i -t linkshort bash

คำสั่งนี้สร้าง bash shell เข้า container ถ้าต้อง adjust อะไรใน container ใช้คำสั่งนี้ เปิด command shell เข้า MarianDB program:

mysql -u root

ตอนนี้สร้าง databases ใน MarianDB และ grant permissions ให้ web server เข้าถึง:

create database urlshort;
create user 'www-data'@'localhost' identified by '{{password}}';
grant all on urlshort.\* to 'www-data'@'localhost';
quit;

{{password}} ตั้งเป็น password ที่อยากให้ user ของ database จดจำไว้ ใช้ configure service

Service running ใน container เปิด browser ไป https://s.dev

ถ้า config ถูกต้อง จะเห็นหน้านี้ แสดง requirements และ status setup โดย用 fauria container ใน Docker dependencies ทุกอย่าง met แล้ว กดปุ่มสีน้ำเงินล่าง

หน้าถัดไปคือ configuration file creator สำห service ให้ชื่อและ password database ที่สร้างก่อนหน้า

กรอก fields ตามที่แสดง Database Host คือ localhost สำห container Database Name คือ urlshort Database User คือ www-data และ password จาก initial database setup Database Prefix คือชื่อต้นสำห databases ที่สร้างสำห service ผม用 short_ Installation program ตั้ง Security Key เก็บ copy key ให้ไว้ future reference

ถ้าติดตั้งบน VPS ค่าเหล่านี้จะตาม service บางอย่างเหมือน บางอย่างต่าง

ข้อมูลถูกต้อง กดปุ่มสีน้ำเงินล่างไป step 3

Basic Configuration screen ตั้ง admin username, email, password ตั้งตามคุณ Site URL ตั้งเป็น https://s.dev ตาม hosts file ก่อนหน้า กดปุ่มสีน้ำเงินล่าง

หน้าถัดไปบอก service set up แล้ว กดปุ่มสีน้ำเงิน Delete install.php security feature สำห real web server แตไม่ต้อง local install แต installation ไม่จบจนกว่าจะทำ

ยินดีด้วย—service functional! ควรเห็นหน้านี้ ใส่ long URL ใน input field Paste a long url กดปุ่มสีน้ำเงิน Shorten ได้ shortened URL ใช้งาน URL ใน database สำห future reference feature นี้ bookmarker ดี

Using the API

ตอนนี้ URL shortener service running อยากใช้ประโยชน์ แตเปิด web page ทุกครั้ง แม้ local จะช้า ต้องทำให้เร็ว นี่คือที่ API (Application Programming Interface) ช่วย อ้างอิง full documentation API

Service running เปิด page https://s.dev/user/settings

ต้อง login เข้า account ดูหน้านี้ ขวาล่าง sidebar จะเห็น Your API Key: กับ alphanumeric number copy และ save number นี้ให้ access API

用 API สร้าง Ruby program เข้าถึง บน macOS และ Linux Ruby pre-installed Windows ต้อง install

Minimal Ruby program สร้าง short link:

require 'net/http'
require 'json'
API = '{YourAPIKey}'
short = JSON.parse(Net::HTTP.get('s.dev', '/api?api=' + API + '&url=' + ARGV[0]))
if short["error"] == 0 then
  print short["short"]
else
  print "An error happened: "
  print short["error"]
  print "\n"
end

Save script ไฟล์ shortener.rb แทนที่ {YourAPIKey} ด้วย API key ที่ copy รันใน command line:

ruby shortener.rb 'google.com'

ควรได้ shortened link สำห URL นี้ สร้าง shortened URLs แตยังไม่สะดวก

Creating a PopClip Extension

บน Mac PopClip โปรแกรมเล็กสำห process highlighted text ทำให้สร้าง shortened links ง่าย สร้าง PopClip extension ไม่ explain ทุกอย่าง mechanics อ่าน tutorial PopClip: Scripting Extensions ของผม

สร้าง PopClip extension ชื่อ PremiumURLShortener.popclipext 用ต่อไปนี้สำห Config.plist ใน extension directory:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "https://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
  <key>Actions</key>
  <array>
    <dict>
      <key>After</key>
      <string>paste-result</string>
      <key>Image File</key>
      <string>PremiumURLShortener.png</string>
      <key>Script Interpreter</key>
      <string>/usr/bin/ruby</string>
      <key>Shell Script File</key>
      <string>PremiumURLShortener.rb</string>
      <key>Title</key>
      <string>Shortener</string>
    </dict>
  </array>
  <key>Options</key>
  <array>
    <dict>
      <key>Option Identifier</key>
      <string>apikey</string>
      <key>Option Type</key>
      <string>string</string>
      <key>Option Label</key>
      <string>API Key: </string>
    </dict>
  </array>
  <key>Credits</key>
  <array>
    <dict>
      <key>Name</key>
      <string>Richard Guay</string>
      <key>Link</key>
      <string>https://customct.com</string>
    </dict>
  </array>
  <key>Extension Description</key>
  <string>Create shortened URLs with PremiumURLShortener locally</string>
  <key>Extension Identifier</key>
  <string>com.customct.popclip.extension.premiumurlshortener</string>
  <key>Extension Name</key>
  <string>Shortener</string>
  <key>Required Software Version</key>
  <integer>701</integer>
</dict>
</plist>

สร้าง script file extension ชื่อ PremiumURLShortener.rb ใส่โค้ดนี้:

#!/usr/bin/ruby
require 'net/http'
require 'json'
Encoding.default_internal = Encoding::UTF_8
Encoding.default_external = Encoding::UTF_8
input = ENV['POPCLIP_TEXT'].to_s.strip()
API = ENV['POPCLIP_OPTION_APIKEY'].to_s.strip()
short = JSON.parse(Net::HTTP.get('s.dev', '/api?api=' + API + '&url=' + input))
if short["error"] == 0 then
  print short["short"]
else
  print "An error happened: "
  print short["error"]
  print "\n"
end

โหลด extension ใหม่ จะขอ API key ให้ key กด Okay พร้อมใช้ใน PopClip

Select link PopClip เปิด options เลือก Shortener คิดสักครู่ paste shortened URL ถูกต้อง Full extension ใน download tutorial ตอนนี้พร้อมทำอีกเยอะ!

Conclusion

ไม่ได้แค่ private URL shortener คุณยังรู้用 Docker รัน local containers วิธีง่าย track URLs ที่用 และสร้าง shortened links

用 Ruby script กับ Alfred 3 หรือ Keyboard Maestro ได้ สนุกกับ service ใหม่และทดลอง features อื่นๆ!