Upload obrázku jako data:image/png;base64

Mára98
Člen | 47
+
0
-

Dobrý den,

celý den zápasím s nahráváním obrázku přes JQuery. Mám nasledující kód:

$.post(`${window.BASEPATH}/api/register-school`, {
    email: this.futurePort.signUp.form.email,
    password: this.futurePort.signUp.form.password,
    name: this.futurePort.signUp.form.name,
    street: this.futurePort.signUp.form.street,
    city: this.futurePort.signUp.form.city,
    postalCode: this.futurePort.signUp.form.postalCode,
    country: this.futurePort.signUp.form.country,
    website: this.futurePort.signUp.form.website,
    file: this.futurePort.signUp.croppedLogo // <- ZDE JE OBRÁZEK JAKO BASE64 ENCODED STRING
}, res => {
    if (res.result == 'error')
        alert(res.message);
    else
        alert('Registration successfull');
});

na straně serveru pak mám:

    /**
     * Register school
     */
    public function actionRegisterSchool() {
        // Upload profilového obrázku
        // Získá HTTP request
        $request = $this->getHttpRequest();

        $email = $request->getPost('email');
        $password = $request->getPost('password');
        $name = $request->getPost('name');
        $street = $request->getPost('street');
        $city = $request->getPost('city');
        $postalCode = $request->getPost('postalCode');
        $country = $request->getPost('country');
        $website = $request->getPost('website');
        $file = $request->getPost('file');

        // Vytvoří obrázek ze zdroje
        $image = Image::fromString(base64_decode($file), $type);

        // Vytvoří název souboru
        $name = uniqid('FUTUREPORT_IMG_') . $type;

        // Přesune soubor do adresáře pro
        // nahrané (uploadnuté) soubory
        $image->save(dirname(__FILE__) . '/../../www/uploaded/' . $name);

        try {
            $this->schoolManager->register(
                new School(
                    $email,
                    $password,
                    $name,
                    $street,
                    $city,
                    $postalCode,
                    $country,
                    $website,
                    '/uploaded/' . $name
                )
            );
        } catch (\Exception $e) {
            // Vrátí json response
            $this->sendResponse(new JsonResponse(
                ['result' => 'error', 'message' => $e->getMessage()]
            ));
        }

        // Vrátí json response
        $this->sendResponse(new JsonResponse(
            ['result' => 'success']
        ));
    }

Po uploadu ale vždy dostanu chybu „Unknown type of image.“ na této řádce:

$image = Image::fromString(base64_decode($file), $type);

Nevěděl by si prosím někdo rady? Předem moc děkuji za jakoukoliv pomoc.

Mistrfilda
Člen | 76
+
0
-

Ahoj,

a jses si jisty, ze ta base64, popripade obrazek je spravne zakodovany/zpracovany?

Zkus si dumpnout co je v $file = $request->getPost('file'); a zkus pak ten string naprimo dat do $image = Image::fromString(base64_decode('string co vratil dump')); aby si dokazal rict, jestli je obrazek spravne zpracovavan a nebo je chyba v tomto.

Mára98
Člen | 47
+
0
-

Mistrfilda napsal(a):

Ahoj,

a jses si jisty, ze ta base64, popripade obrazek je spravne zakodovany/zpracovany?

Zkus si dumpnout co je v $file = $request->getPost('file'); a zkus pak ten string naprimo dat do $image = Image::fromString(base64_decode('string co vratil dump')); aby si dokazal rict, jestli je obrazek spravne zpracovavan a nebo je chyba v tomto.

Děkuji za radu, zkoušel jsem to tam vložit na přímo ale pořád stejná chyba viz obrázky dole. Hádám tedy, že to asi knihovna croppr (https://jamesooi.design/Croppr.js/) špatně enkóduje?

Každopádně moc děkuji za tvé nápady, zas jsem o kus blíž řešení:)

https://ibb.co/Gxhg1vB
https://ibb.co/H7gFdf8

Martk
Člen | 652
+
+4
-

Dekóduje se jen co je za čárkou, ne celé tzn. vynecháš data:image/png;base64, a zbytek dekóduješ jako base64, bude ti to teda začínat iVBOR

Mára98
Člen | 47
+
0
-

Martk napsal(a):

Dekóduje se jen co je za čárkou, ne celé tzn. vynecháš data:image/png;base64, a zbytek dekóduješ jako base64, bude ti to teda začínat iVBOR

Už to jede!!! Hrozně moc děkuji!!! ❤️