diadia

興味があることをやってみる。自分のメモを残しておきます。

django:PCとスマホで表示を変えたい

ユーザーのデバイスによって表示を変更したい

表示方法の変更としてレスポンシブデザインを採用しBootstrapを利用してきた。しかしレスポンシブな方法では納得いく表現ができなかった。
バイスによって異なるテンプレートを表示させることができるか調査して実装できれば実装してみたい。ユーザーのデバイスはuser-agentsを利用して捕捉することができるようだ。https://pypi.org/project/user-agents/
そのほかにdjango-user-agentsなるものもあった。これも同じことが実現できそうか?https://pypi.org/project/django-user-agents/
そもそも標準ライブラリのplatformを使えば対処できるのでは?という疑問も出てくる。何か分かったら更新する。

バイスによってテンプレートを変える

django-user-agentsを使うと手軽にテンプレートをデバイスによって使い分けられるようになった。テンプレートの使い分けはviews.pyでユーザのデバイスの種類を特定し、デバイスの種類によってrenderでテンプレートを使い分ける。

from django_user_agents.utils import get_user_agent

class ProductListView(View):

    def get(self, request, *args, **kwargs):
        object_list = Product.objects.all()
        context["object_list"] = object_list
        
        user_agent = get_user_agent(request)
        if user_agent.is_mobile:
            return render(request, "products/list_mobile.html", context)
            
        elif user_agent.is_tablet:
            return render(request, "products/list_tablet.html", context)
            
        else:
            return render(request, "products/list_pc.html", context)

django-user-agentsを使うとミドルウェアを通してrequestに属性を付け加えられる。これを利用してユーザーのデバイスを特定することができる。

インストール方法

pip install pyyaml ua-parser user-agents
pip install django-user-agents

settings.pyの設定項目

INSTALLED_APPS = (
    # Other apps...
    'django_user_agents',
)

# キャッシュを使うとdjango-user-agentsを素早く働かせることができる
CACHES = {
    'default': {
        'BACKEND': 'django.core.cache.backends.memcached.MemcachedCache',
        'LOCATION': '127.0.0.1:11211',
    }
}


# キャッシュを使わない場合はNoneと記述。キャッシュを使う場合は基本的には'default'を使う
USER_AGENTS_CACHE = 'default'

# ミドルウェアにも下記を加える
MIDDLEWARE_CLASSES = (
    # other middlewares...
    'django_user_agents.middleware.UserAgentMiddleware',
)