CODEWITHSUNDEEP
reactjs
Emiry Mirella
Emiry Mirella

Reputation: 587

how to check if there is really an image in a path?

I am developing a system in react, and in a moment I have to display the user's avatar, if the user does not have a registered image, then I display a standard image.

The problem is that, sometimes the user has a URL for the image already registered in the database, example: path_img: 'http: // localhost: 3000 / file / 1asd-0a9f-asdaf90-asf9a-fa.png' .

however, when accessing this address, no image is found.

How is it possible to know if this link is valid? that is, does it have an existing image to it?

    async componentDidMount() {
        const user = JSON.parse(getUserToken());
        console.log(user);
        if (user.logo_path) {
            user.logo_path = `http://localhost:3333/files/${user.logo_path}`;

            // check if the image in that logo_path really exists
        
        }
        else
            user.logo_path = 'https://cdn.icon-icons.com/icons2/1378/PNG/512/avatardefault_92824.png';

        await this.setState({ user });

        this.handlePermissions();
    }

Upvotes: 0

Views: 132

Answers (2)

jobless-lm10
jobless-lm10

Reputation: 1

You can use onError attribute of img tag call a UDF to change url to the default one.

Upvotes: 0

RoXTar
RoXTar

Reputation: 172

In my world it is possible to load the standardpic if the load from the linked img fails;-)

So you have not to know if link is broken, but you can now clear the broken Link in your DB.

LoadStandardpic if link is broken and clear it in DB.

Upvotes: 1

Related Questions