自動化無しに生活無し

WEB開発関係を中心に備忘録をまとめています

Posts

  • django-channelsを使ってWebSocketを実現させる【チャットサイト開発に】
    django-channelsのチュートリアルに倣って、WebSocketのチャットサイトを作った。 とても実装難易度が高い。実装手順の備忘録として本記事をまとめる。 解説 ライブラリのインストール pip install django channels daphne djangoとdjango-channels、それからdaphne(ダフネ)をインストールする。 daphneは ASGI（Asynchronous Server Gateway Interface）に準拠したサーバー。 config/settings.py """ Django settings for ...
    続きを読む

  • 【Django】セッションの有効期限をセット、もしくはブラウザを閉じた時にセッションを無効化【settings.py】
    セキュリティを担保したいサイトであれば、ブラウザが閉じてもセッションが残るデフォルトのDjango設定を疎ましく思うだろう。 そういう時は、settings.pyからセッションの有効期限の設定もしくは、ブラウザの終了を検知して無効化する設定を施せばよい。 セッションに有効期限をセットする【単位:秒】 例えば60秒後にセッションを切って、再ログインを要求させる場合はこうする。 SESSION_COOKIE_AGE = 60 デフォルトでは2週間にな ...
    続きを読む

  • 【Leaflet.js】半径5km圏内の領域に円を描画する【circle】
    半径5km圏内に円を描画する。これで指定したポイントからの距離がつかめる。 HTML <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1"> <title>コメント付きマップ</title> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous"> <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script> <link rel="stylesheet" href="https://unpkg.com/leaflet@1.7.1/dist/leaflet.css" integrity="sha512-xodZBNTC5n17Xt2atTPuE1HxjVMSvLVW9ocqUKLsCC5CXdbqCmblAshOMAS6/keqq/sMZMZ19scR4PsZChSR7A==" crossorigin=""/> <script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js" integrity="sha512-XQoYMqMTK8LvdxXYG3nZ448hOEQiglfqkJs1NOQV44cWnUrBc8PkAOcXy20w0vlaXaVUearIOBhiXZ5V3ynxwA==" crossorigin=""></script> <script src="script.js"></script> <style> #map { height:90vh; } </style> </head> <body> <h1 class="bg-success text-white text-center">コメント付きマップ</h1> <main> <div class="row mx-0"> <div class="col-sm-6"> <div id="map"></div> </div> <div class="col-sm-6"> <input id="set_gps" type="button" value="GPSを使って入力"> <form ...
    続きを読む

  • 【Leaflet.js】クリックした地図上に画像を配置する【overlays】
    用途がいまいち思いつかないが、leaflet.jsでは地図上に画像を描画する事ができる。 HTML <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1"> <title>コメント付きマップ</title> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3+Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous"> <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script> <link rel="stylesheet" href="https://unpkg.com/leaflet@1.7.1/dist/leaflet.css" integrity="sha512-xodZBNTC5n17Xt2atTPuE1HxjVMSvLVW9ocqUKLsCC5CXdbqCmblAshOMAS6/keqq/sMZMZ19scR4PsZChSR7A==" crossorigin=""/> <script src="https://unpkg.com/leaflet@1.7.1/dist/leaflet.js" integrity="sha512-XQoYMqMTK8LvdxXYG3nZ448hOEQiglfqkJs1NOQV44cWnUrBc8PkAOcXy20w0vlaXaVUearIOBhiXZ5V3ynxwA==" crossorigin=""></script> <script src="script.js"></script> <style> #map { height:90vh; } </style> </head> <body> <h1 class="bg-success text-white text-center">コメント付きマップ</h1> <main> <div class="row mx-0"> <div class="col-sm-6"> <div id="map"></div> </div> <div class="col-sm-6"> <input id="set_gps" type="button" value="GPSを使って入力&quo ...
    続きを読む

  • 【Django】Ajax(jQuery)でロングポーリングを実装させる【チャットサイトの開発に】
    Ajaxを使えば、ページを部分的に更新させることができる。 そして、setTimeoutを使うことで、指定した時間おきにページを部分的に更新することができる。 ただ、Ajaxによるリクエストとレスポンスを繰り返している(ただのポーリング)ようでは、ウェブサーバーに負担が掛かってしまう。 クラウドサーバーなどは死活問題で、負荷が増えると課金してサーバーの強化などを考慮しなければならない。 そこで、リクエスト ...
    続きを読む

  • Ubuntu20.04にNginxとPHP7.4をインストールしてHelloWorldをする
    5年以上前にやったきり、完全に忘れているNginxでPHPを動かす方法。 本記事ではその手順をまとめる。 必要なパッケージのインストール sudo apt install nginx php php-fpm Nginxはサーバー、phpはPHP処理系、php-fpmはNginxから動作させるために必要なもの Nginxの設定 /etc/nginx/sites-available/defaultを書き換える。 sudo vi /etc/nginx/sites-available/default TODOと書かれた場所だけ編集する。 ## # You should look at the following ...
    続きを読む

  • 【Django】models.pyにて、オリジナルのバリデーション処理を追加する【validators】【正規表現が通用しない場合等に有効】
    例えば、簡易掲示板にて、特定の禁止ワードを含んだ投稿を拒否したい場合。 承認制にして、管理者が文面を確認した上で公開を許す方法もあるが、それでは人件費がかかる。 なるべく保存する前に禁止ワードを含んでいるかどうかをチェックする仕組みにしたい。 そういう時は、validatorsに独自の関数を割り当てれば良い。 コードは40分Djangoから流用して作る models.py 不快語を除外するバリデーションを実装させる。 from django.db import models ...
    続きを読む

  • 【Django】DateTimeFieldに自動的に現在時刻を入れるには、auto_now_addもしくはauto_nowフィールドオプションを指定【新規作成時・編集時の時刻】【※編集不可】
    作成時と編集時の日時を自動的に入れたい場合は、auto_nowもしくはauto_now_addを指定する。 auto_nowはモデルのsaveメソッドが実行された時、auto_now_addはモデルに新規作成された時に、その時の日時が指定したフィールドに格納される。 つまり、モデルを下記のように組むと良いだろう。 from django.db import models class Topic(models.Model): comment = models.CharField(verbose_name="コ ...
    続きを読む

  • JavaScriptでクエリパラメータを書き換え、GETメソッドを送信する【通販サイトなどの絞り込み検索に有効】
    クエリパラメータ(クエリ文字列、もしくはクエリストリング)はサーバーサイドだけのデータではない、JavaScriptも操作できる。 これを利用することで、サイトの絞り込み検索を作ることができる。 HTML 下記のように価格帯の入力欄を作る。 <h2>下限</h2> <input class="url_replace" type="text" name="min_price"> <h2>上限</h2> <input class="url_replace" type="text" name="max_price"> そして、次項のJavaScriptを読んでおく。 JavaScript window.addEventListener("load" , function (){ $(".url_replace").on("keydown", function(e) { ...
    続きを読む

  • 【Django】未認証ユーザーをログインページにリダイレクトする【LoginRequiredMixinもしくは@login_required】
    ログインしていないユーザーが特定のページにアクセスしてきた時、処理を実行せず、ログインページにリダイレクトするには、LoginRequiredMixinを使う。 前提 予め前もって、認証を実装しておく。allauthを使っても、Djangoの備え付けの認証を使っても良い。 【メール認証】Django-allauthの実装方法とテンプレート編集【ID認証】 【Django】allauth未使用でユーザー認証 ...
    続きを読む