Paradox
2 سال پیش توسط Paradox مطرح شد
4 پاسخ

ارسال ویس از طریق چت

سلام وقت بخیر
من برای سیستم چت که با لایووایر و laravel echo و pusher پیاده سازی کردم
میخام ویس هم از طریق چت ارسال کنم
ولی موفق نشدم
کدهامو میزارم لطفا راهنمایی کنید مشکل کارم کجاست و چیکار کنم

ویو کار

        <div id="controls">
                <button wire:click.prevent="startRecording" id="recordButton" class="upload-btn-wrapper border-0">                
                    <i class="fa fa-microphone pe-2 ps-2"></i>
                </button>
                <button wire:click.prevent="stopRecording" id="stopButton" disabled class="upload-btn-wrapper border-0">
                    <i class="fa fa-stop" aria-hidden="true"></i>
                </button>
            </div>

            <div id="recordingsList">
                @foreach($recordings as $recording)
                    <audio controls src="{{$recording}}"></audio>
                @endforeach
            </div>

component

    protected $listeners = ['updateSendMessage' , 'dispatchMessageSent' , 'resetComponent' , 'recordingSaved' => 'handleRecordingSaved'];
    public function startRecording()
    {
        $this->recording = 'recording_' . Str::random(8) . '.webm';
        $this->recordings[] = $this->recording;
        $this->dispatchBrowserEvent('startRecording', [
            'recording' => $this->recording
        ]);
    }

    public function pauseRecording()
    {
        $this->dispatchBrowserEvent('pauseRecording');
    }

    public function stopRecording()
    {
        $this->dispatchBrowserEvent('stopRecording');
        $path = $this->recording;
        $user_id = Auth::user()->id;
        $recording = Message::create([
            'user_id' => $user_id,
            'path' => $path
        ]);
        $this->emit('chat.send-message', $recording->id);
    }

    public function handleRecordingSaved($recordingId)
    {
        $recording = Message::find($recordingId);
        // handle the recording
        // ...
    }

ثبت پرسش جدید
Mohammad
تخصص : 5656565
@Reza.7 2 سال پیش مطرح شد
-1

سلام من این کار رو بلدم ارسال ویس در چت رو و قبلا انجام دادم
فقط نمیتونم به طور رایگان یاد بدم چون پدر خودم در اومده


Paradox
تخصص : در حال یادگیری
@paradox 2 سال پیش مطرح شد
0

@Reza.7
روشی که دارم میرم اشتباهه؟
چقد هزینه بابتش دریافت میکنید؟


محمد شریف احمدی
تخصص : یک عدد برنامه نویس
@mrahmadi 2 سال پیش مطرح شد
0

سلام،

برای ارسال فایل‌های ویس از طریق چت، می‌توانید از ویژگی فایل اپلود لایووایر به نام Wire:file استفاده کنید. با استفاده از این ویژگی، شما می‌توانید فایل ویس را انتخاب کرده و به جای آن که آپلود شود، در سمت کلاینت، با یک رویداد و به روش پیام رسانی سفارشی، به سرور ارسال کنید.

در ویو کار، کد زیر را قرار دهید:

<div id="controls">
    <button wire:click.prevent="startRecording" id="recordButton" class="upload-btn-wrapper border-0">                
        <i class="fa fa-microphone pe-2 ps-2"></i>
   </button>
   <button 
       wire:click.prevent="stopRecording" 
       wire:file="recordingFile" <!-- این ویژگی برای ارسال فایل ویس استفاده می‌شود --> 
       id="stopButton" 
       disabled 
       class="upload-btn-wrapper border-0"
    >
         <i class="fa fa-stop" aria-hidden="true"></i>
    </button>
</div>

داخل کامپوننت خودتان نیز کد زیر را قرار بدهید:

use Livewire\WithFileUploads;

class YourComponent extends Component
{
    use WithFileUploads;

    public $recording;
    public $recordingFile;

    public function startRecording()
    {
        $this->recording = 'recording_' . Str::random(8) . '.webm';
    }

    public function stopRecording()
    {
        $path = $this->recording;
        $user_id = Auth::user()->id;
        $recording = Message::create([
            'user_id' => $user_id,
            'path' => $path
        ]);
        $this->dispatchBrowserEvent('chat.send-message', $recording->id, $this->recordingFile->getFilename()); // اینجا فایل را هم داخل رویداد ارسال می‌کنیم.
    }    
}

در کامپوننت، ابتدا یک متغیر recordingFile را تعریف کنید، که برای نگهداری فایل ویس انتخاب شده توسط کاربر استفاده می‌شود.
سپس در تابع stopRecording، مسیر فایل را به همراه شناسه کاربر (یا شناسه پیام) به سمت سرور ارسال می‌کنیم. به منظور ارسال فایل به صورت همزمان با رویداد، می‌توانید از پکیج laravel-echo-file-upload استفاده کنید.


Paradox
تخصص : در حال یادگیری
@paradox 2 سال پیش مطرح شد
0

@mrahmadi
خیلی ممنونم ازتون
وقتی روی ویس کلیک میکنم متاسفانه هیچ اتفاقی نمیفته
تو کنسول هم خطایی وجود نداره
دلیل خاصی داره این مشکل هست ؟ کدهای قبلی هم به همین شکل بود هیچ اتفاقی نمیفتاد تو صفحه


برای ارسال پاسخ لازم است وارد شده یا ثبت‌نام کنید

ورود یا ثبت‌نام