آگهی
article

نمایش زنده آمار و اطلاعات با ای جکس (Ajax)

ajax-live-file

یکی از قابلیت های منحصر به فرد برنامه نویسی ای جکس (Ajax) در صفحات وب امکان نمایش زنده آمار و اطلاعات مبتنی بر ارسال درخواست و دریافت پاسخ در لحظه است، نمونه هایی از این قابلیت را در کدها و برنامه های تحت وب دیده ایم، به طور مثال در برخی از سیستم های آمارگیر سایت قسمتی تحت عنوان نمایش زنده وجود دارد که در لحظه اطلاعات صفحات بازدید شده توسط کاربران را نمایش داده و در فواصل زمانی کوتاه آخرین نتایج را به روزرسانی می کند، جالب است اگر بدانیم این نمایش زنده آمار در صفحات وب صرفا با ای جکس یا فریم ورک (Framework) های مبتنی بر آن قابل دست یافتن است، متاسفانه در وب و مخصوصا در وب فارسی تا لحظه نگارش این آموزش به این موضوع خیلی توجه نشده است، به همین دلیل در این مطلب می خواهیم روش پایه انجام این کار را در حد امکان آموزش دهیم، با درک ساختار ارائه شده در این مبحث راه برای نوشتن و توسعه برنامه های پیچیده تر هموار می شود.

چگونه با ای جکس (Ajax) آمار و اطلاعات را به طور زنده نمایش دهیم؟


شاید اولین سوالی که به ذهن می رسد این باشد که چگونه با ای جکس (Ajax) آمار و اطلاعات را به طور زنده نمایش دهیم؟
پاسخ این است که ای جکس از این قابلیت ذاتی برخوردار است که می توان به کمک آن در پس زمینه و بدون بارگذاری مجدد صفحه، از سمت کاربر به سرور درخواست ارسال و در مقابل پاسخ درخواست را دریافت و در مرورگر نتیجه را پردازش یا نمایش داد.
همان طور که می دانیم ای جکس مبتنی بر برنامه نویسی جاوا اسکریپت (JavasScript) است و لذا شروع توابع آن با فراخوانی یک رویداد آغاز می شود، این رویداد می تواند به فرض کلیک کاربر بر روی دکمه (onclick) یا بارگذاری (onload) صفحه و یا هر رویداد استاندارد و تعریف شده دیگری در جاوا اسکریپت باشد، به طور مثال ممکن است به محض بارگذاری صفحه و اجرای رویداد onload شروع به ارسال و دریافت زنده اطلاعات با ای جکس کنیم، پس از اینکه موتور ای جکسی ما به حرکت می افتد درخواست به سرور ارسال و پاسخ متناظر دریافت می شود و می توانیم به نحو مقتضی از آن استفاده کنیم، برای ایجاد روند متناوب، این فرآیند را معمولا با توابعی مانند setTimeout و setInterval تکرار کرده و نتیجه جدید را نمایش می دهیم و مجددا تا زمانی که مورد نیاز است این چرخه به همین صورت ادامه می یابد و سبب می شود که بتوانیم اطلاعات جدید ذخیره شده در دیتابیس، فایل های PHP و یا حتی فایل های متنی را به طور زنده و مداوم دریافت کنیم و نتایج را در لحظه نمایش دهیم.

تابع ارسال و دریافت زنده آمار و اطلاعات با ای جکس (Ajax)


قبل از هر چیز به تابع ای جکس (Ajax) احتیاج داریم که بتواند درخواست های ما از طریق مرورگر را ارسال و پاسخ های سرور را دریافت کند، بدین منظور و همانطور که در بخش آموزش مقدماتی ای جکس گفته ایم، از آبجکت XMLHttpRequest و متدهای Post یا Get استفاده می کنیم، در نمونه تابع زیر این کار را انجام داده ایم:
<script>
var xmlHttp = null;
var response = '';
var template = '';
var count = 0;
var d = new Date();

