Getting error: Forbidden (CSRF token missing or incorrect.)
HTML page:
<b>All Posts</br></b>
</br>
{% if user.is_authenticated %}
<div class="newPost">
<div>New Post</div>
<!--. Add new post form begins -->
<form action="{% url 'index' %}" method="post" name="AddPost" id="postform">
{% csrf_token %}
<div >
<textarea class="txtarea" name="txtarea" id="txtarea" placeholder="Body"></textarea>
</div>
<div>
<input type="submit" value = "Post" id="SubmitPost">
</div>
</form>
<!--. Add new post form ends -->
</div>
<div>
<b>{{user}}</b>
</div class="Container" name="Container" id="Container">
<div>
</div>
{% block script %}
<script src="{% static 'network/jsindex.js' %}" defer>
</script>
{% endblock %}
{% endif %}
{% endblock %}
JS file:
document.addEventListener('submit',function(event){
event.preventDefault();
x = document.querySelector('textarea').value
fetch('/posts', {
method: 'POST',
body: JSON.stringify({
pcontent: x,
})
})
.then(response => response.json())
.then(result => {
// Print result
console.log(result);
});
})