Lưu media WordPress dưới dạng tên miền phụ với Wasabi Cloud

Wasabi Cloud Storage Quick Start Guide

Hiện nay việc upload/tải lên các file hình ảnh, file tài liệu, file video… lên website WordPress được lưu trữ trực tiếp trên hosting (vps, server) của chính bạn dưới dạng.

https://domain.com/wp-content/uploads/2021/06/hinh-anh.jpg

Bạn muốn media của mình được lưu trên một máy chủ khác dưới dạng tên miền phụ như:

https://cdn.domain.com/wp-content/uploads/2021/06/hinh-anh.jpg
HAY
https://media.domain.com/wp-content/uploads/2021/06/hinh-anh.jpg

Dưới đây tôi sẽ hướng dẫn cho các bạn các bước thực hiện, dựa trên nhưng plugin, các nhà cung cấp dịch vụ lưu trữ và thử nghiệm thực tế với tốc độ ổn định nhất – giá thành rẻ nhất.

Tại sao nên Cloud media

  • Giảm tải cho website, giúp web load nhanh hơn
  • Hình ảnh, media được backup khi website có sự cố
  • Hình ảnh, CSS, JS, phông chữ và các tệp khác sẽ tải xuống nhanh hơn, tăng tốc thời gian tải trang.
  • Cải thiện kết quả SEO
  • Phù hợp cho các website có nhiều hình ảnh

Ngoài ra còn vân vân và mây mây tác dụng khác, các dân chơi WordPress nhìn qua sẽ hiểu ngay!

Media được lưu ở đâu

Ở bài viết này tôi không đề cập sâu đến ưu nhược điểm của từng nhà cung cấp, tôi sẽ nói sơ qua trên kinh nghiệm sử dụng thực tế với các bên và dừng lại ở Wasabi Cloud (Chi tiết xem ở phần “Chuẩn bị”).

Chuẩn bị

Plugin *

1/ WP Offload Media Pro

Đây là một plugin mất phí bạn cần mua nó với giá 149$ (Bạn có thể mua tại đây với giá 39$ – nhớ add mã giảm giá “Wiki2021” để được giảm thêm 4$)

  • Đã bao gồm addon
  • Update không giới hạn
  • Không giới hạn tên miền

2/ WP Offload Media Tweaks (Tải xuống miễn phí tại đây)

Cloud Storage *

(Ở bài hướng dẫn này mình khuyên các bạn lên dùng 1 trong 2 nhà cung cấp Wasabi hoặc DigitalOcean)

Wasabi Cloud S3

  • Giá: 5,99$/tháng
  • Dung lượng lưu trữ: 1TB (1000GB) – Mỗi GB thêm chỉ phải trả 0,0059$
  • Băng thông tải xuống không giới hạn (Bao gồm cả API)
Các bạn đăng ký tài khoản Wasabi Cloud S3 tại đây

Note: Nếu với nhu cầu lưu trữ lớn đây là nhà cung cấp tối ưu nhất cho các bạn về giá

Cloudflare

Các bạn có thể đăng ký và dùng tài khoản miễn phí của Cloudflare. Việc dùng thêm Cloudflare giúp tiết kiệm băng thông, cache file… Ngoài những chức năng thông thường, CloudFlare còn có nhiều dịch vụ khác nữa về CDN, SPDY, tường lửa chống Ddos, Spam, Chứng chỉ số SSL, Forward Domain,…

Các bạn đăng ký tài khoản Cloudflare tại đây
Tổng kết lại chúng ta cần

1/ Plugin WP Offload Media Pro + WP Offload Media Tweaks
2/ Wasabi Cloud S3
3/ Tài khoản Cloudflare

Đây là bộ 3 mình đã cài đặt và test cho hiệu suất và giá thành tốt nhất. Đối với các bạn có điều kiện về kinh tế có thể chọn các nhà cung cấp xin xò hơn.

Cách cài đặt

Bước 1: Mua và kích hoạt Plugin WP Offload Media Pro

Bước 2: Đăng nhập tài khoản Wasabi Cloud

Đã có tài khoản Wasabi Cloud? Đăng nhập tại đây.

Nếu bạn chưa có tài khoản Wasabi Cloud, bạn sẽ cần đăng ký tại đây.

Tạo User

Khi bạn đã đăng nhập vào Bảng điều khiển Wasabi Cloud, bạn sẽ cần tạo User Wasabi Cloud

Trên giao diện quản lý bạn chọn “User” ở menu Bảng điều khiển, sau đó nhấp vào nút “Create User”.

Trên giao diện quản lý bạn chọn “User” ở menu Bảng điều khiển, sau đó nhấp vào nút “Create User”.

Nhâp tên cho User sau đó chọn tích “Programmatic (create API key)“. Tiếp theo chọn “Next“.