function getAjaxLive(){
    var rand_string = d.getFullYear() + '' + d.getMonth() + '' + d.getDate() + '' + d.getHours() + '' + d.getMinutes() + '' + d.getSeconds() + '' + count++;
    var elm_result = document.getElementById('show-result');

    if(window.XMLHttpRequest){
        //IE7+, Firefox, Chrome, Opera, Safari
        xmlHttp = new XMLHttpRequest();
    } else{
        //IE6, IE5
        xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
    }

    xmlHttp.open('GET', 'result.php?new=' + rand_string, true);
    xmlHttp.send(null);

    xmlHttp.onreadystatechange = function(){
        if(xmlHttp.readyState == 4){
            response = xmlHttp.responseText;

            if(response != ''){
                template = '<div class="result-row">' + response + ' - ' + rand_string + '</div>';
                elm_result.innerHTML = template;
            }

            if(xmlHttp.status == 200){
                setTimeout('getAjaxLive();', 5000);
            } else{
                alert('Something Is Not True! Please Refresh The Page.');
            }
        }
    }
}
<script>
توضیح:
- تابع بالا با نام getAjaxLive وظیفه ارسال و دریافت اطلاعات را به سرور (در اینجا فایل result.php) بر عهده دارد.
- در ابتدای کدها و خارج از تابع متغیرهایی به صورت Global Scope یا دسترسی سراسری با مقادیر اولیه مقداردهی شده اند.
- متغیر d به صورت یک آبجکت از نوع Date تعریف شده است و به این ترتیب می توانیم از متدهای مربوط به تاریخ و زمان در تابع استفاده کنیم.
- تابع setTimeout برای ایجاد وقفه در درخواست های ای جکس به کار می رود و مقدار آرگیومنت دوم آن بر حسب میلی ثانیه است (5000 میلی ثانیه معادل 5 ثانیه)، به این صورت می توانیم در گام های مشخص به صورت متناوب مجددا تابع را فراخوانی و آخرین اطلاعات را از سرور دریافت کنیم.
- مقادیر 5 ثانیه صرفا برای تست کد مناسب است، در برنامه های کاربردی جهت جلوگیری از افزایش تعداد درخواست ها به سرور بهتر است مدت زمانی بیش از 15 ثانیه در نظر گرفته شود.
- در اینجا از آبجکت XMLHttpRequest برای فراهم کردن ساز و کار ارسال درخواست ای جکس به صورت ساده و با شرط if و else استفاده شده است (در بخش آموزش های مقدماتی ای جکس دیدیم که روش try و catch نیز در این مورد کاربرد دارد).
- متغیر rand_string برای جلوگیری از ذخیره نتایج درخواست ها در حافظه موقت مرورگر یا به اصطلاح Cache نشدن آنها است، به صورت ساده با محاسبه تاریخ و زمان در این متغیر عددی غیرتکراری ایجاد می شود و در هر بار ارسال درخواست با متد Get، پارامتر new مقادیر جدیدی همراه درخواست ای جکس می فرستد که این کار موجب تازه سازی آدرس URL در مرورگر و جلوگیری از ذخیره یا به اصطلاح کش شدن اطلاعات می شود.
- متدهای xmlHttp.open و xmlHttp.send درخواست را به همراه پارامتر متغیر new در بستر ای جکس به فایل result.php ارسال می کنند و نتیجه را با متد xmlHttp.responseText دریافت می کنیم.
- با توجه به منسوخ (Deprecated) شدن استفاده از مقدار false برای آرگیومنت سوم متد xmlHttp.open در مرورگرهای جدید، از مقادیر true و متدهای xmlHttp.onreadystatechange و xmlHttp.readyState در این کد استفاده شده است، در غیر اینصورت احتمالا هشدار زیر در Console مرورگر نمایش داده خواهد شد:
synchronous requests on the main thread have been deprecated due to their negative impact on the user experience.
- در قسمت دستور شرطی if بررسی می شود که اگر مقادیر برگردانده شده از xmlhttp.responseText خالی نباشد، قسمت ایجاد خروجی نهایی تابع اجرا شود.
- در قسمت ایجاد خروجی ابتدا در متغیر response پاسخ سرور از متد xmlHttp.responseText دریافت و در صورتی که مقدار خالی نباشد خروجی نهایی در متغیر template آماده سازی و با متد innerHTML در صفحه وب (بلاک show-result) نمایش داده می شود.

فراخوانی تابع و نمایش اطلاعات در بلاک div


پس از اینکه تابع خود را مبتنی بر متدهای ای جکس نوشتیم، باید نتیجه درخواست را درون بلاک div با آی دی مشخص (که در کد بالا با نام فرضی show-result تنظیم شده است) نمایش دهیم، اما قبل از هر چیز باید ابتدا موتور ای جکسی خود را استارت زده باشیم! گفتیم که توابع در جاوا اسکریپت معمولا با یک رویداد فراخوانی می شوند و در اینجا نیز می توانیم از رویداد onload در تگ body استفاده کنیم (رویداد onload با بارگذاری کامل صفحه اجرا می شود):
<body onload="getAjaxLive();">
یا با متد window.onload تابع را پس از بارگذاری کامل صفحه فراخوانی کنیم:
window.onload = function(){
    getAjaxLive();
}
و همچنین در کدنویسی HTML صفحه یک بلاک div با آی دی showr-result می سازیم.
<div id="show-result"></div>
و نمونه استایل زیر را در صفحه (یا به صورت فایل مجزا) درج می کنیم:
<style>
body {
    font-family: Tahoma, Geneva, sans-serif;
    font-size: 12px;
    direction: rtl;
    line-height: 22px;
}
.result-row {
    margin: 4px;
    padding: 4px;
    color: #FFFFFF;
    border: 1px solid #2e6ab1;
    background: #8EA9EE;
    direction: ltr;
}
</style>
اکنون کد ما تقریبا برای استفاده اولیه آماده است اما بسته به هدف خود می توانیم از قابلیت های بیشتری استفاده کنیم که در ادامه به آنها اشاره خواهیم کرد.

