😺
【FastAPI】Template内でjavascript自作モジュールをインポートしたいとき
外部のjavascriptモジュールを自作のjavascriptでimport
するとテンプレートで読み込むときにtype='module'
が必要になる。
template.html
<script type="module" src="{{ url_for('static', path='/build/basicElementsOfScene.js') }}"></script>
こうやって読み込むときにサーバー側でMIME typeを明示的に指定していないと
Failed to load module script: The server responded with a non-JavaScript MIME type of "text/plain". Strict MIME type checking is enforced for module scripts per HTML spec.
みたいなエラーがブラウザで発生する。
そこで、FastAPIのappを定義しているcontrol内でMIME typeを定義する。
ここで指定するmimetypeはapplication/javascript
でいいみたい。なんでかは分かりませんすみません。分かる方いたらコメントください。。
control.py
from fastapi import FastAPI
from fastapi.staticfiles import StaticFiles
from fastapi.responses import ORJSONResponse
from starlette.templating import Jinja2Templates, _TemplateResponse
from starlette.requests import Request
# ここに追加します
import mimetypes
mimetypes.init()
mimetypes.add_type('application/javascript', '.js')
app = FastAPI(
title='Tutorial App',
description='App for learing FastAPI',
version='0.9 beta',
)
app.mount("/static", StaticFiles(directory="static"), name="static")
templates = Jinja2Templates(directory="templates")
jinja_env = templates.env
def canvas(request: Request):
return templates.TemplateResponse('testCanvas.html', {'request': request})
def index(request: Request):
return templates.TemplateResponse('index.html', {'request': request})
Discussion