Method PUT is not allowed by Access-Control-Allow-Methods in preflight response.

Saya belajar dari tutorial Konsumsi API dengan jQuery pada bagian 'Update' memiliki kendala.. *gambar errornya

Berikut kode yg saya pakai *kode htmlnya

<h1>Edit Tutorial</h1>
Id tutorial/<input type="number" id="id_tutorial" placeholder="id" style="width:30px"> <br />
<input type="text" name="edit-title" placeholder="title" id="edit-title"> <br />
<textarea name="edit-body" placeholder="body" id="edit-body"></textarea> <br />
<input type="submit" name="submit" value="Edit" id="edit">

*ajaxnya

$(document).on('click', '#edit', function(){
	_id = $('#id_tutorial').val();
		$.ajax({
		type : "PUT",
		url : base_url + "tutorial/" + _id,
		contentType : "application/json",
		data : JSON.stringify({
			title : $('#edit-title').val(),
			body : $('#edit-body').val(),
		}),
		headers : {
			"Authorization" : "Bearer " + $.cookie('token')
		}
	})
	.done(function(response){
		alert('data berhasil diubah!');
		$('#edit-title').val('');
		$('#edit-body').val('');
		console.log(response);
	});
});

*dan ini setting pada middleware CORSnya

<?php

namespace App\Http\Middleware;

use Closure;

class Cors
{
    /**
     * Handle an incoming request.
     *
     * @param  \Illuminate\Http\Request  $request
     * @param  \Closure  $next
     * @return mixed
     */
    public function handle($request, Closure $next)
    {
        return $next($request)
            ->header('Access-Control-Allow-Origin', '*')
            ->header('Access-Control-Allow-Method', 'GET, POST, PUT, DELETE, OPTIONS')
            ->header('Access-Control-Allow-Headers', 'Content-Type, Authorization, X-Requested-With');
    }
}

Setelah saya coba menggunakan method POST dam GET berhasil, namun saat menggunakan method PUT muncul error seperti di atas, tapi kalau menggunakan POSTMAN sudah berjalan lancar semua metodenya.. *ini gambar respon Headers nya setelah di inspect element

Tolong bantuannya, terimakasih :D

avatar katanyajati
@katanyajati

2 Kontribusi 0 Poin

Diperbarui 7 tahun yang lalu

1 Jawaban:

Jawaban Terpilih

Sudah SOLVED gan, kurang teliti :D

Seharusnya Access-Control-Allow-Methods, bukan Access-Control-Allow-Method hehhee

public function handle($request, Closure $next)
{
    return $next($request)
        ->header('Access-Control-Allow-Origin', '*')
        ->header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS')
        ->header('Access-Control-Allow-Headers', 'Content-Type, Authorization, X-Requested-With');
}

avatar katanyajati
@katanyajati

2 Kontribusi 0 Poin

Dipost 7 tahun yang lalu

Login untuk ikut Jawaban