دریافت زنده آمار و اطلاعات از فایل متنی با ای جکس و PHP


اکنون که با نحوه ارسال درخواست و دریافت آمار و اطلاعات به صورت زنده از طریق ای جکس آشنا شدیم، می خواهیم ببینیم که چگونه می توانیم فایل متنی با فرمت txt را به این روش مدیریت کنیم، به طور مثال به صورت متناوب بررسی کنیم که آیا اطلاعات این فایل به روز شده است یا خیر؟
ساختار مد نظر ما از منطق ساده ای پیروی می کند و می تواند مبنای سیستم های زنده تحت وب باشد، بدین منظور لازم است که در برنامه نویسی سمت سرور و کدهای PHP تمهیداتی اندیشه کنیم، به اینصورت که باید یک فایل متنی TXT و دو فایل PHP داشته باشیم، فایل TXT را با نام file.txt و فایل های PHP را می توانیم به صورت result.php و update.php نامگذاری کنیم، فایل result.php با هر درخواست از سمت کاربر فایل متنی را بررسی می کند، اگر این فایل حاوی اطلاعات بود نتیجه استخراج، به مرورگر ارسال و در نهایت فایل متنی برای نوشتن مجدد خالی می شود، اما اگر فایل متنی حاوی اطلاعات نبود یعنی هنوز به روزرسانی صورت نگرفه است و لذا پاسخ خالی به مرورگر ارسال می شود، فایل update.php نیز بر اساس نیاز و ساختار برنامه اطلاعات جدید را در انتهای فایل متنی می نویسد بدون اینکه اطلاعات موجود حذف شوند، این فایل در حالت تست برنامه به صورت دستی فراخوانی یا رفرش می شود اما در پروژه های کاربردی معمولا توسط کاربران یا به فرض بازدیدکنندگان سایت اجرا خواهد شد، در ادامه آموزش جهت راهنمایی بیشتر مراحل انجام کار را مورد به مورد بررسی می کنیم.

فایل متنی file.txt، نگهداری و استخراج اطلاعات


همان طور که گفتیم برای نگهداری و استخراج اطلاعات جدید می توانیم از یک فایل متنی استفاده کنیم، این فایل را با نام file.txt در دایرکتوری برنامه ایجاد می کنیم، دقت کنیم که محتوای فایل متنی باید خالی باشد و با فراخوانی توسط فایل update.php به روزرسانی شود.

فایل result.php، بررسی فایل متنی و ارسال پاسخ به مرورگر


تابع ای جکس درخواست ها را به فایل result.php در سرور ارسال می کند، این فایل دو وظیفه را برعهده دارد، ابتدا باید محتوای فایل متنی را بررسی کند، اگر محتوا خالی نبود یعنی اطلاعات جدید توسط فایل update.php اضافه شده است و مقادیر موجود به عنوان پاسخ به مرورگر ارسال می شود، اما اگر محتوایی در فایل متنی وجود نداشته باشد یعنی هنوز به روزرسانی صورت نگرفته و پاسخ خالی به مرورگر ارسال می شود، وظیفه دوم این تابع خالی کردن فایل متنی و آماده سازی جهت به روزرسانی بعدی است، بر این اساس کدهای زیر را در فایل result.php درج می کنیم:
<?php
$file = 'file.txt';
$fp = fopen($file, 'rb+');

if(($fp) !== false) {
    if(flock($fp, LOCK_EX) === true) {
        $size = filesize($file);

        if($size > 0) {
            $data = fread($fp, $size);
            echo $data;
            ftruncate($fp, 0);
        } else {
            echo '';
        }

        flock($fp, LOCK_UN);
    } else {
        echo 'Locking Error!';
    }

    fclose($fp);
}
?>
نکته: برای جلوگیری از ایجاد تداخل احتمالی در هنگام نوشتن فایل متنی از تابع flock استفاده کرده ایم، با این تابع ساز و کاری فراهم می شود تا درخواست های هم زمان برای نوشتن یک فایل به ترتیب صورت گیرد.

فایل update.php، به روزرسانی فایل متنی با اطلاعات جدید

بسته به نیاز و هدف برنامه کدنویسی فایل update.php می تواند متفاوت باشد، جهت نمونه کدهای زیر را در این فایل درج می کنیم:
<?php
$file = 'file.txt';
$fp = fopen($file, 'ab');

