Laravel上传图片触发POST方法不被路由支持错误怎么解决

可能原因1：路由缓存未更新 #

Laravel会缓存路由配置，新增/修改路由后如果没有清理缓存，新路由规则不会生效。
解决方法：
执行命令清理路由缓存：
php artisan route:clear
生产环境部署建议清理后重新生成缓存：
php artisan route:cache

可能原因2：路由地址硬编码错误 #

如果你的/upload-images路由被包裹在带前缀的路由组中，或者写错了路由文件，实际请求地址和你JS里硬编码的地址不一致就会报错。
比如路由写在带checkout前缀的路由组里，实际访问地址是/checkout/upload-images，你写的/upload-images自然匹配不到。
解决方法（推荐）：
使用路由名生成地址，避免硬编码错误：

1. 先在Blade模板中把路由地址传给JS：

<script>
const uploadImageUrl = "{{ route('images.store') }}";
</script>

2. 把AJAX请求的url参数改为动态地址：

$.ajax({
    type:'POST',
    url: uploadImageUrl,
    // 其余配置不变
})

可能原因3：路由顺序冲突 #

如果你的路由列表中，/upload-images路由上方存在通配符GET路由，或者同名的GET路由，会优先匹配靠前的路由，导致POST路由无法触发。
示例错误路由写法：

// 靠前的通配符路由会匹配所有GET请求
Route::get('/{any}', 'PageController@index')->where('any', '.*');
// 靠后的POST路由永远不会被触发
Route::post('/upload-images', 'CheckoutController@storeImage' )->name('images.store');

解决方法：
把具体的业务路由放到通配符路由的上方。

可能原因4：JS未正常阻止表单默认提交 #

如果JS代码执行报错，e.preventDefault()没有生效，表单会以默认无action的方式提交，默认是GET请求当前页面，就会触发该错误。
解决方法：
给form标签加action属性做双保险：

<form method="post" action="{{ route('images.store') }}" id="upload-image-form" enctype="multipart/form-data">

就算JS没有阻止默认提交，也会正常发POST请求到对应路由。

可能原因5：路由文件配置错误 #

如果你把该POST路由写在了routes/api.php中，Laravel会自动给路由加/api前缀，实际访问地址是/api/upload-images，请求/upload-images自然匹配不到。
需要用到session、csrf验证的前端业务路由，必须写在routes/web.php中。

验证路由配置 #

你可以执行以下命令查看所有生效的路由列表，确认路由规则正确：
php artisan route:list
找到images.store对应的路由条目，确认Method列包含POST，URI列和你实际请求的地址一致。

内容的提问来源于stack exchange，提问作者ALAA ELDIN