jdalrymple / gitbeaker

PackageRegistry.publish not properly uploading files from html file input

Node.js version: Chrome Browser M124 (electron v30.0.1)
Gitbeaker version: 40.0.3
Gitbeaker release (cli, rest, core, requester-utils): rest
OS & version: Linux Mint 21.2 Cinnamon

When publishing a generic package the multipart header is not removed so the integrity of the file is compromised.
Its working as expected when using directly the gitlab API with fetch, but when im doing the same with gitbeaker the file still has the headers for multipart stuff in it.

Maybe its just me doing it wrong but I haven't seen any example in the documentation about publishing a package.

Here's the code i used to get the issue

    const handleSubmit = async (e) => {
        e.preventDefault();
        const api = data.api;
        const project = data.project;

        // Validate inputs
        if (files === null || packageName === "" || tagName === "") {
            return;
        }

        // Upload the files one by one
        for (let file of files){
            try{
                const result = await api.PackageRegistry.publish(
                    project.id,
                    packageName,
                    tagName,
                    {
                        filename: file.name,
                        content: file
                    },
                    {
                        contentType: "multipart/form-data",
                        select: "package_file",
                        status: "default"
                    }
                )
                console.log(result);
            } catch (e) {
                console.error(e);
            }

        }
    }

Here's the headers im talking about

Working example with fetch

    const handleSubmit = async (e) => {
        e.preventDefault();
        const api = data.api;
        const project = data.project;
        const token = await window.git.getToken();
        const url = await window.git.getGitURL();

        // Validate inputs
        if (files === null || packageName === "" || tagName === "") {
            return;
        }

        // Upload the files one by one
        for (let file of files){
            try{
                const response = await fetch(new URL(`/api/v4/projects/${project.id}/packages/generic/${packageName}/${tagName}/${file.name}?status=default&select=package_file`, url),{
                    method: "PUT",
                    headers: {
                        "Content-Type": "multipart/form-data",
                        "Authorization": `Bearer ${token}`
                    },
                    body: file
                });

                console.log(`Uploaded new package: ${await response.json()}`);
            } catch (e) {
                console.error(e);
            }

        }
    }

Result with fetch

Steps to reproduce
Try to upload a binary file from an html file input

Expected behaviour
The data should be the same as the original file

Actual behaviour
The headers are not removed so the file is no longer the same as the original

Possible fixes
The contentType in the options does not seems to be doing anything no matter what I put the result is the same, it looks like it defaults to application/octet-steam

Checklist

I have checked that this is not a duplicate issue.
I have read the documentation.

Ill give it a look and follow up!

I'm having this same issue. I'm assuming the issue has something to do with the isForm: true, line in PackageRegistry.ts.

gitbeaker/packages/core/src/resources/PackageRegistry.ts

Line 66 in d64af2a

isForm: true,

It's not supposed to be using FormData, it's supposed to be sending the file as the raw POST (PUT) body.
The appendFormFromObject is creating a FormData object, which is incorrect for publishing to the package repo.

gitbeaker/packages/core/src/infrastructure/RequestHelper.ts

Lines 350 to 352 in d64af2a

    
           const body = isForm 
        
             ? appendFormFromObject(options as Record<string, OptionValueType>) 
        
             : options;

Hmm yes, i used FormData since many of the other API's that transfer file data tend to leverage this method. In this case you mention "raw" but what is the actual data type? Blob?

I said "raw", because you'd set the Content-Type of the request to the MIME of the file you are uploading, then you'd send the binary file as the post body directly.

Using fetch, I did it like:

const upload = `${api.host}/api/v4/projects/${api.projectId}`
    +`/packages/generic/${api.name}/${version}/${name}.jar?status=default&select=package_file`;

const response = await fetch(upload, {
    method: 'PUT',
    headers: {
        'Content-Type': 'application/java-archive',
        'Authorization': `Bearer ${api.token}`,
    },
    body: new Blob(fileData, {type: 'application/java-archive'})
});

So,yeah, it would be a Blob that you are sending as the body. This seems to just be for the PackageRegistry.publish route. I learned this the hard way when working with the GitLab api in a different project.

Noted, Ill make those changes to support that^

Havent forgotten about this! Just trying not to add to the tech debt pile so its taking a bit longer than id like haha

	const body = isForm
	? appendFormFromObject(options as Record<string, OptionValueType>)
	: options;