if(($fp) !== false) {
    if(flock($fp, LOCK_EX) === true) {
        $data = 'Ajax Response!';

        if(fwrite($fp, $data)) {
            echo 'Write Ok!';
        } else {
            echo 'Write Error!';
        }

        flock($fp, LOCK_UN);
    } else {
        echo 'Locking Error!';
    }

    fclose($fp);
}
?>
با هر بار فراخوانی فایل update.php اطلاعات جدید در انتهای فایل متنی نوشته می شود، در هنگام تست برنامه این فایل باید به صورت دستی و مکررا فراخوانی شود اما در حالت کاربردی می تواند توسط کاربران یا بازدیدکنندگان سایت فراخوانی شود.

تابع پیشرفته نمایش زنده آمار و اطلاعات با ای جکس (Ajax)


تابع ای جکسی که در این آموزش بررسی کردیم به عنوان کد پایه و به صورت ساده صرفا اطلاعات را در یک بلاک نمایش می دهد و از جلوه های گرافیکی یا نمایش در بلاک های مختلف پشتیبانی نمی کند، با توسعه این کد می توانیم قابلیت های دیگری با توجه به نیاز و هدف برنامه در نظر بگیریم، به طور مثال قابلیت نمایش اطلاعات جدید با افکت Fade In و همچنین نمایش نتیجه هر درخواست در یک بلاک div جدید در صفحه وب بدون اینکه بلاک های موجود حذف شوند یا افزایش ردیف ها باعث کندی روند پیمایش در صفحه مرورگر شود، بر این اساس کد جاوا اسکریپت آموزش را به صورت زیر تغییر می دهیم:
<script>
var xmlHttp = null;
var response = '';
var template = '';
var count = 0;
var d = new Date();

function getAjaxLive(){
    var rand_string = d.getFullYear() + '' + d.getMonth() + '' + d.getDate() + '' + d.getHours() + '' + d.getMinutes() + '' + d.getSeconds() + '' + count++;
    var container;
    var div;
    var elm_result;

    if(window.XMLHttpRequest){
        //IE7+, Firefox, Chrome, Opera, Safari
        xmlHttp = new XMLHttpRequest();
    } else{
        //IE6, IE5
        xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
    }

    xmlHttp.open('GET', 'result.php?new=' + rand_string, true);
    xmlHttp.send(null);

    xmlHttp.onreadystatechange = function(){
        if(xmlHttp.readyState == 4){
            response = xmlHttp.responseText;

            if(response != ''){
                container = document.getElementById("show-result");

                div = document.createElement("div");
                div.id = 'show-result-' + count;
                //container.appendChild(div);
                container.insertBefore(div, container.firstChild);

                elm_result = document.getElementById('show-result-' + count);

                template = '<div class="result-row">' + response + ' - ' + rand_string + '</div>';
                elm_result.innerHTML = template;
            }

            if(xmlHttp.status == 200){
                setTimeout('getAjaxLive();', 5000);
            } else{
                alert('Something Is Not True! Please Refresh The Page.');
            }
        }
    }
}
</script>
تغییرات این کد نسبت به حالت ساده آن شامل اضافه شدن قسمت مربوط به متدهای createElement و insertBefore است، با این متدها با دریافت هر پاسخ از سرور یک بلاک div با آی دی یکتا در HTML DOM ساخته و ردیف جدید در این حالت به سورس صفحه وب اضافه می شود.
نکته 1: برای افزودن ردیف های جدید در صفحه وب دو متد appendChild و insertBefore کاربرد دارند، تفاوت این دو متد در محل ایجاد بلاک جدید در انتها یا ابتدای عنصر هدف و در نتیجه چینش بلاک های صفحه به صورت نزولی یا صعودی است.
نکته 2: بعضا شاهد هستیم که کاربران در هنگام استفاده از متد innerHTML از کندی پیمایش صفحه مرورگر گلایه دارند و در نهایت مجبور به رفرش صفحه می شوند، دلیل بروز این حالت افزایش حجم زیاد اطلاعاتی است که با متد innerHTML بازنویسی می شود، با راه حل ارائه شده در کد بالا مشکل کندی نیز بر طرف خواهد شد.

استایل CSS پیشرفته و نمایش نتایج با افکت Fade In


