OpenApiGenerator: fixing multiple file upload for JS clients

Remember, I love swagger! And since we have it anyway, it’s kinda dumb to write requests to that API manually.
Why would anyone want to come up with something like axios.get(‘/user/123/payments?fromDate=2018-01-01’) without intellisense, type-checking and compile-time verifications? What if someday you change that API’s route?

OpenApiGenerator is a great solution to this. You could easily get typed-clients for your API in almost any language, and make requests as easy as UserApi.get(123, dateFrom).
But that’s a well-known thing, let’s get to the point of this article :)
OpenApiGenerator plays well with almost anything, but file arrays. File arrays were introduced to OpenApi recently, so not all the tools support them yet.
So, let’s say you have a backend method that accepts an array of files (files will be passed with the same name):

[HttpPost()]
public IActionResult UploadFiles(IFormFile[] files)

OpenApiGenerator will provide you with a proper JS method, but it won’t work and will generate something like:

Content-Type: multipart/form-data; boundary=----WebKitFormBoundaryIk1aWkovTmf7LSJX

------WebKitFormBoundaryIk1aWkovTmf7LSJX
Content-Disposition: form-data; name="files"

[object File],[object File]
------WebKitFormBoundaryIk1aWkovTmf7LSJX--

Of course, that isn’t what we want. However, it’s quite easy to monkey-patch the generated ApiClient to achieve what we want. I know monkey-patching is dirty and you should probably fix this with inheritance&overriding, but I’ll leave this to you :) So, here’s the patch:

//this is to make ApiClient correctly handle array of files
const oldBuildCollectionParam = ApiClient.instance.buildCollectionParam;
ApiClient.instance.buildCollectionParam = function(param, collectionFormat) {
    if (param == null) {
        return null;
    }
    if (param.length > 0) {
        if (param[0] instanceof File) {
            return param;
        }
    }
    return oldBuildCollectionParam.call(this, param, collectionFormat);
};
Опубликовать в Facebook
Опубликовать в Google Plus

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *