Nginx Как сделать мобильную версию сайта?

Question

[Алексей]

Подскажите, пожалуйста, что не так с конфигом?
Пытаюсь сделать мобильную версию сайта с поддоменом "m".
Всё различие в каталогах со статикой: основной сайт - application, мобильный - mobile
Новичок в бэке, так что не судите строго и если есть что ещё поправить - сообщайте)

server {
        listen          80;
        server_name     site.ru www.site.ru;

        if ($http_user_agent ~* (iphone|аndroid|blackberry)){
                rewrite ^/(.*)$ m.site.ru/$1 permanent;
        }

        location / {
                auth_basic              "Enter pass:";
                auth_basic_user_file    /var/www/nginx/passwords;

                root    /var/www/site.ru/html/application;
                index   index.html;
                charset utf-8;

                proxy_pass              http://localhost:1337/;

                proxy_set_header        X-Real-IP               $remote_addr;
                proxy_set_header        X-Forwarded-For         $proxy_add_x_forwarded_for;
                proxy_set_header        Host                    $host;
        }
}


server {
        listen          80;
        server_name     m.site.ru www.m.site.ru;

        location / {
                auth_basic              "Enter pass:";
                auth_basic_user_file    /var/www/nginx/passwords;

                root    /var/www/site.ru/html/mobile;
                index   index.html;
                charset utf-8;

                proxy_pass              http://localhost:1337/;

                proxy_set_header        X-Real-IP               $remote_addr;
                proxy_set_header        X-Forwarded-For         $proxy_add_x_forwarded_for;
                proxy_set_header        Host                    $host;
        }
}

UPD:
Часть заработала - на site.ru и m.site.ru отдаёт разную статику, но автоматически не переключается на мобильную версию сайта + мобильная версия сайта не работает с сервером.

server {
        listen          80;
        server_name     site.ru www.site.ru;

        if ($http_user_agent ~* (iphone|аndroid|blackberry)){
               rewrite ^/(.*)$ http://m.site.ru/$1 permanent;
        }

        location / {
                auth_basic              "Enter pass:";
                auth_basic_user_file    /var/www/nginx/passwords;

                root    /var/www/site.ru/html/application;
                index   index.html;
                charset utf-8;

                proxy_pass              http://localhost:1337/;

                proxy_set_header        X-Real-IP               $remote_addr;
                proxy_set_header        X-Forwarded-For         $proxy_add_x_forwarded_for;
                proxy_set_header        Host                    $host;
        }
}

server {
        listen 80;
        server_name m.site.ru;
        root    /var/www/site.ru/html/mobile;
        index   index.html;
}

Comments

[Дмитрий Лупонос]

А что не так с конфигом? он не работает? какая ошибка?
Для разных версий сайта смущает строка
proxy_pass localhost:1337/;
Она идентичная. Может быть для тестов транслировать на статичную страницу пока ?

[Алексей]

У меня m.site.ru и site.ru ведут на обычную версию сайта (может быть проблема с настройкой поддомена на хостинге?).

proxy_pass localhost:1337/ - это перенаправление запросов к Node.js (Backend один на двоих, так что с этим всё должно быть в порядке) - в обычной версии сайта отлично отрабатывает.

Answer 1

[Алексей]

Вот такое решение у меня получилось в итоге. Нужно чуть причесать, но перенаправление выполняет

server {
        listen          80;
        server_name     site.ru;

        if ($http_user_agent ~* "(iphone|android|blackberry)") {
                rewrite ^ http://m.site.ru redirect;
                break;
        }

        location / {
                root /var/www/site.ru/html/application; #статика
                index index.html;
                charset utf-8;

                proxy_pass http://localhost:1337; #здесь у нас висит Node.js - отправляем все запросы сюда
                proxy_set_header        X-Real-IP               $remote_addr;
                proxy_set_header        X-Forwarded-For         $proxy_add_x_forwarded_for;
                proxy_set_header        Host                    $host;
        }
}

server {
        listen          80;
        server_name m.site.ru;

        location / {
                root    /var/www/site.ru/html/mobile; #статика мобильного сайта
                index   index.html;
                charset utf-8;
        }

        location /api { #перенаправляем все ajax запросы m.site.ru к api
                proxy_pass              http://localhost:1337;
                proxy_set_header        X-Real-IP               $remote_addr;
                proxy_set_header        X-Forwarded-For         $proxy_add_x_forwarded_for;
                proxy_set_header        Host                    $host;
        }
}

Answer 2

[criminalist]

Ага послушал советчика вроде Вас, теперь делаю третий шаблон потому что адаптивная верстка оказалось очень тяжелой и поисковики отказались ее принимать, но это уже отдельный разговор.
Я понял что нужны отдельные версии мобильная и для пк.

Answer 3

[Егор Казанцев]

Бросайте вы эти суб домены и прочие отдельные домены - используйте адаптивную верстку.

Comments

[Егор Казанцев]

Murmurianez: Расскажи это Лебедеву и mail.ru

[Алексей]

Адаптивную использую в полной версии сайта для того чтобы пользователь мог изменить размер окна на компе. Для мобильного варианта она не пригодна в моём случае - огромный вес (SPA)

[Алексей]

Егор Казанцев: Если будет возможность - обязательно расскажу.

Answer 4

[Олег Баталов]

Как вариант: отдавать один html и разные css в зависимости от "мобильности" клиента.