Securly passing authorization token from template to static javascript in Django
I am adding a custom admin page to the Django admin site where the logged in user can open a text file, it is then parsed, and the parsed data is added as a new record in a table using the user's assigned token. Is the below method secure? Is there a better strategy?
I've added a custom template:
{% extends "admin/change_form.html" %}
{% load static %}
{% block extrahead %}
{{ block.super }}
<script type="application/javascript" src="{% static 'js/add_cal_file.js' %}"></script>
{% endblock extrahead %}
{% block content %}
<h1>Add cal file</h1>
<div class="mb-3">
<input class="form-control" type="file" id="formFile" accept=".cal" token="{{ request.user.auth_token }}">
</div>
{% endblock %}
When the user selects a file the following parser in static 'js/add_cal_file.js
is called:
const parseCal = async (fileContents, token) => {
// parses fileContents to postRequest here
const response = await fetch("/api/add-calibration", {
method: 'POST',
headers: {"Content-Type": "application/json",
"Authorization": "Token "+token
},
body: JSON.stringify(postRequest)
})
}
The view at /api/add-calibration is protected using @permission_classes([IsAuthenticated])
limiting it to only requests that provide an authorization token