Image upload rest api

How I can upload the image using the rest api and what is the response of that, please mention rest api for that

Hello @pkdadhaniya

I think this is what you’re looking for

POST /ws/files/upload HTTP/1.1

Host: localhost:8080
Connection: keep-alive
Content-Length: 124164
Pragma: no-cache
Cache-Control: no-cache
X-File-Offset: 0
X-Requested-With: XMLHttpRequest
X-File-Type: image/png
X-File-Name: SequenceEmployee.png

Is there any working solution to upload an image ? ( documented example…?)

I can upload one but file is damaged after trying to download it.

Hello, you always can upload data by using a many-to-one field with metaFile object as a target. In the view add the binary-link widget.

Do you have more details about this procedure ? I’m using the POST /ws/files/upload API route not the interface.

Currently, a file is well uploaded because I got the return message like :

{
    "processInstanceId": null,
    "fileName": "file.jpeg",
    "importOrigin": null,
    "updatedBy": null,
    "filePath": "file.jpeg",
    "description": null,
    "updatedOn": null,
    "createdOn": "2022-11-02T14:36:21.920Z",
    "version": 0,
    "importId": null,
    "createdBy": {
        "code": "admin",
        "fullName": "Admin",
        "id": 1,
        "$version": 5
    },
    "fileSize": 78171,
    "sizeText": "78.17 KB",
    "id": 239,
    "fileType": "image/jpeg",
    "selected": false
}

But when accessing the id 239 MetaFile, it is corrupted… I can not find more information about format or any clue to debug

Any clue @Pierre-Axelor of an image upload working example via API ?

Can post post your code or how you try to upload a file ?

Off course here is my config on POST route on https://myaxelor/ws/files/upload

And the base64 image example : https://jpst.it/30wqI

I don’t undertand how you found that you id 239 is corrupted.
I uploaded a file like you:

{
    "fileName": "toto.png",
    "updatedBy": null,
    "externalCode": null,
    "filePath": "toto.png",
    "description": null,
    "externalId": 0,
    "updatedOn": null,
    "createdOn": "2022-11-18T09:45:45.857Z",
    "version": 0,
    "sequence": 0,
    "createdBy": {
        "code": "admin",
        "name": "Administrator",
        "id": 1,
        "$version": 3
    },
    "fileSize": 132551,
    "sizeText": "132,55 KB",
    "toSend": true,
    "id": 4002,
    "UUID": "4b2fa8ade78a4eb0972eebd4a72a8f32",
    "fileType": "image/jpeg",
    "selected": false
}

And I updated a product to give the picture id 4002 and I can visualize it.

1 J'aime

Could you give the file image + the body content of your example ?

How did you download the image after upload to visualize it ?

On my side I trick with an url to download the uploaded file : https://myaxelorurl.com/ws/rest/com.axelor.meta.db.MetaFile/CREATED_FILE_ID/content/download

My image is a random picture from hy hard drive.
And this is my body :
image

I didn’t try to download my picture. I just displayed it :

image

<field name="picture" showTitle="false" colSpan="8" colOffset="2" widget="Image" canEdit="true">
          <viewer><![CDATA[

                			<div>
                  				<img ng-show="record.picture" ng-src="{{$image('picture', 'content')}}" />
                			</div>

                	]]></viewer>
        </field>

Alright, I tried with postman with binary and not raw and I can get half of an image. How do you compute the content-length ?

Because, I tested with Windows, I just displayed picture’s properties but you just need to calculate this when you do the call from your program.