Back
source.on is not a function
hi, i want to upload a image to a appwrite bucket, also i am using sveltekit. For some reason i get the error source.on is not a function, can someone tell me what i did wrong here because i feel like it is something dumb. how it works: user on the client uploads a image via form, form data gets sent to the backend, the image is processed on a backend and image should be sent to the bucket via backend
my code: frontend: +page.svelte
TypeScript
<script lang="ts">
import Input from '$lib/components/Input.svelte';
import Button from '$lib/components/Button.svelte';
import { enhance } from '$app/forms';
</script>
<div class="post-wrapper">
<h1>post joke</h1>
<form action="?/post" method="POST" enctype="multipart/form-data" use:enhance>
<Input name="title" type="text" placeholder="title" />
<Input type="file" accept="image/*" name="image" />
<Button>post joke</Button>
</form>
</div>
backend: +page.server.ts
TypeScript
import { ID, Databases, Client, Storage } from 'appwrite';
import { Buffer } from 'buffer';
import { InputFile } from 'node-appwrite/file';
export const actions = {
post: async ({ request }) => {
const data = await request.formData();
const image = data.get('image');
const arrayBuffer = await image.arrayBuffer();
const buffer = Buffer.from(arrayBuffer);
const client = new Client()
.setEndpoint('https://cloud.appwrite.io/v1') // API Endpoint
.setProject('xxx'); // project ID
const storage = new Storage(client);
const result = await storage.createFile(
'xxx', // bucketId
ID.unique(),
InputFile.fromBuffer(buffer, 'sssss')
);
console.log(result);
}
};
i read the docs it says that i should use the InputFile when the image is processed on a backend, i made the bucket any with everything checked
thanks in advance.
TL;DR
Developers are encountering an error "source.on is not a function" when trying to upload an image to an Appwrite bucket using SvelteKit. The issue lies in the backend code where the user is attempting to process the image.
The problem is likely caused by the incorrect usage of the `InputFile.fromBuffer` function. It should be used after creating the buffer from the image data.
Solution: Move the `InputFile.fromBuffer` call after the buffer creation and ensure the correct implementation of sending the file to the bucket.