Nhâp tên cho User sau đó chọn tích "Programmatic (create API key)". Tiếp theo chọn "Next".

Tiếp tục click NEXT

Ở màn hình “Policy” bạn chọn tiếp “AmazonS3FullAccess

Ở màn hình tiếp theo click “Create User” (Như hình bên dưới)

Ở màn hình tiếp theo click "Create User" (Như hình bên dưới)

Ở màn hình tiếp theo các bạn lưu lại Access KeysSecret Keys.

Bước 3: Thiết lập plugin WP Offload Media Tweaks để làm việc với Wasabi

Wasabi Cloud Storage tương thích với API Amazon S3, nhưng để WP Offload Media Pro có thể kết nối với nó, bạn cần thực hiện một số chỉnh sửa đối với các URL mà plugin sử dụng để quản lý bộ nhớ. May mắn thay, có một plugin WP Offload Media Tweaks mà bạn có thể tải xuống miễn phí, cài đặt vào trang web WordPress của mình và kích hoạt nó lên.

Lưu ý: Bạn lên tải plugin ở trang trên vì nó đã được chỉnh sửa để thích hợp với Wasabi và đảm bảo file amazon-s3-and-cloudfront-tweaks.php trong đó được cấu hình như bên dưới.

/*
 * Custom S3 API Example: Wasabi
 * @see https://wasabi.com/
 */
add_filter( 'as3cf_aws_s3_client_args', array( $this, 'wasabi_s3_client_args' ) );
add_filter( 'as3cf_aws_get_regions', array( $this, 'wasabi_get_regions' ) );
add_filter( 'as3cf_aws_s3_bucket_in_path', '__return_true' );
add_filter( 'as3cf_aws_s3_domain', array( $this, 'wasabi_domain' ) );
add_filter( 'as3cf_aws_s3_console_url', array( $this, 'wasabi_s3_console_url' ) );

Và các vị trí như bên dưới

function wasabi_s3_client_args( $args ) {
    $args['endpoint']               = 'https://s3.eu-central-1.wasabisys.com';
    $args['region']                 = 'eu-central-1';
    $args['use_path_style_endpoint'] = true;

    return $args;
}

function wasabi_get_regions( $regions ) {
    $regions = array(
        'us-east-1' => 'Wasabi US East 1 (N. Virginia)',
        'us-east-2' => 'Wasabi US East 2 (N. Virginia)',
        'us-west-1' => 'Wasabi US West 1 (Oregon)',
        'eu-central-1' => 'Wasabi EU Central 1 (Amsterdam)',
        //'ap-northeast-1' => 'Wasabi AP Northeast 1 (Tokyo)', // Restricted
    );

    return $regions;
}

function wasabi_domain( $domain ) {
    return 'wasabisys.com';
}

function wasabi_s3_console_url( $url ) {
    return 'https://console.wasabisys.com/#/file_manager/';
}

Nếu bạn đang sử dụng vùng máy chủ Wasabi là “eu-central-1” cho nhóm của mình, thì bạn đã hoàn tất, hãy lưu các thay đổi của bạn vào và chuyển sang bước tiếp theo.

Tuy nhiên, nếu bạn đang sử dụng một vùng máy chủ khác, vui lòng thay đổi wasabi_s3_client_args từ “eu-central-1” bằng vùng bạn đã chọn (Ví dụ: “us-east-1”).

Bước 4: Thêm Access Key + Secret Access Key vào trang web và cấu hình Wasabi làm việc với WP Offload Media Pro

Bạn cần chèn Access Key ID và Secret Access Key vào website để nó hoạt động với plugin WP Offload Media Pro.

Để bảo mật tốt nhất nó lên được chèn vào file wp-config.php

define( 'AS3CF_SETTINGS', serialize( array(
    'provider' => 'do',
    'access-key-id' => '********************',
    'secret-access-key' => '**************************************',
) ) );

Nó phải được đặt trước khối following trong file wp-config.php


/* That's all, stop editing! Happy blogging. */

/** Absolute path to the WordPress directory. */
if ( !defined('ABSPATH') )
    define('ABSPATH', dirname(__FILE__) . '/');

/** Sets up WordPress vars and included files. */
require_once(ABSPATH . 'wp-settings.php');

Note: Nếu đặt sau khối mã trên WP Offload Media sẽ không đọc được chúng.

Cấu hình WP Offload Media

Bạn vào trang quản trị Wp và chọn Setting > offload Media và chọn Amazon S3 là nhà lưu trữ.

Bạn vào trang quản trị Wp và chọn Setting > offload Media và chọn Amazon S3 là nhà lưu trữ.

Tiếp tục bằng cách click “Next”

Tạo Bucket

