Harikrishnan K.N.
Harikrishnan K.N.

Reputation: 4930

How to upload a file and JSON data in Postman?

I am using Spring MVC and this is my method:

/**
* Upload single file using Spring Controller.
*/
@RequestMapping(value = "/uploadFile", method = RequestMethod.POST)
public @ResponseBody ResponseEntity<GenericResponseVO<? extends IServiceVO>> uploadFileHandler(
            @RequestParam("name") String name,
            @RequestParam("file") MultipartFile file,
            HttpServletRequest request,
            HttpServletResponse response) {

    if (!file.isEmpty()) {
        try {
            byte[] bytes = file.getBytes();

            // Creating the directory to store file
            String rootPath = System.getProperty("catalina.home");
            File dir = new File(rootPath + File.separator + "tmpFiles");
            if (!dir.exists()) {
                dir.mkdirs();
            }

            // Create the file on server
            File serverFile = new File(dir.getAbsolutePath() + File.separator + name);
            BufferedOutputStream stream = new BufferedOutputStream(new FileOutputStream(serverFile));
            stream.write(bytes);
            stream.close();

            System.out.println("Server File Location=" + serverFile.getAbsolutePath());

            return null;
        } catch (Exception e) {
            return null;
        }
    }
}


I need to pass the session id in postman and also the file. How can I do that?

Upvotes: 461

Views: 1086276

Answers (25)

Meta
Meta

Reputation: 58

If you think you've set up everything correctly and it still doesn't work

try to close and reopen Postman

Upvotes: 0

jarvo69
jarvo69

Reputation: 8339

In Postman:

  • Set HTTP method type to POST.
  • Then select Body -> form-data -> Enter your parameter name (file according to your code)
  • On the right side of the Key field, while hovering your mouse over it, there is a dropdown menu to select between Text/File. Select File, then a "Select Files" button will appear in the Value field.

For rest of "text" based parameters, you can post it like normally you do with Postman. Just enter parameter name and select "text" from that right side dropdown menu and enter any value for it, hit send button. Your controller method should get called.

Upvotes: 845

Anand_5050
Anand_5050

Reputation: 1159

Use the below code in your Spring REST controller:

@PostMapping(value = Constant.API_INITIAL + "/uploadFile")
public UploadFileResponse uploadFile(@RequestParam("file") MultipartFile file, String jsonFileVo) {
    FileUploadVo fileUploadVo = null;
    try {
        fileUploadVo = new ObjectMapper().readValue(jsonFileVo, FileUploadVo.class);
    } catch (Exception e) {
        e.printStackTrace();
    }
}

enter image description here

Upvotes: 7

Darren Quadros
Darren Quadros

Reputation: 111

You can send both Image and optional/mandatory parameters.

In postman, there is Params tab.

Upvotes: 9

jitendra singh
jitendra singh

Reputation: 41

The steps of uploading a file through postman along with passing some input data is very well discussed in below blog along with the screenshot. In this blog, the api code is written in node js. You can go through it once to have more clarity.

https://jksnu.blogspot.com/2021/09/how-to-create-post-request-with.html

Upvotes: 0

burakozgul
burakozgul

Reputation: 797

Like this :

enter image description here

Body -> form-data -> select file

You must write "file" instead of "name"

Also you can send JSON data from Body -> raw field. (Just paste JSON string)

enter image description here

Upvotes: 35

Rizka Khoirotunnisa
Rizka Khoirotunnisa

Reputation: 21

first, set post in method and fill link API

Then select Body -> form-data -> Enter your parameter name (file according to your code)

Upvotes: 2

code-8
code-8

Reputation: 58602

Body > binary > Select File

enter image description here

Upvotes: 15

Farid Chowdhury
Farid Chowdhury

Reputation: 3170

enter image description here

I got confused after seeing all of the answers, I couldn't find any proper screenshot to bring the Content Type column. After some time, I found it by my own. Hope this will help somebody like me.

Here is the steps:

  1. click on red marked area of postman.
  2. Now check the green marked option (Content Type).
  3. Now change the search content type, in the yellow marked area.

In my case:

  1. invoice_id_ls (key) contains the json data.
  2. documents contains the file data.
  3. placed_amount contains normal text string.

Upvotes: 54

Ankur prajapati
Ankur prajapati

Reputation: 517

Kindly follow steps from top to bottom as shown in below image.

postman image

At third step you will find dropdown of type selection as shown in below image

postman dropdown

Upvotes: 15

Ahsan Farooq
Ahsan Farooq

Reputation: 957

The way to send mulitpart data which containts a file with the json data is the following, we need to set the content-type of the respective json key fields to 'application/json' in the postman body tab like the following: enter image description here

Upvotes: 5

kishan maharana
kishan maharana

Reputation: 557

To send image along with json data in postman you just have to follow the below steps .

  • Make your method to post in postman
  • go to the body section and click on form-data
  • provide your field name select file from the dropdown list as shown below
  • you can also provide your other fields .
  • now just write your image storing code in your controller as shown below .

