تولید فایل با جاوا اسکریپت

تولید فایل با جاوا اسکریپت

وقتی نرم افزار های تحت وب تولید می کنید شما اغلب مواقع باید به کاربرانتان توانایی دانلود بخشی از داده ها را به عنوان فایل بدهید که آن فیل ممکن است شامل تنظیمات،گزارشگیری ویا هر نوع دیگری از اطلاعات که باید به صورت پویا تولید شوند،باشد.

برای مشاهده لینک وارد شود

راه حل معمول این است که یک اسکریپت اختصاصی اطلاعات مورد نیاز را از پایگاه داده استخراج کرده و در اختیار شما قرار دهد. به هر حال ما یک پلاگین جی کوئری میسازیم وآن را بایک اسکریپت ساده PHPترکیب می کنیم تا بتوانیم هر نوع فایل متنی را استخراج کرده و ان را بای دانلود کردن در اختیار ما قرار دهد.

ما کار را با ایجاد یک صفحه ساده HTML و یک textarea و یک دکمه برای دانلود کار را شروع می کنیم.

index.html

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />

        <title>Generating files with JS &amp; PHP | Tutorialzine Demo</title>

        <!-- Our CSS stylesheet file -->
        <link rel="stylesheet" href="assets/css/styles.css" />

        <!--[if lt IE 9]>
          <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
        <![endif]-->
    </head>

    <body>

        <header>
            <h1>Generating Files with JavaScript</h1>
        </header>

        <form action="./" method="post">
            <textarea></textarea>
            <a href="#" class="blueButton" id="download">Download</a>
        </form>

        <footer>Another cool example: <a href="#" id="downloadPage">download this page.<
		/a> <b>To download the source code, visit <a href="http://8np.ir/footer>

        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js"></script>
        <script src="assets/js/jquery.generateFile.js"></script>
        <script src="assets/js/script.js"></script>

    </body>
</html>

قبل از بستن تگbody ما کتابخانه jQuery را وارد می کنیم.پلاگین generateFile در لحظه نوشتن تولید شده وفایل  script.js  به  رویداد ها گوش داده و فایل ها را دانلود می کند.

کد PHP

همانطور که احتمالا شما هم میدانید تولید فایل تنها با javascript  ممکن نیست اما با استفاده از یک اسکریپت عمومی PHP هم استفاده کردن و هم کنترل کردن تولید فایل آسان می شود.

شما می توانید اسکریپت های عمومی را در زیر ببینید.

download.php​

if(empty($_POST['filename']) || empty($_POST['content'])){
    exit;
}

// Sanitizing the filename:
$filename = preg_replace('/[^a-z0-9\-\_\.]/i','',$_POST['filename']);

// Outputting headers:
header("Cache-Control: ");
header("Content-type: text/plain");
header('Content-Disposition: attachment; filename="'.$filename.'"');

echo $_POST['content'];

همانطور که شما در بخش قبلی دیدید پلاگین یک درخواست ارسال موضوع به download.phpفرستاد.انتخاب طبیعی برای ساخت یک درخواست استفاده از AJAXاست.

پس ما باید یک IFrameمخفی به صورت پویا ایجاد کنیم و فرم را به آن ارسال کنیم.

assets/jquery.generateFile.js

(function($){

    // Creating a jQuery plugin:

    $.generateFile = function(options){

        options = options || {};

        if(!options.script || !options.filename || !options.content){
            throw new Error("Please enter all the required config options!");
        }

        // Creating a 1 by 1 px invisible iframe:

        var iframe = $('<iframe>',{
            width:1,
            height:1,
            frameborder:0,
            css:{
                display:'none'
            }
        }).appendTo('body');

        var formHTML = '<form action="" method="post">'+
            '<input type="hidden" name="filename" />'+
            '<input type="hidden" name="content" />'+
            '</form>';

        // Giving IE a chance to build the DOM in
        // the iframe with a short timeout:

        setTimeout(function(){

            // The body element of the iframe document:

            var body = (iframe.prop('contentDocument') !== undefined) ?
                            iframe.prop('contentDocument').body :
                            iframe.prop('document').body;	// IE

            body = $(body);

            // Adding the form to the body:
            body.html(formHTML);

            var form = body.find('form');

            form.attr('action',options.script);
            form.find('input[name=filename]').val(options.filename);
            form.find('input[name=content]').val(options.content);

            // Submitting the form to download.php. This will
            // cause the file download dialog box to appear.

            form.submit();
        },۵۰);
    };

})(jQuery);

تابع setTimeout()   :بدن این تابع ما نمی توانیم به المنت های iFrame در اینترنت اکسپلور دست بیابیم.

و اکنون نحوه استفاده از این پلاگین:

assets/script.js

$(document).ready(function(){

    $('#download').click(function(e){

        $.generateFile({
            filename	: 'export.txt',
            content		: $('textarea').val(),
            script		: 'download.php'
        });

        e.preventDefault();
    });

    $('#downloadPage').click(function(e){

        $.generateFile({
            filename	: 'page.html',
            content		: $('html').html(),
            script		: 'download.php'
        });

        e.preventDefault();
    });

});

در هنگام فراخوانی. generateFile$ شما نیاز به تایید نام فایل،محتوای متن آن، و مسیر ان به download.php. همانطور که در مثال بالا را مشاهده کنید، می توانید هر نوع فایل را تولید کرد وان را تا هر زمانی نگه داشت.

+1
0


هرگونه انتشار مطالب اختصاصي و محصولات اين سايت بجز با درج لينک مستقيم شرعا حرام بوده و پيگرد قانوني دارد.
طبق ماده 12 فصل سوم قانون جرائم رايانه هرگونه کپي برداري ممنوع بوده و پيگرد قانوني دارد. براي اطلاعات بيشتر کليک کنيد.

درباره‌ی مدیر سایت

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

دیدگاه خود را بنویسید

آدرس پست الکترونیک شما منتشر نخواهد شد.خانه های ضروری نشانه گذاری شده اند. *

*


دو × = 16