【JavaScript】localStorageを使ってブラウザにデータを記録する【Cookieが使えないときに】
- 作成日時:
- 最終更新日時:
- Categories: フロントサイド
- Tags: JavaScript tips
サーバー側にデータを送信しない場合、セキュリティ上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 = ""; ...【Django】逆参照で効率的にDBにアクセスする【.prefetch_related() 】
例えばこのモデルのとき。 from django.db import models class Category(models.Model): name = models.CharField(verbose_name="名前",max_length=20) class Topic(models.Model): comment = models.CharField(verbose_name="コメント",max_length=2000) category = models.ForeignKey(Category, on_delete=models.CASCADE) 普通に逆参照を使うと、クエリが再実行されるためDBに負担がかかる categories = Category.objects.all() for category in categories # ここでDB読み込み print( ...PythonからWindows共有サーバー(Samba)にアクセスする
import platform from smb.SMBConnection import SMBConnection # connection open conn = SMBConnection( '', '', platform.uname().node, '192.168.11.100', domain='WORKGROUP', use_ntlm_v2=True) conn.connect('192.168.11.100', 139) # IPアドレス以降のファイルパスを設定 items = conn.listPath('share' , "sdb1") print([item.filename for item in items]) print(conn.echo('echo success')) conn.close() 参照 https://qiita.com/t2kojima/items/250d68c56a8c9fe95f52 ...Reactでaxiosを使ってリクエストをすると、2回送られる問題【React.StrictMode問題】
【Django Rest Framework】モデルメソッドはシリアライザメソッドで代用する
DRFとReactのSPAを作る時、DTLは使えない。 これまでのようにモデルオブジェクトからメソッドを呼び出すことはできない。 そこで、シリアライザにメソッドを用意して代用する。 モデル 前提として、このようにモデルメソッドを作った時。 from django.db import models class Topic(models.Model): comment = models.CharField(verbose_name="コメント",max_length=2000) def comment_lenth(self): return len(self.comment) これでは、React ...DRF+ReactのSPAで簡易掲示板を作る
最近(2018年以降)の開発では関数ベースのコンポーネントが主流のため、一部を書き換えた。 React App.js import React, { useState, useEffect } from "react"; import Modal from "./components/Modal"; import axios from "axios"; const App = () => { const [topicList, setTopicList] = useState([]); const [modal, setModal] = useState(false); const [activeTopic, setActiveTopic] = useState({ comment: "" }); // コンポーネントがレンダリングされるときに実行する useEffect(() => { refreshList(); }, []); // ページロード const refreshList = () => { axios .get("/api/topics/") .then((res) => setTopicList(res.data)) .catch((err) => console.log(err)); }; const handleSubmit = (topic) => { if (topic.id) { axios .put(`/api/topics/${topic.id}/`, topic) .then(() => refreshList()) .catch((err) => console.log(err)); } else { axios .post("/api/topics/", topic) .then(() => refreshList()) .catch((err) => console.log(err)); } closeModal(); }; const handleDelete = (topic) => { axios .delete(`/api/topics/${topic.id}/`) .then(() => refreshList()); }; const openModal = (topic) => { if (topic.id) { setActiveTopic(topic); } else { setActiveTopic({ comment: ...【Django】デフォルトの認証機能を網羅し、カスタムユーザーモデルとメール認証、メール検証(確認)も実装する【脱allauth】
- 作成日時:
- 最終更新日時:
- Categories: サーバーサイド
- Tags: Django カスタムユーザーモデル 認証
【Django】GitHubを使ってHerokuにデプロイをする
settings.pyの内容 一部省略している。 os モジュールを使って、環境変数を読み込みする。 import os DEBUG = False # 中略 # 静的ファイルの読み込み設定がwhitenoiseに影響が及ぶので、デバッグ時にのみ有効にしておく。 if DEBUG: STATICFILES_DIRS = [ BASE_DIR / "static" ] # 中略 if not DEBUG: #INSTALLED_APPSにcloudinaryの追加 INSTALLED_APPS.append('cloudinary') INSTALLED_APPS.append('cloudinary_storage') # ALLOWED_HOSTSにホスト名)を入力 ALLOWED_HOSTS = [ os.environ["HOST"] ] SECRET_KEY = os.environ["SECRETKEY"] # 静的ファイル配信ミドルウェア、whi ...【Django】modelformset_factoryで1回のリクエストでまとめて投稿する【フォームセット】
1回のリクエストで、決まった個数のデータをまとめて投稿したい場合、modelformset_factory が有効。 ただし、状況によってはgetlistを使う方法のほうが有効の場合もあるので、よく考える必要がある。 modelformset_factory とは 例えば、1回のリクエストで5個のコメントをまとめて投稿する必要がある場合。 このようにフォームクラスを元に、フォームセットを作る。 from django import forms from .models import Topic class TopicForm(forms.ModelForm): class Meta: model = Topic fields = [ "comment" ] from django.forms import modelformset_factory TopicFormSet = modelformset_factory(Topic, ...