Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

201
Views
axios post method errors react

Im trying to send data using axios post method but keep receiving error 415.

I tried switching to "'Content-Type': application/x-www-form-urlencoded" but still same problem.

Getting data with axios.get works without an error.

What am i doing wrong?

File in which i store API endpoints:

import axios from "axios";

const api = () => {
  const baseUrl = "https://localhost:5001/api";
  let optionAxios = {
    headers: {
      "Content-Type": "text/plain;charset=utf-8",
    },
  };

  return {
    getSubjects: () => axios.get(`${baseUrl}/subjectcontroller/getsubjects`),
    addSubject: (subjectName) =>
      axios.post(
        `${baseUrl}/subjectcontroller/createsubject`,
        {
          name: subjectName,
        },
        optionAxios
      ),
  };
};

export const apiService = api();

Component from which i send data:

import Context from "../../store/context";
import FormContainer from "../UI/FormContainer";
import { apiService } from "../../services/api/api.service";
import { useContext, useRef } from "react";

const AddSubject = () => {
  const ctx = useContext(Context);
  const subject = useRef("");

  const sendData = (e) => {
    e.preventDefault();

    apiService.addSubject(subject.current.value);
  };

  return (
    <FormContainer show={ctx.subjectForm} send={sendData}>
      <label htmlFor="subject">Subject Name: </label>
      <input type="text" id="subject" ref={subject} />
      <button type="submit">Add</button>
    </FormContainer>
  );
};

console logs

about 4 years ago · Santiago Gelvez
1 answers
Answer question

0

If your API expects a JSON body, you have to set the Content-Type headers as "application/json"

  const optionAxios = {
    headers: {
       'Content-Type': 'application/json',
    },
  };
about 4 years ago · Santiago Gelvez Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!