Laravel Livewire:临时预览url不能在本地机器上工作

Question

我尝试通过Laravel Livewire上传文件使用LivewireWithFileUploads，我试图通过实现livewire官方文档中显示的方法来获得所选图像的预览，要上传，但是尽管做了完全相同的事情，我还是没有看到预览。

我看到的是残片预览

我也试着检查元素并获取url我得到的url是

http://192.168.1.33:8000/livewire/preview-file/tmRlboRMpPEv3MMOiX5iu6vPph0PLC-metacHJvZmlsZXBpYy5qcGc=-.jpg?expires=1654720661&signature=e0d825c78ae9bcbc8123b72a542ba827d984810aa32dee8527e63e0c9babf27a

我试着打开这个URL，看到一个大黑屏，中间有一个灰色的方块

我不确定我在哪里出错了。我正在快速添加控制器，刀片和配置，希望我能得到一些解决方案，因为我也提到了这个解决方案，但它没有帮助

<<p>Livewire控制器/strong>

use LivewireComponent;
use LivewireWithFileUploads;
class CenterRegistration extends Component
{
use WithFileUploads;
public $logo;
public function updated($propertyName)
{
$this->validateOnly($propertyName);
}
public function render()
{
return view('livewire.logo-uploader');
}
public function submit()
{
$this->validate();
}
protected function rules()
{
return [
'logo' => [
'required',
'mimes:png,jpg',
'max:2048',
],
];
}
}

Livewire叶片

<form wire:submit.prevent="submit">
<div class="input-group shadow-sm">
<div class="input-group-prepend input-group-text bg-light rounded-5">
{{ Form::label('logo','Logo',[
'for' => 'logo',
'class' => 'rounded-0 required',
]) }}
</div>
{{ Form::file('logo',[
'id' => 'logo',
'class' => "form-control rounded-5",
'accept' => 'image/*',
'required',
'wire:model' => "logo"
]) }}
</div>
@if ($logo)
<div>
<img src="{{ $logo->temporaryUrl() }}"/>
</div>
@endif
@error('logo') <span class="error text-danger">{{ $message }}</span> @enderror
<button class="btn btn-primary rounded-pill text-center mt-3" style="width: 20%;" type="submit">submit</button>
</form>

<<p>基本信息/strong>

Laravel : 9.17.0 | Xampp

Answer 1

检查存储文件夹权限

composer update
chmod -R 777 storage
chmod -R 777 public/storage
chmod -R 777 bootstrap/cache
php artisan optimize:clear
php artisan optimize