Image Archive System v2: viết lại hệ thống upload ảnh từ đầu, vì Telegram “lật kèo”

Cách đây 1 thời gian, tình cờ phát hiện ra x-dr/telegraph-Image, dùng rất thích, giao diện sạch sẽ, upload lên thẳng Telegram, có link trực tiếp, nghĩ Telegram không thể nào sập được, nên mạnh dạn dùng tên Archive 🤣 dùng ít tháng, tự dưng ông nội Telegram thay đổi chính sách, không cho dùng link trực tiếp nữa (hình như giờ dùng lại được rồi thì phải), nay có hứng nên làm bản Image Archive System v2, thay thế cho bản cũ

PS: các ảnh hiện ra ở bài viết này, đang dùng từ Image Archive System v2

Giới thiệu chung về Image Archive System v2

Image System

Image Archive System v2 hoàn thiện với bộ khung xoay quanh Cloudflare, trừ phần storage ban đầu khá khó lựa chọn, các thành phần khác Cloudflare miễn phí cái gì, mình dùng cái đó 😅

• Frontend: Cloudflare Pages
• Backend: Cloudflare Pages Functions
• Database: Cloudflare D1 (SQLite)
• Storage: Private (bạn nào biết được storage ở đâu thì comment)
• Optimization: Jetpack

Image Archive System v2 nhái giao diện, ý tưởng từ telegraph-Image khá nhiều, cách sử dụng tương tự các dịch vụ upload khác, chọn ảnh cần upload, ấn gửi là được

• Khi chọn nhiều ảnh nếu nhầm có thể click vào icon x (màu đỏ góc phải) để bỏ ra, hoặc clear tất cả file khỏi danh sách, chọn lại …

• Sau khi upload, mỗi ảnh sẽ tạo sẵn 4 URL thông dụng: Direct, Markdown, BBCode, HTML, cần dùng link dạng nào click vào nó tự copy, đỡ phải nhớ nhiều
• Khi upload nhiều ảnh hoặc nhiều lần, sử dụng nút Copy All để chọn tất cả URL từ danh sách Upload Results bên dưới

Cá nhân thấy 1 trang upload ảnh, các tính năng thế là đủ, thêm tính năng nữa cũng rất ít khi cần dùng

Riêng tư:

Ý tưởng này xuất phát từ Github repo, ban đầu tính chứa ảnh ở đây, đọc help thấy các cụ ấy bảo nhiều file hiện ra ở 1 repo thì nặng lắm, nên tống cho mỗi ảnh vào 1 thư mục, sau đó đổi lại tên file ngẫu nhiên, sử dụng thông thường dùng tên file ngẫu nhiên 6-8 kí tự cho ngắn gọn là đủ

Bản thân code gốc không lưu trữ IP người upload ảnh, không phải để tăng tính riêng tư, chủ yếu mình không quan tâm, ghi nhiều vào database tốn dung lượng chứ chẳng để làm gì

Hiệu năng và độ ổn định:

Với phiên bản ảnh này, mình cân bằng giữa hiệu năng và độ ổn định, đại để làm 1 lần, sau đó không cần quan tâm tới nó nữa, đây là phần mình mất khá nhiều thời gian, vì phải đảm bảo upload nhanh, ảnh load nhanh, vừa phải xử lý các giới hạn của Cloudflare Pages

• End user -> Cloudflare Pages -> Storage-> Jetpack -> quay ngược về Cloudflare Pages load ra ảnh

Tuyến đường khá lòng vòng, lòng vòng tới mức nếu mình không nói storage dùng dịch vụ nào, chắc hiếm ai biết ảnh gốc để ở đâu 😁 chính mình cũng không biết ảnh gốc để ở đâu nếu chỉ nhìn vào URL của tấm ảnh

Upload xong, ảnh hiện ra chậm hơn so với thông thường (do lần đầu load ra từ Jetpack) bù lại cho điểm này, sử dụng sau này sẽ đạt hiệu năng tốt hơn, vì dung lượng đã được nén lại (tương tự Jetpack WebP CDN Replacer) và cache qua CDN Cloudflare (ý tưởng của tính năng này là để giảm dung lượng ảnh phải chứa trên storage, do các dịch vụ miễn phí cho không nhiều, khá là khả quan, vì mỗi ảnh giảm 30%-70% dung lượng gốc lận đấy)

Lý thuyết, Image Archive System v2 nếu chạy trên tất cả tài nguyên miễn phí, có thể đáp ứng upload khoảng 30.000 ảnh mỗi ngày (do D1 cho hơi ít request ghi vào database), quy đổi đơn giản 1 phút có thể upload 20 tấm ảnh, dù thực tế chắc 1 tuần có 1 tấm ảnh upload lên 🤑

Quản lý upload nhiều file 1 lúc theo dung lượng các batch, không giới hạn số lượng files, mình đang set giới hạn là 1 batch tối đa 40MB, quy đổi nếu upload ảnh max 10MB, có thể xử lý cùng lúc 4 ảnh, tốc độ sẽ tăng x4 so với upload từng tấm, còn nếu bạn upload 100 ảnh cùng lúc, mà tổng dung lượng < 40MB thì lý thuyết có thể x100 lần tốc độ so với thông thường

