405 (Method Not Allowed) - Laravel and Vue.Js

Question

Good afternoon everyone, I'm trying to implement a notification system with the possibility to mark this notification with a like.

I am using laravel 7 for the back end and vuejs for the front end.

The code works correctly on localhost, but when I deploy to Heroku it stops working and to give me the message below.

http://springalert.herokuapp.com/api/like 405 (Method Not Allowed)

Uncaught (in promise) Error: Request failed with status code 405
at createError (app.js:5347)
at settle (app.js:5608)
at XMLHttpRequest.handleLoad (app.js:4816)

Someone with any tips for the subject, I researched about it and I know that we have to configure CORS but for this version of laravel it supposedly would no longer be necessary.

follow the code, thank you for your help.

ROUTE

Route::post('/api/like/', 'NotificationController@api_like');

CONTROLLER

public function api_like(Request $request) {
  $like = new Like;
  $like->notification_id = $request->id;
  $like->user_id = auth()->id();
  $like->save();
}

VUEJS

<b-card-text class="text-right" v-if="Object.keys(notification.like).length == 0">
   <a @click="makelike('success', 'Informação', notification.id)" class="a"><i class="fas fa thumbs-up"></i></a>
</b-card-text>

      makelike(variant = null, title, notification_id) {
        this.id = notification_id
        axios.post('api/like/',{ id:this.id })
                    .then((response) => {
                      this.set_notifications()
                      this.$bvToast.toast('Obrigado pela tua visualização', {
                        title: title,
                        variant: variant,
                        solid: true
                      })
                    })
      },

Most likely, the URL is getting rewritten to GET method. You might have to check the server configuration. Can you check that once? — Vinayak Sarawagi, Jun 16 '20 at 14:59
/api is normally prefixed in the routes/api.php file, so you don't need /api in the route (if it's in this file) in api.php Route::post('/like/', 'NotificationController@api_like'); will resolve at /api/like — Cameron, Jun 16 '20 at 15:01
If i change to api.php ``` use Illuminate\Http\Request; use Illuminate\Support\Facades\Route; Route::middleware('auth:api')->get('/user', function (Request $request) { return $request->user(); }); Route::post('/like', 'NotificationController@api_like'); ``` then the error change to The GET method is not supported for this route. Supported methods: POST. — Bole, Jun 16 '20 at 15:26
Your api seems to be fine, the problem is that your front end is sending a get request instead of a post request — Itamar Garcia, Jun 16 '20 at 16:09
As @VinayakSarawagi said, check your server config. This has happened to me before. I posted to a http protocol and then https was enforced so the POST method was rewritten to a GET method. — PW_Parsons, Jun 17 '20 at 07:12
after some digging , you can only post to heroku when using ssl/https https://stackoverflow.com/questions/29441591/post-request-being-received-as-get-request-on-heroku — Cameron, Jun 18 '20 at 01:45
I think maybe because of one forward slash assume it to be a get route — Thai Nguyen Hung, Jun 18 '20 at 04:02

score 0 · Answer 1 · answered Jul 18 '22 at 13:57

As user Mihai pointed out, you need to chain your POST request after a get request to csrf.

Here's how it looks like with Laravel Sanctum:

import axios from 'axios'

const baseUrl = 'http://yourdomain.com'
const api = axios.create({
  baseURL: baseUrl,
  withCredentials: true
})
const payload = {}

api().get('/sanctum/csrf-cookie').then(() => {
  return api().post('api/like', payload).then(resp => {
     // Do stuff with resp
  })
})

405 (Method Not Allowed) - Laravel and Vue.Js

1 Answers1

Linked