File Upload in SAP Commerce OCC

[roberto_barretorres]

Hello,

We have a couple of important requirements which the user from the frontend application, Spartacus 3.1, should upload files to our backend system, SAP Commerce Cloud 2011, after trying and doing investigations we couldn't make it work.
We are trying to implement an endpoint in the OCC API which should accept MultipartFile parameter and then receive the files but we always get the same response "Required request part 'file' is not present". We are also testing it from Postman and same result.

Does anyone know how to handle this problem?

Thanks in advance!
Roberto

[former_member757157]

Hi Roberto,

I was sending file from Spartacus to SAP Commerce platform.
That is what I needed to do:
1) angular
- html:

<input
  type="file"
  name="file"
  id="selectedFile"
  (change)="onFileChanged($event)"
/>

- component ts

onFileChanged(event) {
  this.selectedFile = (event.target as HTMLInputElement).files[0];
}

// send file to backend
sendFile() {
    let selectedFile: File = this.selectedFile;
    let formData: FormData = new FormData();
    formData.append('selectedFile', selectedFile, selectedFile.name);
    this._myOccService
      .sendFile(formData)
      .subscribe();
  }
}

- my occ service

sendFile(file: FormData): Observable<any> {
  const url = `${this._occEndpoints.getBaseEndpoint()}/files/send`;
  return this._http.post<any>(url, file);
}

2) backend
- add config for multipart files in <your-occ-extension-name>-web-spring.xml

<bean id="contentNegotiationManager" class="org.springframework.web.accept.ContentNegotiationManagerFactoryBean">
   <property name="favorPathExtension" value="false" />
</bean>

<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
   <property name="maxUploadSize" value="209715200" />
   <property name="maxInMemorySize" value="10485760" />
</bean>

- rest controller

@RestController
@RequestMapping(value = "/{baseSiteId}")
public class MyController {

  @PostMapping(path = "/files/send", consumes = "multipart/form-data")
  public void sendFile(@RequestPart("selectedFile") MultipartFile selectedFile) {
                                        // logic...
  }
}

I think this is all I had to do. Please notice this is just a draft. After that I was able to send file to platform backend. Hope it will work for you too.

Best regards,
Milosz

[roberto_barretorres]

Hi Milosz,

Thanks for the proposed solution!
It works fine now.

Thanks and Regards,

Roberto