Laravel Image Validation

Question

I am writing a vue component where users can upload a profile picture that I want to validate on the backend using Laravel's built-in image validation. I use an axios post call with a JSON object that has the following key value pair.

When I go the backend I send it through a custom Laravel request and put the following validation rule on it.

<?php

namespace App\Http\Requests;

use App\Department;
use Illuminate\Validation\Rule;
use Illuminate\Foundation\Http\FormRequest;

class ChangePersonalInfo extends FormRequest
{
    /**
     * Determine if the user is authorized to make this request.
     *
     * @return bool
     */
    public function authorize()
    {
        if(auth()->user()) return true;
        else return false;
    }

    /**
     * Convert certain request parameters before validation
     *
     * @return void
     */
    protected function prepareForValidation()
    {
      $this->merge([
        'assigned_states' => explode(',', $this->assigned_states),
        'customer_price_level' => json_encode($this->customer_price_level),
        'customer_price_list' => json_encode($this->customer_price_list),
        'customer_type' => json_encode($this->customer_type),
        'email_notifications' => filter_var($this->email_notifications, FILTER_VALIDATE_BOOLEAN),
        'employee' => filter_var($this->employee, FILTER_VALIDATE_BOOLEAN),
        'read_notification_terms' => filter_var($this->read_notification_terms, FILTER_VALIDATE_BOOLEAN),
        'reviewed' => filter_var($this->reviewed, FILTER_VALIDATE_BOOLEAN),
        'text_notifications' => filter_var($this->text_notifications, FILTER_VALIDATE_BOOLEAN),
        'verified' => filter_var($this->verified, FILTER_VALIDATE_BOOLEAN),
        'termsCode' => json_encode($this->termsCode)
      ]);
    }

    /**
     * Get the validation rules that apply to the request.
     * 
     * @return array
     */
    public function rules()
    {
      $departments = Department::select(['department_name'])->pluck('department_name')->toArray();

      return [
          'api_token' => 'string|alpha_num',
          'assigned_states' => 'array|nullable',
          'assigned_states_description' => 'string|nullable',
          'avatar_file' => 'string|nullable',
          'bc_details' => 'string|json|nullable',
          'bc_guid' => 'string|nullable',
          'company_address_id' => 'numeric|integer|nullable',
          'company_name' => 'string|nullable',
          'company_website' => 'string|nullable',
          'created_at' => 'string|nullable',
          'customer_price_level' => 'json',
          'customer_price_list' => 'json',
          'customer_type' => 'json',
          'customer_price_level.id' => 'numeric|integer',
          'customer_price_list.id' => 'numeric|integer',
          'customer_type.id' => 'numeric|integer',
          'department' => ['string', 'nullable', Rule::in($departments)],
          'email' => 'required|email',
          'email_notifications' => 'boolean',
          'employee' => 'boolean',
          'first_name' => 'string|nullable|max:30',
          'id' => 'string|integer|alpha_num',
          'imageExtension' => 'string|nullable',
          'imageFile' => 'sometimes|nullable|image|max:2048',
          'last_name' => 'string|nullable|max:30',
          'marketing_preferences' => 'string|nullable',
          'notes' => 'string|nullable',
          'price_level_id' => 'required|numeric|integer',
          'price_list_id' => 'numeric|integer|nullable',
          'primary_address_id' => 'numeric|integer|nullable',
          'pimary_billing_address' => 'numeric|integer|nullable',
          'primary_phone_number_id' => 'numeric|integer|nullable',
          'read_notification_terms' => 'boolean',
          'reviewed' => 'boolean',
          'statusName' => 'string',
          'status_id' => 'numeric|integer|nullable',
          'termsCode' => 'json',
          'termsCode.id' => 'numeric|integer',
          'terms_code_id' => 'numeric|integer|required',
          'text_notifications' => 'boolean',
          'timezone' => 'timezone',
          'title' => 'string|nullable',
          'type_id' => 'required|numeric|integer',
          'updated_at' => 'string|nullable',
          'username' => 'string|nullable',
          'verificationStatus' => 'string',
          'verification_token' => 'string|nullable',
          'verified' => 'boolean'
      ];
  }
}

I'm getting a 500 error back with this message.

{"message":"The given data was invalid.","errors":{"imageFile":["The image file must be an image."]}}

Could anyone help me know why it appears to be an image file on the frontend but fails to meet the backend validation?

See this question solve your problem or not: stackoverflow.com/questions/61817409/… — Hedayatullah Sarwary
– Hedayatullah Sarwary, Commented Dec 21, 2021 at 5:43

Masoud · Accepted Answer · 2021-12-21 06:03:05Z

-2

check this format

  'imageFile' => 'required|file|max:512|mimes:jpg,png,jpeg'

answered Dec 21, 2021 at 6:03

Masoud

1,2551 gold badge12 silver badges23 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Istiake · Accepted Answer · 2021-12-21 06:09:57Z

-2

You can Try This

'image' => 'required|file|image|max:2048'

answered Dec 21, 2021 at 6:09

Istiake

511 silver badge7 bronze badges

Comments

Matthew Lindow · Accepted Answer · 2021-12-21 19:29:16Z

-2

I used the FormData in order to get this work. It was fairly simple after that with a basic axios post request. I will add the finalized code I used. This JavaScript code was able to send an image properly to the backend which was validated in Laravel as an image.

let formData = new FormData();
Object.keys(this.form).forEach(key => {
 formData.append(key, this.form[key]);
});
formData.append('imageFile', this.imageFile);

axios({
  method: 'POST',
  url: this.routes.save,
  data: formData
})

answered Dec 21, 2021 at 19:29

Matthew Lindow

239 bronze badges

Collectives™ on Stack Overflow

Laravel Image Validation

3 Answers 3

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related