برای نمایش اطلاعات جدید با جلوه ظاهری بهتر می توانیم از ایده های مختلفی استفاده کنیم، به طور مثال یکی از ساده ترین و در عین حال کاربردی ترین این جلوه ها نمایش بلاک نتایج با حالت افکت Fade In است که بدین منظور از خاصیت animation در CSS استفاده می کنیم:
body {
    font-family: Tahoma, Geneva, sans-serif;
    font-size: 12px;
    direction: rtl;
    line-height: 22px;
}
.result-row {
    margin: 4px;
    padding: 4px;
    color: #FFFFFF;
    border: 1px solid #2e6ab1;
    background: #8EA9EE;
    direction: ltr;
    animation: fadein 2s;
    -moz-animation: fadein 2s;
    -webkit-animation: fadein 2s;
    -o-animation: fadein 2s;
}
@keyframes fadein {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@-moz-keyframes fadein {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@-webkit-keyframes fadein {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@-o-keyframes fadein {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
افکت Fade In نتایج را با حالت محو و ظاهر شدن تدریجی نمایش می دهد که از نظر ظاهری جلوه زیبایی به برنامه خواهد داد.

دانلود نمونه فایل ها


برای راحتی کار و جلوگیری از سردرگمی می توانیم نمونه فایل های ارائه شده در این آموزش را به صورت یکجا از لینک زیر دریافت و در لوکال هاست یا سرور آنلاین کدها را تست کنیم.
دانلود نمونه فایل های نمایش زنده اطلاعات با ای جکس (Ajax)

کد و پیش نمایش آنلاین


جهت بررسی و تست آنلاین برنامه نیز می توانیم از نمونه کدها و لینک پیش نمایش آنلاین زیر استفاده کنیم:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>وبگو | نمایش زنده اطلاعات با ای جکس</title>
<!-- Webgoo.ir -->
<link rel="stylesheet" href="style_pro.css">
<script src="script_pro.js"></script>
</head>
<body>
<noscript>جاوا اسکریپت در مرورگر شما غیر فعال است!</noscript>
<div id="show-result"></div>
<hr>
- برای نمایش یا به روزرسانی نتیجه در این صفحه ابتدا باید فایل update.php در نوار آدرس مرورگر فراخوانی شود. [<a href="update.php" title="Update.php" target="_blank">فراخوانی فایل update.php</a>]
<br>
- آپدیت در هنگام تست برنامه به صورت دستی انجام می شود اما در پروژه های کاربردی می تواند به فرض با فراخوانی صفحه توسط کاربر یا بازدیدکننده سایت و به صورت خودکار صورت گیرد.
<br>
- عددی که در کادر نتیجه نمایش داده می شود با هر فراخوانی فایل update.php تغییر خواهد کرد (پس از هر آپدیت اندکی صبر کنید!).
</body>
پیش نمایش آنلاین
نکته: استفاده از این شیوه به فایل متنی محدود نبوده و در صورت آشنایی با برنامه نویسی PHP به روش های دیگر مانند استفاده از دیتابیس نیز به راحتی قابل استفاده است.
sectionدسته بندی: آموزش کاربردی » Ajax
related مطالب بیشتر:
» اعتبار سنجی همزمان فرم با آژاکس (Ajax) و PHP
» آموزش نحوه آپلود فایل با PHP و آژاکس (Ajax)
» ساخت قابلیت امتیازدهی با PHP و Ajax
» لیست داینامیک پیشنهاد کلمات، مبتنی بر ای جکس، PHP و MySQL
» ارسال اطلاعات فرم با ای جکس (Ajax) و نمایش پیام در حال پردازش
commentنظرات (۲۳ یادداشت برای این مطلب ارسال شده است)
more یادداشت های جدید بر اساس تاریخ ارسال در انتهای یادداشت های موجود نمایش داده می شوند.
نویسنده: بهنام
زمان: ۱۶:۵۲:۱۴ - تاریخ: ۱۳۹۳/۰۳/۰۱
شما سه راه پیشنهاد کردید:
اولی:
در ستونی که پیام های کاربران اینسرت میشوند ستون جدیدی به نام state اضافه کردم و از نوع INT گذاشتم کاربر پیامی که میفرستد state آن پیام برابر با 0 میشود و گفتیم که پیام هایی که در پایگاه داده state آن ها برابر با 0 باشند را در مرورگر ارسال کن و در فایل delete.php نیز گفتم که با دستور UPDATE - می گیرد state کل پیام ها را تبدیل به 1 می کند و پیام ها تکرار نمیشوند ولی همچنان مشکل قبلی هست کاربر دیگری نمیتواند آن پیام را ببیند و فقط نویسنده ی آن پیام میتواند ببیند مگر آن که پیام ها با آژاکس کمی دیرتر عمل کند یعنی کمی دیرتر در فایل delete.php استیت را از 0 به 1 تبدیل کند کاربر دیگری میتواند ببیند به کل شانسی می شود بعضی پیام های ارسال کاربر را کاربر دیگری ببیند
و اگر کل پیام ها را از پایگاه داده حذف کنیم فرقی با این نمیکند همچنان مشکل قبلی نیز هست
دومی: که راه آرایه ها هست که متوجه نشدم منظور شما را
سومی راه سشن:
موقعی که هر کاربری پیامی ارسال میکند یک سشن ایجاد می شود و مقدار آن سشن با آی دی آخرین پیامی که در پایگاه داده وجود دارد میشود
و موقع نمایش پیام های پایگاه داده در دستور select چنین کدی هستش
$result = $class->Query("SELECT * FROM `chat` WHERE `id` = ".@$_SESSION['chat']."");
به این معنی که آی دی رو انتخاب کن که برابر با آخرین پیامی که خود کاربر میفرستد
و در نهایت در فایل delete.php چنین کدی وجود دارد
unset($_SESSION['chat']);
که سشنی که برای هر کاربر وجود دارد را حذف می کند و در آخر چون سشنی وجود ندارد پیام ها دیگر تکرار نمیشوند و سوال اینجاست که اگر در delete.php آن سشن را حذف نکنیم اخرین پیامی که خود کاربر میفرستد هی تکرار میشود و مشکل این روش هم این است که هر کاربری پیام خود را میبیند
در نهایت هم از شما تشکر میکنم ممنون میشم اگر کل پروژه ام را با اجازتون بهتون ایمیل کنم مشکلش را برام درست کنید بی نهایت ممنونم
در ضمن با آژاکس نمی شود کاری کرد که اگر مقداری را فرستاد دوباره که میخواهد بفرستد مقدار یکی بود دیگه نفرستد با این کار از تکرار جلوگیری کرد اما باز هم نمیشود فرض کنیم این کار را هم کردیم کاربر متن جدیدی را که ارسال کند پس میفهمد که متن جدیدی اضافه شده و همه را قبلی ها را هم دوباره تکرار خواهد کرد
نمیدانم والا دیگه چطوری فکر کنم
منتظر جوابتون هستم ممنونم
پاسخ: 
به عنوان آخرین نکته، باید در هر روشی که استفاده می کنید، نام کاربری را که یک فاکتور یکتا است دخیل کنید، به طور مثال در سشن باید برای هر کاربر یک سشن آی دی با نامی مجزا داشته باشید، نه یک سشن آی دی عمومی به نام chat و... هدف در اینجا مدیریت رفتار هر کاربر به صورت مجزا است، اما نوع تئوری شما به صورت عادی است، متاسفانه به دلیل کمبود فرصت امکان راهنمایی بیشتر در این خصوص وجود ندارد!
نویسنده: بهنام
زمان: ۰۲:۴۵:۱۳ - تاریخ: ۱۳۹۳/۰۳/۰۳
سلام
یادم رفت بپرسم که
AjaxClear(0);
چه وقتی به 1 خواهد رسید؟
که در این قسمت مشخص کرده اید
if(StartTimer == 1){
setTimeout('AjaxLive()', 5000);
}
این که تا ابد رو 0 میماند و هیچ وقت به 1 نمیرسه
پاسخ: 
سلام
این قسمت برای حالتی است که بخواهیم تابع در صورت حذف محتوای فایل txt مجددا اجرا شود (در این صورت صفر باید یک می بود)، در حالت فعلی تابع با هر اجرا، خودش را نیز با setTimeout بعد از 5 ثانیه اجرا می کند (دستور در ابتدای تابع نوشته شده)، به عبارتی دیگر قسمت مورد نظر در شرایط فعلی نقشی در کدها ندارد مگر اینکه بخواهیم نوع عملکرد را اندکی تغییر دهیم.
نویسنده: بهنام
زمان: ۰۰:۳۳:۱۸ - تاریخ: ۱۳۹۳/۰۳/۰۴
سلام و عرض ادب
اون پروژه ای که دادم را روی سرور نصب کردم کلا خیلی مرورگر هنگ میکرد من هرچه سعی کردم کد ها را سبک تر کنم ولی خیلی سنگین بود یه پروژه ای بهتون ایمیل کردم ببینید چرا تو سرور اینقدر هنگ میکنه؟
پاسخ: 
سلام
ارسال و دریافت درخواست آژاکسی آنطور که در لوکال ساده است، در سرور نیست، چون در لوکال تمام فعل و انفعالات در یک کامپیوتر انجام می شود اما در سرور درخواست باید از مرورگر شما و در بستر اینترنت به سرور ارسال و پاسخ دریافت شود، با توجه به سرعت شبکه و مخصوصا کیفیت پردازش سرور این فرآیند ممکن است سریع یا کند باشد که در صورت اخیر با مشکل جدی مواجه خواهید شد، از طرفی درخواست های پی در پی آژاکسی به هیچ وجه صحیح نیست، باید برنامه خود را طوری طراحی کنید که حداقل بین دو درخواست 10 الی 15 ثانیه وقفه وجود داشته باشد، ضمن اینکه باید حداقل اطلاعات رد و بدل شود که قبلا گفته شد، به عبارتی دیگر اپلیکیشن های مبتنی بر Ajax بسیار حساس هستند و باید به دقت طراحی شوند تا از حداقل منابع سرور استفاده کنند، توصیه می کنیم برای راحتی بیشتر از جی کئوری برای این مورد (مدیریت ارسال و دریافت اطلاعات به صورت آژاکسی) استفاده کنید.
نویسنده: بهنام
زمان: ۱۹:۵۲:۰۴ - تاریخ: ۱۳۹۳/۰۳/۰۵
سلام
بابت جواب دادنتون تشکر میکنم
در صورتی که امکانش هست راجع به ارسال آژاکس های چندگانه به صورت همزمان ؛ اینطور که توضیح دادید با مثال هایی در سایت مفصل راجع بهش بحث و مطلب ارسال کنید تا تمام کاربران استفاده کنن.
البته یک پیشنهاد بود.
نویسنده: مرضیه
زمان: ۰۲:۰۸:۱۶ - تاریخ: ۱۳۹۴/۰۱/۱۲
با سلام
من می خواستم به جای اینکه اطلاعات آماری به صورت متنی در مرورگر چاپ بشه یک نمودار گرافیکی ایجاد بشه. آیا باز هم باید به همین شیوه ادامه بدیم؟ ممنون میشم اگر اطلاعاتی در این زمینه دار‌‌ید در اختیارم بگذارید
در ضمن از آموزش های مفید و کاربردی شما نهایت تشکر رو دارم
پاسخ: 
سلام
اصولا برنامه های تعاملی وب از ترکیب و همراهی چند زبان سمت کاربر و سرور ایجاد می شوند، به عبارت دیگر برای خلق چنین حالتی، Ajax تنها می تواند نقش رابط بین مرورگر و سرور را بر عهده داشته باشد و سایر موارد (مانند محاسبات، ترسیم به صورت گراف و...) باید توسط PHP، jQuery و... ایجاد و مدیریت شوند.
نویسنده: امین
زمان: ۰۰:۱۵:۱۸ - تاریخ: ۱۳۹۴/۰۷/۱۹
سلام استاد خدا قوت
یک سوال
شما همین سایت رو چطوری طراحی کردید میشه یه آموزش کلی و مختصر در مورد نحوه کلی این سایت بزارید.
مثلا اینکه کدهای آموزشی رو چطور قرار میدهید که ترجمه نمیشه؟
پاسخ: 
سلام
سوالتان کلی است! طراحی سایت می تواند هم به صورت استفاده از CMS های آماده مانند جوملا، وردپرس و... باشد و هم به صورت نوشتن یک CMS شخصی که نیاز به داشتن مهارت برنامه نویسی وب و آشنایی با جزئیات کار دارد، در مورد بخش دوم سوال، دقیقا متوجه منظورتان از "ترجمه نمیشه" نشدیم، اما در این بخش از سایت از تگ pre و code استفاده شده که با نگاه به سورس کدهای HTML صفحه به راحتی قابل تشخیص است!
نویسنده: mohsen
زمان: ۱۶:۳۸:۵۰ - تاریخ: ۱۳۹۶/۱۰/۰۴
سلام
الان اگه من بخوام مثلا قیمت دلار رو از یه سایت بردارم و بصورت لحظه ای در سایتم نشون بدم باید چیکار کنم؟
ممنون
پاسخ: 
آموزش ارائه شده در حالتی است که فایل PHP یا TXT از قبل آماده باشد، در واقع آموزش صرفا شامل بخش Ajax کار می شود، در مورد سوالتان ابتدا باید با کدهای PHP درخواستی به سرور سایت مورد نظر ارسال و خروجی آن را دریافت کنید، برای این کار روش هایی مانند استفاده از تابع curl یا تابع file_get_contents کاربرد دارد، سپس متناسب با خروجی HTML قسمت های مد نظر را با تابع preg_match و عبارات باقاعده یا کلاس DOMDocument تجزیه کنید و به عنوان نتیجه نهایی و پاسخ درخواست Ajax به مرورگر کاربر ارسال نمائید، قاعدتا انجام این مراحل نیاز به آشنایی با برنامه نویسی PHP و کدنویسی پیشرفته است.
نویسنده: محسن
زمان: ۱۱:۲۳:۵۷ - تاریخ: ۱۳۹۶/۱۰/۰۵
شما میتونید این کار رو انجام بدید؟
اگه میتونید خواهشا هزینه ش رو بهم پیام بدید متاسفانه تلگرام ندارم که باهاتون در ارتباط باشم.
ایمیل بنده هست
ممنون
پاسخ: 
متاسفانه امکان پذیرش سفارش برنامه نویسی مقدور نیست.
more لطفا پیش از ارسال یادداشت نکات زیر را مد نظر داشته باشید:
- مواردی که به کلی خارج از موضوع این مطلب هستند را در فرم منوی "تماس با ما" مطرح و پاسخ را از طریق ایمیل دریافت کنید.
- به سوالات کلی، مبهم، غیرضروری و مشکلاتی که تلاشی برای رفع آن نکرده باشید پاسخ خاصی داده نخواهد شد.
- کدها و اسکریپت های طولانی را ترجیحا در یک صفحه وب آنلاین قرار دهید تا امکان تست و بررسی وجود داشته باشد.
- تمام یادداشت ها بررسی و برای هر کاربر زمان مشخصی جهت پاسخگویی در نظر گرفته می شود، لذا از طرح سوالات متعدد در بازه زمانی کوتاه خودداری کنید.




6 × 9
 refresh
نکته:
با توجه به تاریخ نگارش آموزش های سایت و پیشرفت تکنولوژی های مرتبط با وب در سالیان اخیر، محتوای برخی از مطالب قدیمی ممکن است نیاز به ویرایش و به روزرسانی داشته باشد که این کار هم زمان با تهیه نسخه جدید «وبگو» به مرور در حال انجام است، لطفا در استفاده از مطالب سایت به این نکته دقت داشته و حتی المقدور از چند منبع مختلف استفاده نمائید.
آخرین دیدگاه ها
form حامد
در:
عالی بود
۲۱:۳۸:۳۱ ۱۳۹۸/۱۱/۰۷

form ناشناس
در:
سلام خیلی ممنون بابت پاسخ سریعتون خیلی دنبال همین دو خط کد بودم برای یادگیری سریع ریجکس ولی با سرچ پیدا نکردم و...
۱۸:۰۳:۴۳ ۱۳۹۸/۱۱/۰۷

form فرید
در:
درود بشما، میخواستم بدونم مثل کلمه @، کلمه ایی ساین هم داریم؟ با تشکر
۱۲:۱۹:۰۷ ۱۳۹۸/۱۱/۰۷

form ناشناس
در:
سلام میشه لطفا به سوالم جواب بدید من می خوام با استفاده از عبارات با قاعده تمام تگ های html رو تشخیص بدم...
۱۰:۱۳:۰۵ ۱۳۹۸/۱۱/۰۷

form PewDiePie
در:
سلام چطور می تونم این کد رو یه لینک هم بهش اضافه کنم یعنی این که وقتی عکس رو می بینی طرف بتونه...
۲۳:۳۶:۲۶ ۱۳۹۸/۱۱/۰۶

form رسول
در:
سلام میخوام بجای نمایش متن، متن موجود در یه لینکو بهم نشون بده ممنون میشم کمکم کنید
۱۳:۳۸:۱۸ ۱۳۹۸/۱۱/۰۶

form حسن
در:
من مطابق کد نوشته شده شما میخواستم آدرس
۱۴:۱۰:۱۳ ۱۳۹۸/۱۱/۰۵

form saemrezaei
در:
سلام واقعا عالییه خیلی استفاده کردم به وبلاگم سر بزن لطفا.
۱۳:۳۷:۳۴ ۱۳۹۸/۱۱/۰۵

form نصراله رضایی
در:
سلام در ادمین های گذشته که باز می کنم تصاویر مشاهده نمی شود و من را به آدرس Huge domains.com ارجاع می...
۲۲:۳۹:۵۳ ۱۳۹۸/۱۱/۰۴

form نقدی زاده
در:
واقعا مرسی یه overflow-y:hidden به body دادم اسکرل افقی برای صفحه نمایش تبلت از بین رفت
۱۴:۴۴:۱۳ ۱۳۹۸/۱۱/۰۴

form وحید پوربشیری
در:
سلام لطفا یکی که خوب جاوا اسکریپت بلده بیاد به این آیدی ت.ل.گ.ر.ا.م Alpha2020@ یه کد برام بنویسه پول هم میدم
۱۱:۱۲:۳۲ ۱۳۹۸/۱۱/۰۲

form امین
در:
سلام تشکر بابت راهنماییتون. منظور من این بود که: الان با ثبت نام کاربر a در سایت اطلاعاتش در دیتابیس ثبت میشه و یک پوشه...
۰۳:۱۲:۴۰ ۱۳۹۸/۱۱/۰۲

form شریفی
در:
سلام معنی متن زیر چیست؟
۱۸:۲۸:۰۹ ۱۳۹۸/۱۱/۰۱

form امین
در:
سلام خسته نباشید یه اسکریپت دارم که وقتی کاربر ثبت نام میکنه یه پوشه و محتواش ایجاد میشه. میخوام یه صفحه با هر ثبت نام...
۱۴:۱۸:۵۱ ۱۳۹۸/۱۰/۳۰

form Admin
در:
سلام دوست عزیز. میشه بگویید چگونه میتوان در وبلاگ کادری را باز کرد که بازدید کنندگان بتوانند در آن چیزی بنویسند. ممنون میشم...
۱۱:۲۸:۵۰ ۱۳۹۸/۱۰/۳۰
آگهی