postman : enter image description here

my controller :

public function sendImage(Request $request)
{
    $image=new ImgUpload;  
    if($request->hasfile('image'))  
    {  
        $file=$request->file('image');  
        $extension=$file->getClientOriginalExtension();  
        $filename=time().'.'.$extension;  
        $file->move('public/upload/userimg/',$filename);  
        $image->image=$filename;  
    }  
    else  
    {  
        return $request;  
        $image->image='';  
    }  
    $image->save();
    return response()->json(['response'=>['code'=>'200','message'=>'image uploaded successfull']]);
}

That's it hope it will help you

Upvotes: -2

Tom McDonough
Tom McDonough

Reputation: 1262

If you want the Id and File in one object you can add your request object to a method as standard and then within Postman set the Body to form-data and prefix your keys with your request object name. e.g. request.SessionId and request.File.

Upvotes: 0

Anshu Kumar
Anshu Kumar

Reputation: 11

At Back-end part

Rest service in Controller will have mixed @RequestPart and MultipartFile to serve such Multipart + JSON request.

@RequestMapping(value = "/executesampleservice", method = RequestMethod.POST,
consumes = {"multipart/form-data"})

@ResponseBody
public boolean yourEndpointMethod(
    @RequestPart("properties") @Valid ConnectionProperties properties,
    @RequestPart("file") @Valid @NotNull @NotBlank MultipartFile file) {
return projectService.executeSampleService(properties, file);
}

At front-end :

formData = new FormData();

formData.append("file", document.forms[formName].file.files[0]);
formData.append('properties', new Blob([JSON.stringify({
            "name": "root",
            "password": "root"                    
        })], {
            type: "application/json"
        }));

See in the image (POSTMAN request):

Click to view Postman request in form data for both file and json

Upvotes: -2

Hritcu Andrei
Hritcu Andrei

Reputation: 172

For each form data key you can set Content-Type, there is a postman button on the right to add the Content-Type column, and you don't have to parse a json from a string inside your Controller.

Upvotes: 2

Chris F Carroll
Chris F Carroll

Reputation: 12360

The Missing Visual Guide

You must first find the nearly-invisible pale-grey-on-white dropdown for File which is the magic key that unlocks the Choose Files button.

After you choose POST, then choose Body->form-data, then find the File dropdown, and then choose 'File', only then will the 'Choose Files' button magically appear:

Postman POST file setup - (Text,File) dropdown highlighted

Upvotes: 389

otamega
otamega

Reputation: 239

Postman multipart form-data content-type

Select [Content Type] from [SHOW COLUMNS] then set content-type of "application/json" to the parameter of json text.

Upvotes: 20

vinci mojamdar
vinci mojamdar

Reputation: 634

I needed to pass both: a file and an integer. I did it this way:

  1. needed to pass a file to upload: did it as per Sumit's answer.

    Request type : POST

    Body -> form-data

    under the heading KEY, entered the name of the variable ('file' in my backend code).

    in the backend:

    file = request.files['file']

    Next to 'file', there's a drop-down box which allows you to choose between 'File' or 'Text'. Chose 'File' and under the heading VALUE, 'Select files' appeared. Clicked on this which opened a window to select the file.

2. needed to pass an integer:

went to:

Params

entered variable name (e.g.: id) under KEY and its value (e.g.: 1) under VALUE

in the backend:

id = request.args.get('id')

Worked!

Upvotes: 4

Sebastian Ardila
Sebastian Ardila

Reputation: 324

If somebody wants to send json data in form-data format just need to declare the variables like this

Postman:

As you see, the description parameter will be in basic json format, result of that:

{ description: { spanish: 'hola', english: 'hello' } }

Upvotes: 20

Ajay k
Ajay k

Reputation: 151

If you need like Upload file in multipart using form data and send json data(Dto object) in same POST Request

Get yor JSON object as String in Controller and make it Deserialize by adding this line

ContactDto contactDto  = new ObjectMapper().readValue(yourJSONString, ContactDto.class);

Upvotes: 14

kubilay
kubilay

Reputation: 5330

If you want to make a PUT request, just do everything as a POST request but add _method => PUT to your form-data parameters.

Upvotes: 6

Marcos Dantas
Marcos Dantas

Reputation: 866

If somebody needed:

body -> form-data

Add field name as array

enter image description here

Upvotes: 9

Rohit Thakur
Rohit Thakur

Reputation: 264

  1. Don't give any headers.
  2. Put your json data inside a .json file.
  3. Select your both files one is your .txt file and other is .json file for your request param keys.

Upvotes: 19

gce
gce

Reputation: 1653

Maybe you could do it this way:

postman_file_upload_with_json

Upvotes: 91

Sandesh Jain
Sandesh Jain

Reputation: 742

If you are using cookies to keep session, you can use interceptor to share cookies from browser to postman.

Also to upload a file you can use form-data tab under body tab on postman, In which you can provide data in key-value format and for each key you can select the type of value text/file. when you select file type option appeared to upload the file.

Upvotes: -1

Related Questions