'Django Nextjs post method "Unhandled Runtime Error"
I am currently building my first project on Django + Next.js, but I have a problem when I try to create an object from the front. I have a form that allows me to create a "post" when I submit it. Everything works fine in the backend, I can see my new posts in my /admin dashboard. However, on the front end I get an error : Unhandled Runtime Error
My front code where I believe the error comes from :
const CreationForm = () => {
const router = useRouter();
const [creator, setCreator] = useState('Anonymous Creator');
const [slug, setSlug] = useState('');
const [title, setTitle] = useState('');
const [photo_main, setPhoto_main] = useState(null);
const [description, setDescription] = useState('');
const onSlugChange = e => setSlug(e.target.value);
const onTitleChange = e => setTitle(e.target.value);
const onFileChange = e => setPhoto_main(e.target.files[0]);
const onDescriptionChange = e => setDescription(e.target.value);
const [loading, setLoading] = useState(false);
const handleSubmit = async e => {
e.preventDefault();
setLoading(true);
const config = {
headers: {
'Accept': 'application/json',
'Content-Type': 'multipart/form-data',
}
};
const formData = new FormData();
formData.append('title', title);
formData.append('slug', slug);
formData.append('creator', 'Anonymous Creator');
formData.append('description', description);
formData.append('photo_main', photo_main);
const body = formData;
try {
const res = await axios.post('http://localhost:8000/api/posts/create', body, config);
if (res.status === 201) {
setLoading(false);
router.push('/dashboard');
}
} catch(err) {
setLoading(false)
}
};
return (
<Layout>
.
.
.
</Layout>
);
}
export default CreationForm;
I tried quite hard to find the answer on my own but I am lost now.
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|

