5
respostas

API para upload de fotos retorna erro

Estou no terceiro curso de Angular e implementei o upload de fotos conforme a aula. No entanto, ao testar obtenho um erro no console e as seguinte mensagens da API no terminal:

Valid token received: eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6MSwibmFtZSI6ImZsYXZpbyIsImVtYWlsIjoiZmxhdmlvQGFsdXJhcGljLmNvbS5iciIsImlhdCI6MTU1ODM1MzgyNiwiZXhwIjoxNTU4NDQwMjI2fQ.jrbZpzL0clTHYQ03caVOKEdwvcqHF7d4u-S9UYMlRyo
####################################
Received JSON data {}
{ [Error: SQLITE_CONSTRAINT: NOT NULL constraint failed: photo.photo_url] errno: 19, code: 'SQLITE_CONSTRAINT' }
undefined

Acredito que seja alguma validação da API, alguém poderia me informar como corrigir?

5 respostas

Fala aí Mônica, tudo bem? Parece que o erro está porque você está tentando subir um foto ou salvá-la sem informar o campo photo_url:

Error: SQLITE_CONSTRAINT: NOT NULL constraint failed: photo.photo_url

Repare que no banco de dados foi definido uma constraint para validar campos que não podem ser nulos: SQLITE_CONSTRAINT: NOT NULL constraint.

E essa constraint é referente á: photo.photo_url.

Espero ter ajudado.

Boa noite, Mônica! Como vai?

De acordo com essa linha do log

Received JSON data {}

Aparentemente vc deve estar cometendo algum erro na forma como está enviando os dados para a API!

Vc poderia colar aqui o código referente a essa parte de envio da foto para a API?

Olá Matheus,

Creio que não seja isso pois assim como na aula não há um campo photo.photo_url e o código baixado na aula funciona normalmente.

Olá Gabriel, segue meu código:

import { HttpClient, HttpParams } from '@angular/common/http';
import { Injectable } from '@angular/core';

import { Photo } from './photo';

const API = 'http://localhost:3000/';

@Injectable({ providedIn: 'root' })
export class PhotoService {
    constructor(private http: HttpClient){}

    listFromUser(username: string){
        return this.http
            .get<Photo[]>(API + username + '/photos')
    }

    listFromUserPaginated(username: string, page: number){
        const params = new HttpParams().append('page', page.toString());
        return this.http
            .get<Photo[]>(API + username + '/photos', { params })
    }

    upload(description: string, allowComments: boolean, file: File){
        const formData = new FormData();
        formData.append('description', description);
        formData.append('allowComments', allowComments ? 'true' : 'false');
        formData.append('imageFile', file);

        return this.http.post(API + 'photos/uploads', formData);
    }
}

Opa, Mônica! É, parece que nessa parte do código está tudo ok!

Faz o seguinte: vc poderia colocar o seu projeto no github e compartilhar a URL aqui com a gente? Assim poderemos dar uma olhada mais a fundo no que está acontecendo para tentar te ajudar de forma mais efetiva!

Fala aí Mônica, tudo bem? Acho que o problema está no endpoint que você está chamando, repare que está no plural o uploads:

return this.http.post(API + 'photos/uploads', formData);

Onde deveria ser no singular:

return this.http.post(API + 'photos/upload', formData);

Acredito que deva resolver.

Espero ter ajudado e bons estudos.