ایجاد یک لینک دانلود کار خیلی راحتی است ; اضافه کردن یک تگ لینک (a) و قرار دادن آدرس فایل در خصیصه href آن . بعضی از فایل ها(از قبیل تصاویر, .pdf, .txt, و .doc)  اما دانلود نمی شوند به جای آن در مرورگر باز می شوند .

اگر به سمت سرور دسترسی دارید راه حل هایی برای این مشکل وجود دارد مثل استفاده از .htaccess برای دانلود مستقیم این نوع فایل ها . ولی اگر سایت شما با استفاده از سرویس های رایگانی مثل بلاگفا , میهن بلاگ , ورد‍پرس دات کام و … ایجاد شده است شما اجازه استفاده از چنین راه حل هایی را نخواهید داست ولی نگران نباشید می توانید از خصیصه جالب download استفاده کنید .

استفاده از خصیصه “Download”

خصیصه Download یکی از خصوصیات HTML 5 است و با استفاده از آن می توانیم لینک های معمولی را که به صورت پیش فرض در مرورگر باز می شوند به صورت لینک دانلود در آوردیم .

این خصیصه همچنین به شما اجازه می دهد نام فایل دانلود را به محض شروع دانلود تغییر دهید .وقتی فایل روی سرور آپلود می شود مخصوصا اگر نام آن به صورت خودکار تولید می گردد , ممکن است کمی نا مفهوم و دارای خط تیره و شماره های زیادی باشد . برای مثال acme-doc-2.0.1.txt . بهتر است کاربر فایل را با نام قابل فهم تری دانلود کند مثلا مثل این : Acme Documentation (ver. 2.0.1).txt (پسوند فایل یادتون نره)

کدی که می توانیم استفاده کنیم به این صورت است :

<a href="download/acme-doc-2.0.1.txt" download="Acme Documentation (ver. 2.0.1).txt">Download Text</a>

می توانید نتیجه استفاده از این خصوصیت را در این لینک مشاهده کنید . می بینید که وقتی روی لینک دانلود کلیک می کنید نام فایل دانلود شده مقداری است که به خصیصه Download داده ایم .

چند نکته در مورد استفاده از خصیصه دانلود

• FireFox به دلیل محدودیت های امنیتی خود فقط اجازا می دهد فایل هایی که روی سرور خودتان قرار دارند دانلود شوند والا به جای دانلود فایل را در یک پنجره مرورگر باز می کند .
• با اینکه دانلود از چند منشا در Chrome و نسخه آخر Opera پشتیبانی می شود ولی نام فایل تغییری نمی کند . در واقع این خصیصه کار نمی کند .

راه گریز

در زمان نگاشتن این مقاله هنوز مرورگرهای Safari و Internet Explorer (پای ثابت کمبودها و مشکلات) از این خصیصه پشتیبانی نمی کنند . ولی می توانیم برای مرورگرهایی از این قبیل یک راه دوم برای دانلود فایل قرار دهیم تا کارکرد اصلی سایت مان دچار مشکل نشود .برای همین نیاز داریم کتابخانه جاوا اسکریپت Modernizr را که قابلیت خصیصه Download آن فعال شده باشد در سایت قرار دهیم .

سپس این تکه کد جاوا اسکریپت را بعد از آن در صفحه اضافه می کنیم :

if ( ! Modernizr.adownload ) {
    var $link = $('a');
 
    $link.each(function() {
        var $download = $(this).attr('download');
     
        if (typeof $download !== typeof undefined && $download !== false) {
      var $el = $('<div>').addClass('download-instruction').text('Right-click and select "Download Linked File"');
      $el.insertAfter($(this));
        }
 
    });
}

حالا این اسکریپت مرورگر کاربر را چک می کند تا ببینید از خصیصه Download پشتیبانی می کند یا نه . اگر نکرد یک پیام مناسب زیر لینک دانلود نشان داده می شود که دارای Class هم هست . با این کلاس می توان به آن شکل و شمایل دلخواه و متناسب با سایت را داد .

همانطور که دیدید خصیصه Download در html5 یک امکان خیلی جالب برای کاربرانی است که به امکانات سمت سرور دسترسی ندارند . امیدوارم در آینده همه مرورگرها از این خصیصه کاربردی حمایت و پشتیبانی کاملی بکنند

منبع