Tại đây bạn chọn vùng máy chủ

Nhập tên Bucket bạn đã tạo trong Wasabi hoặc bạn có thể tạo mới

Nhập tên Bucket bạn đã tạo trong Wasabi hoặc bạn có thể tạo mới.

Bởi vì tôi sẽ sử dụng Cloudflare làm CDN cho trang web, tôi sẽ chọn một tên nhóm giống với Miền tùy chỉnh (CNAME) mà mình định sử dụng.

Sau đó click “Create New Bucket“. Bây giờ bạn sẽ được chuyển hướng trở lại trang cài đặt của WP Offload Media.

Bây giờ bạn sẽ được chuyển hướng trở lại trang cài đặt của WP Offload Media.

Như thế khi bạn tải media lên nó đã được lưu trữ trên Wasabi mà không phải trên hosting hay vps của bạn.

Bây giờ đến bước làm đẹp cho url lưu trữ ảnh để nó trở lên chuẩn Seo và chuyên nghiệp dưới dạng “cdn.tenmien.com”…

Thiết lập CDN

Dù hosting hay Vps của bạn được các nhà cung cấp quảng cáo là nhanh, mạnh.., tôi thực sự khuyên bạn nên sử dụng CDN để tăng tốc độ phân phối phương tiện của bạn cho khách truy cập vào trang web cho dù họ ở đâu trên Thế giới và cũng cải thiện SEO bằng cách sử dụng miền tùy chỉnh.

Trong hướng dẫn này, chúng tôi sẽ sử dụng Cloudflare làm CDN cho website.

Nếu bạn không sử dụng Cloudflare để lưu trữ miền của mình hoặc muốn sử dụng một nhà cung cấp CDN khác, vui lòng để lại bình luận tôi sẽ hướng dẫn bạn cài đặt nó.

Cấu hình Cloudflare DNS

Đăng nhập vào Bảng điều khiển Cloudflare và điều hướng đến cài đặt DNS cho miền của bạn. Nhấp vào nút Add Record.

Chọn Type là “CNAME

Nhập Name là tên bạn muốn hiển thị tên miền phụ. Ví dụ cdn.tenmien.com thì “Name” sẽ có giá trị là “cdn“.

Nhập “Target” là miền đầy đủ cho Bucket theo cấu trúc bên dưới

  1. Miền đầy đủ cho bucket. Trong ví dụ trên sẽ là ian-cdn.brains.us
  2. Tên loại lưu trữ s3
  3. Tên khu vực máy chủ. Trong ví dụ là eu-central-1
  4. Tên miền wasabi, tôi để là wasabisys.com

Kết hợp 4 tiền tố trên tôi được kết quả để nhập vào trường “Target” như sau:


ian-cdn.brains.us.s3.eu-central-1.wasabisys.com

Đảm bảo Proxy status được để là “Proxied” (với biểu tượng đám mây màu cam), sau đó nhấp vào nút Save để tạo bản ghi DNS mới.

Cấu hình Delivery Provider

Hãy chờ khoảng 5 phút để DNS được cập nhật, sau đó chuyển trở lại trang cài đặt WP Offload Media trên trang web của bạn. Trong phần Delivery nhấp vào “Change” bên cạnh “Amazon S3”.

Hãy chờ khoảng 5 phút để DNS được cập nhật, sau đó chuyển trở lại trang cài đặt WP Offload Media trên trang web của bạn. Trong phần Delivery nhấp vào “Change” bên cạnh “Amazon S3”.

Từ danh sách Nhà cung cấp dịch vụ CDN, hãy chọn Another CDN, sau đó chọn Cloudflare , xác nhận lựa chọn của bạn bằng cách nhấp vào nút Save Delivery Provider.

Bây giờ bạn quay lại trang cài đặt của WP Offload Media, hãy bật Custom Domain (CNAME) và nhập tên miền thích hợp vào. Sau đó nhấp vào nút Save Changes.

Hoàn tất các bước nếu không có lỗi gì, bạn có thể upload test một file ảnh lên website và bạn sẽ thấy URL của nó đã thay đổi cứ phải gọi là CHẤT @!

Trên đây là toàn bộ hướng dẫn Lưu media WordPress dưới dạng tên miền phụ với Wasabi Cloud. Với các nhà cung cấp Cloud Storage khác mình sẽ có hướng dẫn trong các bài viết tiếp theo.

Nếu bạn không muốn làm theo hướng dẫn trên mà vẫn muốn media được lưu trên Cloud Storage thì có thể dùng gói Cài đặt media WP lên Cloud Storage nhưng nó là mất phí nhé!

5/5 - (3 votes)
We will be happy to hear your thoughts

Leave a reply

Wiki Hobby
Enable registration in settings - general