Data post with image & php

 import React from 'react'

import axios from 'axios';

class FileUploadForm extends React.Component {

    UPLOAD_ENDPOINT = 'http://aagajkiaawaj.com/react_api/product/upload.php';

    constructor(props) {

        super(props);

        this.state ={

          file:null

        }  

        this.onSubmit = this.onSubmit.bind(this)

        this.onChange = this.onChange.bind(this)

        this.uploadFile = this.uploadFile.bind(this)

    }

    async onSubmit(e){

        e.preventDefault() 

        let res = await this.uploadFile(this.state.file);

        console.log(res.data);

    }

    onChange(e) {

        this.setState({file:e.target.files[0]})

    }

    async uploadFile(file){

        

        const formData = new FormData();

        

        formData.append('avatar',file)

        formData.append('name',document.getElementById('name').value)

        

        return  await axios.post(this.UPLOAD_ENDPOINT, formData,{

            headers: {

                'content-type': 'multipart/form-data'

            }

        });

      }

    

      render() {

        return (

          <form onSubmit={ this.onSubmit }>

            <h1> React File Upload Example</h1>

            <input type="text" name="name" id="name" />

            <input type="file" onChange={ this.onChange } />

            <button type="submit">Upload File</button>

          </form>

       )

      }

        

}

export default FileUploadForm;

Php Code :

<?php header('Content-Type: application/json; charset=utf-8'); header("Access-Control-Allow-Origin: *"); header("Access-Control-Allow-Methods: PUT, GET, POST"); /* @session_start(); echo 'aaaaaaa'; if($_REQUEST['name']!=''){ echo $_SESSION['name'] = $_REQUEST['name']; }else{ echo $_SESSION['name']; } */ $response = array(); $upload_dir = 'uploads/'; $server_url = 'http://aagajkiaawaj.com/react_api/product/'; if($_FILES['avatar']) { $avatar_name = $_FILES["avatar"]["name"]; $avatar_tmp_name = $_FILES["avatar"]["tmp_name"]; $error = $_FILES["avatar"]["error"]; if($error > 0){ $response = array( "status" => "error", "error" => true, "message" => "Error uploading the file!" ); }else { $random_name = rand(1000,1000000)."-".$avatar_name; $upload_name = $upload_dir.strtolower($random_name); $upload_name = preg_replace('/\s+/', '-', $upload_name); if(move_uploaded_file($avatar_tmp_name , $upload_name)) { $response = array( "status" => "success", "error" => false, "name" => $_POST['name'], "message" => "File uploaded successfully", "url" => $server_url."/".$upload_name ); }else { $response = array( "status" => "error", "error" => true, "message" => "Error uploading the file!" ); } } }else{ $response = array( "status" => "error", "error" => true, "message" => "No file was sent!" ); } echo json_encode($response); ?>