Apache 2 chuyển hướng và viết lại dựa trên thiết bị đã sử dụng

theanh

Administrator
Nhân viên
Kể từ khi điện thoại thông minh và máy tính bảng như iPhone, iPad, điện thoại và máy tính bảng Android, BlackBerries, v.v. tăng mạnh, bạn có thể cân nhắc tạo phiên bản di động cho trang web của mình. Hướng dẫn này giải thích cách cấu hình Apache để phục vụ phiên bản di động cho trang web của bạn nếu khách truy cập sử dụng thiết bị di động và phiên bản thông thường nếu khách truy cập sử dụng máy tính để bàn chuẩn. Điều này có thể thực hiện được bằng mô-đun viết lại của Apache.

1 Lưu ý sơ bộ​

Trong hướng dẫn này, trang web "bình thường" của tôi có thể truy cập được tại http://www.example.comhttp://example.com, trong khi trang web di động của tôi được gọi là http://m.example.com. Các vhost này đã tồn tại trên hệ thống của tôi, vì vậy tôi sẽ không đề cập đến cách thiết lập chúng.

2 Bật mod_rewrite​

Trước tiên, bạn phải đảm bảo rằng mô-đun Apache mod_rewrite được bật. Mô-đun này cho phép bạn thực hiện chuyển hướng httpd, chuyển hướng apache và URL apache rewrite thông qua máy chủ web apache. Trên Debian/Ubuntu, bạn có thể bật tính năng này như sau:
Mã:
a2enmod rewrite
Sau đó, khởi động lại Apache - đối với Debian/Ubuntu, lệnh là:
Mã:
/etc/init.d/apache2 restart

3 Cấu hình Apache để cho phép quy tắc ghi lại trong .htaccess Tệp​

Trang web "bình thường" của tôi www.example.com/example.com có tệp cấu hình vhost /etc/apache2/sites-available/www.example.com.vhost và thư mục gốc tài liệu /var/www/www.example.com/web.

Trang web dành cho thiết bị di động m.example.com của tôi có tệp cấu hình vhost /etc/apache2/sites-available/m.example.com.vhost và thư mục gốc tài liệu /var/www/www.example.com/mobile.

Tôi muốn đặt các quy tắc viết lại cho từng trang web trong tệp .htaccess (mặc dù cũng có thể đặt chúng trực tiếp trong tệp cấu hình vhost) với quyền được máy chủ http của apache đọc. Do đó, trước tiên tôi phải sửa đổi cấu hình vhost của chúng ta để cả hai tệp .htaccess đều có thể chứa các chỉ thị ghi lại. Chúng ta có thể thực hiện việc này bằng dòng AllowOverride All (cho phép .htaccess ghi đè tất cả các thiết lập trong cấu hình vhost, cấu hình máy chủ):
Mã:
vi /etc/apache2/sites-available/www.example.com.vhost
Mã:
vi /etc/apache2/sites-available/m.example.com.vhost
Mã:
[...]  AllowOverride All 
[...]
Khởi động lại Apache sau đó:
Mã:
/etc/init.d/apache2 restart

4 Tạo quy tắc viết lại​

Bây giờ chúng ta hãy tạo các quy tắc viết lại cho trang web "bình thường" www.example.com/example.com sẽ chuyển hướng tất cả người dùng thiết bị di động sang phiên bản di động m.example.com - Tôi tập trung vào các thiết bị/tác nhân người dùng có liên quan ở đây, đó là Android, Blackberry, Googlebot-mobile (bot tìm kiếm di động của Google), IE Mobile, iPad, iPhone, iPod, Opera Mobile, PalmOS và WebOS.

/var/www/www.example.com/web/.htaccess trông như sau:
Mã:
vi /var/www/www.example.com/web/.htaccess
Mã:
RewriteEngine On
RewriteCond %{HTTP_USER_AGENT} "android|blackberry|googlebot-mobile|iemobile|ipad|iphone|ipod|opera mobile|palmos|webos" [NC]
RewriteRule ^$ http://m.example.com/ [L,R=302]
Đối với trang web di động m.example.com của chúng tôi, các quy tắc viết lại sẽ chuyển hướng tất cả người dùng không sử dụng thiết bị di động đến trang web "bình thường" của chúng tôi www.example.com/example.com trông như sau - Tôi đã phủ định điều kiện RewriteCond từ tệp .htaccess trước đó:
Mã:
vi /var/www/www.example.com/mobile/.htaccess
Mã:
RewriteEngine On
RewriteCond %{HTTP_USER_AGENT} "!(android|blackberry|googlebot-mobile|iemobile|ipad|iphone|ipod|opera mobile|palmos|webos)" [NC]
RewriteRule ^$ http://www.example.com/ [L,R=302]
Vậy là xong, chúng ta đã thiết lập chỉ thị chuyển hướng! Bây giờ bạn có thể thực hiện một số thử nghiệm, ví dụ: truy cập m.example.com bằng trình duyệt máy tính để bàn chuẩn:


data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20width=%22228%22%20height=%2290%22%3E%3C/svg%3E


Nếu mọi việc diễn ra tốt đẹp, bạn sẽ được chuyển hướng đến www.example.com:


data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20width=%22372%22%20height=%22163%22%3E%3C/svg%3E


Bây giờ hãy thử nghiệm với thiết bị di động (tôi sử dụng điện thoại Android ở đây) và truy cập www.example.com:


data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20width=%22363%22%20height=%22603%22%3E%3C/svg%3E


Bạn sẽ được chuyển hướng đến m.example.com:


data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20width=%22364%22%20height=%22604%22%3E%3C/svg%3E



5 Liên kết​

 
Back
Bên trên