Thử nghiệm upload thực tế upload 2154 tấm ảnh 1 lúc, dung lượng mỗi ảnh đa phần < 5MB, tổng dung lượng ~1.3GB mất khoảng 1 phút 30 giây thì xong, quy đổi tốc độ upload ~14.8 MB/s, khi upload ảnh, thực tế là bạn đang upload lên chính Cloudflare, tốc độ rất đảm bảo, sử lý được phần này khá vui, không nhiều script hỗ trợ upload nhiều ảnh cùng lúc mà đạt được hiệu năng này đâu, cụ thể bạn có thể kiếm 10 cái ảnh <10MB, thử nghiệm tốc độ thì sẽ cụ thể hơn

Tất cả dịch vụ mình lựa chọn cho hệ thống này, đều có tầm vóc thế giới, tuổi đời lâu dài, nếu upload ảnh mà thấy lỗi, đa phần là do mình sử lý chưa tốt, bạn nào sử dụng thấy lỗi, rảnh rỗi có thể comment dưới bài này để mình xem lại

Bản này lúc chạy test các tính năng, mình upload chắc phải hơn 100.000 tấm ảnh rồi ấy 🤐 lắm khi lỗi chỉ vì xóa nhầm vài dòng logs

Tính năng:

Các tính năng sau này thêm vào phần lớn không liên quan tới sử dụng, chủ yếu là vấn đề chống lạm dụng, tránh các tool, boot, hạn chế storage bị hết dung lượng miễn phí

• Tính năng duy nhất thêm sau này mà mình thấy thiết thực là hỗ trợ nhiều tài khoản storage, đúng ra nên viết từ đầu, mình lại thêm vào sau cùng, hậu quả cho việc này là sửa lại các URL be bét, ngồi tạo cỡ 100 tài khoản storage miễn phí thì có 1-2GB dung lượng để dùng tới mùa quýt luôn 🤣

Image Archive System v2 dù giao diện người dùng cực kì đơn giản, nhưng khi viết mình toàn tính theo cường độ user upload 1 lần 1000 ảnh trở lên, cái nút x tắt ảnh ra khỏi danh sách Selected Files, kể cả bạn có kéo vào 1000 ảnh, khi tắt nó vẫn mượt, không lag nhé

Giao diện:

Vấn đề này tùy gu, sở thích mỗi người, cá nhân mình thấy giao diện hiện tại khá ổn, trừ độ tương phản rất có vấn đề, mà cũng lười sửa thêm, dùng 1 thời gian xem thế nào rồi tính sau, các tính năng cho giao diện, theo mình đủ dùng, thực tế thao tác upload ảnh cũng chỉ thế, không cần thêm

Vấn đề trang quản trị cho user hay admin thì chịu, không biết làm, và cũng không có nhu cầu dùng tới

Giới hạn của hệ thống

Cloudflare Pages thường cho dùng tầm 128 MB RAM, thực tế kiểm nghiệm, cố tính dùng ~ 100MB sẽ bị báo thiếu RAM

Với upload file, rất khó để gặp tình huống này, vì thời gian Cloudflare Pages chuyển file sang storage rất nhanh, đa phần 1-2s, chuyển xong RAM sẽ được hoàn lại, nên trừ khi trang của bạn, liên tục có user upload cường độ cao mới sập, còn dùng bình thường, theo mình là thừa

Lỗi:

Các lỗi có thể xử lý, mình đã cố làm, từ 500, 502, 503 …. còn kiểu đang upload, mà Cloudflare, Jetpack hay dịch vụ storage bị lỗi, hay đơn giản nhất là mạng nhà bạn chập chờn thì … chịu thôi, ảnh upload bị lỗi vẫn nằm lại Selected Files để người dùng upload lại

Bảo mật:

Sử lý cơ bản, chủ yếu hạn chế lạm dụng, tránh storage hết dung lượng miễn phí, mà thường mình nghĩ với các trang upload ảnh cá nhân, cũng hiếm ai rảnh rỗi đi phá

Kết luận:

Mục đích ban đầu của Image Archive System, mình muốn 1 nơi lưu trữ ảnh thật bền vững, an toàn, miễn phí, kiểu 10 năm sau có coi lại, ảnh vẫn còn, xưa dùng Telegram thì siêu trâu, mà ăn vài đợt hãng thay đổi chính sách, cũng khá rén để dùng lại

Cấu hình hiện tại đều dùng các dịch vụ bố đời, mẹ thiên hạ, đa phần chính sách của họ ổn định nhiều năm, nên cũng đặt niềm tin vào hơn, mỗi cái tầm của mí vị này, to tới nổi end user phổ thông họ liệt vào dạng … không thèm nhận email, nói khó nghe tí là không thèm tiếp, đúng kiểu “bọn teo miễn phí cmn hết rồi, còn bắt support kĩ thuật nữa thì mài lên làm bố lun đê”, đâm ra viết cái gì cũng phải google lỗi đần người

Khá tự tin giới thiệu mọi người dùng thử phiên bản này, theo mình là nó đơn giản và nhanh hơn phiên bản telegraph-Image trước đây 🤞