Laravel + Inertia validating request HTTPS

I've been trying to resolve an error that happens only in production. (Hosted on AWS Lightsail with CloudFront).

Originally I was getting Mixed Content errors and no styes would load.

I forced the HTTPS in both APP_URL & ASSET_URL then added URL::forceScheme('https'); in the AppServiceProvider.

This resolved the above error and the Application loads and runs.... However, when I now submit a POST or PUT request I get no validation at all. The page just does not submit and I get this

app.fda9f487.js:31 Uncaught (in promise) Error: Network Error
    at $y (app.fda9f487.js:31:96854)
    at d.onerror (app.fda9f487.js:32:1837)

Added the following in App\Http\Middleware\TrustProxies

    protected $proxies = "*";

This fixed the above network error but now the validation does not! it just redirects to / when I submit a post without data in the input instead of showing the validation.

Has anyone had anything similar?

Thanks

yousayjump

3 years ago

Level 11

Hey! Sure, here is a stripped down version just using name.

Vue Component

<script setup>
import JetFormSection from '@/Jetstream/FormSection.vue';
import JetLabel from '@/Jetstream/Label.vue';
import JetInput from '@/Jetstream/Input.vue';
import JetInputError from '@/Jetstream/InputError.vue';
import JetButton from '@/Jetstream/Button.vue';
import { useForm } from '@inertiajs/inertia-vue3';

const form = useForm({
  name: '',
});

const createReview = () => {
  form.post(route('review-management.store'));
};
</script>

<template>
  <JetFormSection @submitted="createReview">
    <template #title> Review </template>

    <template #description>
      lorem ipsum
    </template>

    <template #form>

        <JetInput
          type="text"
          v-model="form.name"
        />
        <JetInputError :message="form.errors.name" class="mt-2" />

    <template #actions>
      <JetButton :class="{ 'opacity-25': form.processing }" :disabled="form.processing"
        >Save
</JetButton>
    </template>
  </JetFormSection>
</template>

Route

Route::middleware(['auth:sanctum', config('jetstream.auth_session'), 'verified',])->group(function () {
    Route::prefix('review-management')->name('review-management.')->group(function() {
        Route::get('/', [ReviewsController::class, 'index'])->name('index');
        Route::get('/create',  [ReviewsController::class, 'create'])->name('create');
        Route::get('/{review}', [ReviewsController::class, 'show'])->name('show');
        Route::put('/{review}',  [ReviewsController::class, 'update'])->name('update');
        Route::post('/store',  [ReviewsController::class, 'store'])->name('store');
        Route::delete('/delete/{review}', [ReviewsController::class, 'delete'])->name('delete');
    });
});

Review Controller

public function store(ReviewCreateRequest $request)
    {
        Review::fromRequest($request);

        session()->flash('flash.banner', 'Review has been created!');
        session()->flash('flash.bannerStyle', 'success');

        return Redirect::route('review-management.index');
    }

Create Request

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

    /**
     * @return string[]
     */
    public function rules()
    {
        return [
            'name' => 'required',
        ];
    }

    /**
     * @return string[]
     */
    public function messages()
    {
        return [
            'name.required' => 'Please add a review name',
        ];
    }
}

Review model - fromRequest

   public static function fromRequest(ReviewCreateRequest $request): self
    {
        $review = new Review();
        $review->name = $request->name;
        $review->save();

        return $review;
    }

The actual requests are working, I can create , update and delete fine - It's when the fields are blank and the form is submitted - I get no validation errors

1 like