اذهب إلى المحتوى
  • 0

تحميل ملف من خلال مكون React؟

Adam Ebrahim

السؤال

لدي الرابط التالي:

http://localhost:5000/download-file

عند الدخول إلى الرابط يتم تحميل ملف فيديو، ما أريد فعله هو تحميل الملف من خلال مكتبة Axios في مكون react ولكن بدون إعادة توجيه المستخدم أو فتح صفحة أخرى. أعلم أنه بإمكاني إستخدام العنصر a لتحميل الملف ولكن كما ذكرت أريد أن يتم تحميل الملف من نفس الصفحة.

رابط هذا التعليق
شارك على الشبكات الإجتماعية

Recommended Posts

  • 1

يمكنك إستخدام الشفرة التالية لتحميل الملف بإستخدام axios دون إعادة توجيه أو فتح صفحة جديده

axios({
  url: "https://example.com/file.pdf", // هنا الرابط الخاص بالملف المراد تحميله
  method: "GET",
  responseType: "blob" // لابد من هذا الخيار تأمد من تواجده
}).then((response) => {
  const url = window.URL.createObjectURL(new Blob([response.data]));
  const link = document.createElement("a");
  link.href = url;
  link.setAttribute("download", "file.pdf"); // لاحظ هنا نحدد نوع الملف المحمل
  document.body.appendChild(link);
  link.click();
});

 

رابط هذا التعليق
شارك على الشبكات الإجتماعية

  • 0

إذا كان بإمكانك استخدام العنصر a ولكن تريد أن يتم تحميل الملف من نفس الصفحة 

فيمكنك إضافة صفة (attribute) في العنصر a وهي download فهذه الصفة تخبر المتصفح بالقيام بالتحميل من الرابط ولن يتم إعادة توجيه أو فتح صفحة أخرى بل سيتم تحميل الملف من نفس الصفحة

يمكنك إضافة هذا الكود

<a href="http://localhost:5000/download-file" download>
  تنزيل الفيديو
</a>

 

رابط هذا التعليق
شارك على الشبكات الإجتماعية

انضم إلى النقاش

يمكنك أن تنشر الآن وتسجل لاحقًا. إذا كان لديك حساب، فسجل الدخول الآن لتنشر باسم حسابك.

زائر
أجب على هذا السؤال...

×   لقد أضفت محتوى بخط أو تنسيق مختلف.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   جرى استعادة المحتوى السابق..   امسح المحرر

×   You cannot paste images directly. Upload or insert images from URL.

  • إعلانات

  • تابعنا على



×
×
  • أضف...