自動化無しに生活無し

WEBとかAIとかLinux関係をひたすら書く備忘録系ブログ

  • DjangoでServerSentEvents(SSE)とローカルキャッシュを使い、リアルタイムでDB内の情報を表示する

    • 作成日時:
    • 最終更新日時:
    • Categories: サーバーサイド
    • Tags: Django
    【前置き】Djangoでリアルタイム通信する場合 DjangoでDB内の情報をリアルタイムで表示させる場合、 ポーリング Server Sent Events Web Socket この3つが候補に挙がる。 ポーリングはシンプルではあるが、リクエストを送らない限り、情報は得られない。 【Django】Ajax(jQuery)でロングポーリングを実装させる【チャットサイトの開発に】 Web Socketは実装難度が高い。 【Django】channelsを使ってWeb ...
  • Reactベースの静的サイトジェネレーターGatsbyを使う

    React学習のため、とりわけ扱いやすいGatsbyを使うことにした。 学習完了次第。このサイトは、HUGOからGatsbyに移行する予定。 本記事では、Gatsbyを調べてわかったことをまとめる。学習の都度まとめているため、誤りが含まれる可能性がある点をご了承いただきたい。 実装方法 Ubuntu 22.04 LTS 環境下で動作させている。 sudo npm install -g gatsby-cli まず、グローバル環境下でGatsbyをインストールする。 これでGatsbyコマン ...
  • 【JavaScript】awaitとasyncの違い【非同期処理のコールバック地獄対処】

    【前提知識】同期処理と非同期処理とは 同期処理とは、 console.log("1"); console.log("2"); console.log("3"); このように上から順に実行される処理のことを言う。 一方で、非同期処理とは console.log("1"); setTimeout(() => { console.log("2"); }, 1000); // 1秒後に実行 console.log("3"); このように、処理の完了を待たずに後続の処理を行うことを言う。 setTimeoutの他に、fetchAPIが非同期処理に当てはまる。 fetchAPIのコールバック地獄に対処する。 例えば、fetchAPIでリクエストを書く時、 fetch(url, { method, headers, body }) .then( (res) => { if ...
  • 【Django】アップロードしたPythonファイルを動かす【subprocessと動的import】

    • 作成日時:
    • 最終更新日時:
    • Categories: サーバーサイド
    • Tags: django
    アップロードしたPythonファイルをDjango側で動作させる。 仮想環境を動かし、事前にインストールしておいたライブラリも動くようにする。 views.py from django.shortcuts import render,redirect from django.views import View from .models import Document from .forms import DocumentForm from django.conf import settings import subprocess import importlib.util import os class IndexView(View): def get(self, request, *args, **kwargs): context = {} context["documents"] = Document.objects.all() # アップロードされたPythonを実行する。 document = Document.objects.filter(id=1).first() # アップロードされたPythonプログラムのファイルパスを作成 program_path = str(settings.BASE_DIR) + document.file.url # 仮想環境のファイルパスを作成(pythonファイルのある ...
  • Djangoのcreatesuperuserでインタラクティブシェルを省略する。

    python manage.py createsuperuserで管理ユーザーをつくることができるが、その後のインタラクティブシェルの入力がめんどくさい。 そこで、環境変数を使ってインタラクティブシェルを省略する。 更に、エイリアスを使ってコマンド入力も簡略化させる。 # createsuperuser の自動化 export DJANGO_SUPERUSER_USERNAME="asahina" export DJANGO_SUPERUSER_EMAIL="asahina@asahina.com" export DJANGO_SUPERUSER_PASSWORD="seiya0723" alias django_createsuperuser="python manage.py createsuperuser --noinput" ...
  • 【Heroku】デプロイ直後にコマンドを実行する【Procfile編集】

    例えば、Djangoのデプロイ時に、マイグレーションをしてほしいのであれば、 release: python manage.py migrate web: gunicorn config.wsgi:application --log-file - とする。 並列で処理を実行して欲しい場合 worker を使う。 release: python manage.py migrate worker: python manage.py custom_command web: gunicorn config.wsgi:application --log-file - 参照 https://devcenter.heroku.com/articles/procfile ...
  • 【Django】django-otpで多要素認証(二要素認証)を実現させる【GoogleAuthenticator】

    • 作成日時:
    • 最終更新日時:
    • Categories: サーバーサイド
    • Tags: Django
    Djangoは、デフォルトでもユーザー名とパスワードによるログインを用意している。 しかしユーザー名とパスワードが知られてしまえば、誰でも簡単にログインできてしまう。 そこで、ユーザー名やパスワードなどの「記憶情報」だけでなく、ワンタイムパスワードなどを使い「所持情報」による認証もする。 この「記憶情報」と「所持情報」の2つの要素による認証を、二要素認証という。(多要素認証ともいう) https://ja ...
  • 【Django】任意のタイミングでサーバーのカメラでライブ配信する【imutils.video.VideoStreamer】

    • 作成日時:
    • 最終更新日時:
    • Categories: サーバーサイド
    • Tags: django
    下記記事で、リアルタイムでブラウザ上に映像を出力することができるようになった。 【Django】OpenCVとyieldを使い、ウェブカメラの映像をライブ配信する しかし、このコードはrunserverと同時に起動しているため、カメラを止めることはできない。 任意のタイミングでカメラのON・OFFをするため、改良した。 必要なライブラリ asgiref==3.8.1 Django==5.0.6 imutils==0.5.4 numpy==1.26.4 opencv-contrib-python==4.9.0.80 sqlparse==0.5.0 typing_extensions==4.12.0 views.py from django.shortcuts import render,redirect from django.views import View from .detector import SingleMotionDetector from imutils.video import VideoStream from django.http import StreamingHttpResponse import os import cv2 import time import ...
  • 【Django】ストレージに保存されているファイルにアクセス、編集して保存する【InMemoryUploadedFile】

    • 作成日時:
    • 最終更新日時:
    • Categories: サーバーサイド
    • Tags: Django
    アップロードされているファイルを編集したいことがある。 今回はテキストファイルを想定して、コードを書いてみた。 ただし、開発中にファイルパスを直接指定して編集する方法は、デプロイ後は使えないので、その点も考慮した。 実際にS3ストレージに保存されているファイルを読み込み、編集して保存できた。 ストレージに保存されているファイルを編集する。 手順は ストレージの保存先URLを取得する URLに対してリクエストを送 ...
  • 【JavaScript】localStorageを使ってブラウザにデータを記録する【Cookieが使えないときに】

    サーバー側にデータを送信しない場合、セキュリティ上CookieではなくlocalStorageを使う。 ソースコード <!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1"> <title>Hello World test!!</title> </head> <body> <input id="test" type="text"> <input id="reset" type="button" value="リセット"> <script> const test = document.querySelector("#test"); const reset = document.querySelector("#reset"); // 読み込みされたとき、データがあればテキストボックスにセットする。 const data = localStorage.getItem("test"); if (data){ test.value = data; } // キー入力があるたびにローカルストレージにセットする。 test.addEventListener("change", (event) => { const value = event.currentTarget.value; localStorage.setItem("test",value); }); reset.addEventListener("click", () => { test.value = ""; ...