سوال: آپلود عکس با ایجکس [بایگانی]

numberone1

جمعه 18 اسفند 1391, 17:05 عصر

سلام

کسی میتونه کمک کنه یک آپلودر ساده با ajax و jquery درست کنم که به محض اینکه عکس انتخاب شد آپلود شه؟
قسمت آپلودش با php باشه و بعد از آپلود آدرس عکس که آپلود شده به عنوان value یک input hidden به فرم اضافه بشه؟
مرسی

eshpilen

جمعه 18 اسفند 1391, 21:43 عصر

ببین این یه مثال خیلی ناقص که حداقل توی فایرفاکس کار میکنه (برای کار کردن توی مرورگرهای دیگه مثل IE احتمالا باید کد جاوااسکریپتش رو یکم دستکاری کنیم):

<?php

error_reporting(E_ALL);
ini_set('display_errors', '1');

if(!empty($_POST)) {

$filename=rand(1, 99999);

move_uploaded_file($_FILES['file']['tmp_name'], "./$filename");

echo "<html><body><span id='filename'>Uploaded filename: $filename</span></body></html>";

exit;

}

?>
<html>
<head>
<script>
var f=false;
function uploaded() {
if(!f) {
f=true;
return;
}
document.getElementById('xx').value='';
alert(ifm.document.getElementById('filename').inne rHTML);
}
</script>
</head>
<body>
<iframe name="ifm" src="about:blank" style="display: none" onload="uploaded()"></iframe>
<form name="form1" action="" method="post" enctype="multipart/form-data" target="ifm">
<input id="xx" type="file" name="file" onchange="s.click();">
<input type="submit" name="s" style="display: none">
</form>
</body>
</html>

طرز کارش خیلی ساده است.
از یک فریم داخلی پنهان برای آپلود استفاده میکنه.
فایل که آپلود میشه اسمش توی فریم برگشت داده میشه و توسط جاوااسکریپت خونده و alert میشه.

برای استفادهء عملی طبیعتا باید روش خیلی کار بشه و کامل بشه؛ مثلا هندل کردن خطاها.
بعد امنیت آپلود هم که سمت سرور باید چک بشه و بحثش جداست.

راستی هر دفه فایل آپلود شده با یک اسم عددی رندوم در دایرکتوری اسکریپت ذخیره میشه.

numberone1

شنبه 19 اسفند 1391, 17:02 عصر

ببین این یه مثال خیلی ناقص که حداقل توی فایرفاکس کار میکنه (برای کار کردن توی مرورگرهای دیگه مثل IE احتمالا باید کد جاوااسکریپتش رو یکم دستکاری کنیم):

<?php

error_reporting(E_ALL);
ini_set('display_errors', '1');

if(!empty($_POST)) {

$filename=rand(1, 99999);

move_uploaded_file($_FILES['file']['tmp_name'], "./$filename");

echo "<html><body><span id='filename'>Uploaded filename: $filename</span></body></html>";

exit;

}

?>
<html>
<head>
<script>
var f=false;
function uploaded() {
if(!f) {
f=true;
return;
}
document.getElementById('xx').value='';
alert(ifm.document.getElementById('filename').inne rHTML);
}
</script>
</head>
<body>
<iframe name="ifm" src="about:blank" style="display: none" onload="uploaded()"></iframe>
<form name="form1" action="" method="post" enctype="multipart/form-data" target="ifm">
<input id="xx" type="file" name="file" onchange="s.click();">
<input type="submit" name="s" style="display: none">
</form>
</body>
</html>

طرز کارش خیلی ساده است.
از یک فریم داخلی پنهان برای آپلود استفاده میکنه.
فایل که آپلود میشه اسمش توی فریم برگشت داده میشه و توسط جاوااسکریپت خونده و alert میشه.

برای استفادهء عملی طبیعتا باید روش خیلی کار بشه و کامل بشه؛ مثلا هندل کردن خطاها.
بعد امنیت آپلود هم که سمت سرور باید چک بشه و بحثش جداست.

راستی هر دفه فایل آپلود شده با یک اسم عددی رندوم در دایرکتوری اسکریپت ذخیره میشه.
مرسی از جوابت ولی
قبلا گفته بودم که نمیخوام توی فرم باشه اگر میخواستم توی فرم بزارم که هزار تا پلاگین جی کوئری هست این کار و انجام بده.
بعد iframe خیلی ضایع هست که تر جیج میدم چند روز بیشتر وقت بزارم روش با همون jquery با روش های پیچیده تر آپلود انجام بشه ولی کارم و با استفاده از iframe خراب نکنم :چشمک:
یکی view source بگیره نمیخنده iframe و ببینه؟!!!

به هر حال مرسی:قلب:

tux-world

شنبه 19 اسفند 1391, 19:31 عصر

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

numberone1

شنبه 19 اسفند 1391, 20:14 عصر

ببین شما نمیتونی همزمان دو تا کار رو یکجا و با هم انجام بدی هم انتخاب و هم آپلود منظورمه. بعد اینکه شما فایل رو انتخاب کردید باید کلیدی بزنین که آپلود شه یه نه؟ این سادست و با جیکوئری میشه نوشت ولی همزمان باید از رویداد استفاده کنید
چرا نشه!! شما با cpanel اگر کار کرده باشید در قسمت upload file همینطور هست بلافاصله پس از انتخاب فایل آپلود میشه. شدنش که میشه فقط گفتم تمام مثال هائی که توی نت هست input فایل و میزارن توی فرم بعد encrypte فایل میزارن multipart-data بعد هم ارسال میکنن . دیگه احتیاجی یه submit هم نداره .
الان مشکل من همینه که میخوام بدون استفاده از form ارسال کنم عکسو

eshpilen

شنبه 19 اسفند 1391, 21:26 عصر

یک ترفندی بنظرم میرسه.
شما میتونی ورودی فایل رو در یک فرم مجزا بذاری، بعد بوسیلهء جاوااسکریپت در سمت کلاینت بیای و ورودی فایل رو از نظر نمایشی به درون هر فرم دیگری که میخوای منتقل کنی.

بعد iframe خیلی ضایع هست که تر جیج میدم چند روز بیشتر وقت بزارم روش با همون jquery با روش های پیچیده تر آپلود انجام بشه ولی کارم و با استفاده از iframe خراب نکنم
یکی view source بگیره نمیخنده iframe و ببینه؟!!!
iframe چه اشکالی داره؟ دلیل و سندش؟
روشی چون قدیمی هست دلیل نمیشه غیرقابل استفاده/بد/ضایع باشه.
خیلی چیزها قدیمی هستن که هنوزم استفاده میشن یا اصلا راه دیگری نداره.
خیلی از فریمورک ها و برنامه ها هم iframe رو بصورت fallback استفاده میکنن؛ مثلا اول میاد با استاندارد جدید HTML5 و ایجکس آپلود رو انجام بده، اگر مرورگر ساپورت نمیکرد میره سراغ روشها یا ترفندهای قدیمی تر مثل iframe.
iframe حتی یک روش شبیه سازی ایجکس در مرورگرهای خیلی قدیمی که XMLHttpRequest ندارن است.
توی همون جی کوئری هم تاجاییکه قبلا شنیده بودم از iframe بعنوان fallback استفاده میشه. اگر هم جی کوئری چنین چیزی نداشته باشه توی فریمورک های دیگر جاوااسکریپت هست.
البته طبیعتا به مرور که آمار مرورگرهای قدیمی خیلی کم میشه ممکنه این امکان رو حذف کنن.
بهرحال من در استفاده از هیچ روشی به خودی خودش مشکلی نمیبینم. مهم اینه که هدف درست انجام بشه.
تازه اینکه یه چیزی داخل کد هست و به سادگی مشخص نمیشه. از طرف دیگر، تاحالا نشنیده بودم که iframe غیراستاندارد و منسوخ یا بقولی Deprecated باشه. بنظرم هنوزم استاندارده و کاربردهای مدرن خودش رو داره. حالا کی میخواد بیاد سورس شما رو بخونه و ببینه iframe رو واسه چی استفاده کردی. زیاد نگران نباش!!

البته این کار رو با همون روش ایجکس جدید هم میشه انجام داد (و میشه این روش رو هم بعنوان fallback بهش اضافه کرد). منتها من خواستم راحت و سریع کدش رو بنویسم از این ترفند استفاده کردم. بهرحال بیشتر وقت نداشتم که یک کد کامل با روش جدیدتر برات بذارم. شما انتظار داری کسی بیاد منبع بخونه و کلی کد کامل بنویسه و تست کنه براتون؟ ضمنا من خواستم روشش حداقل یه چیزی باشه که توی تمام مرورگرهایی که در حال حاضر آمار قابل توجه دارن کار کنه.

numberone1

شنبه 19 اسفند 1391, 23:45 عصر

چه اشکالی داره؟ دلیل و سندش؟
روشی چون قدیمی هست دلیل نمیشه غیرقابل استفاده/بد/ضایع باشه.
خیلی چیزها قدیمی هستن که هنوزم استفاده میشن یا اصلا راه دیگری نداره.
خیلی از فریمورک ها و برنامه ها هم iframe رو بصورت fallback استفاده میکنن؛ مثلا اول میاد با استاندارد جدید HTML5 و ایجکس آپلود رو انجام بده، اگر مرورگر ساپورت نمیکرد میره سراغ روشها یا ترفندهای قدیمی تر مثل iframe.
iframe حتی یک روش شبیه سازی ایجکس در مرورگرهای خیلی قدیمی که XMLHttpRequest ندارن است.
توی همون جی کوئری هم تاجاییکه قبلا شنیده بودم از iframe بعنوان fallback استفاده میشه. اگر هم جی کوئری چنین چیزی نداشته باشه توی فریمورک های دیگر جاوااسکریپت هست.
البته طبیعتا به مرور که آمار مرورگرهای قدیمی خیلی کم میشه ممکنه این امکان رو حذف کنن.
بهرحال من در استفاده از هیچ روشی به خودی خودش مشکلی نمیبینم. مهم اینه که هدف درست انجام بشه.
تازه اینکه یه چیزی داخل کد هست و به سادگی مشخص نمیشه. از طرف دیگر، تاحالا نشنیده بودم که iframe غیراستاندارد و منسوخ یا بقولی Deprecated باشه. بنظرم هنوزم استاندارده و کاربردهای مدرن خودش رو داره. حالا کی میخواد بیاد سورس شما رو بخونه و ببینه iframe رو واسه چی استفاده کردی. زیاد نگران نباش!!

البته این کار رو با همون روش ایجکس جدید هم میشه انجام داد (و میشه این روش رو هم بعنوان fallback بهش اضافه کرد). منتها من خواستم راحت و سریع کدش رو بنویسم از این ترفند استفاده کردم. بهرحال بیشتر وقت نداشتم که یک کد کامل با روش جدیدتر برات بذارم. شما انتظار داری کسی بیاد منبع بخونه و کلی کد کامل بنویسه و تست کنه براتون؟ ضمنا من خواستم روشش حداقل یه چیزی باشه که توی تمام مرورگرهایی که در حال حاضر آمار قابل توجه دارن کار کنه.

نه آقا کسی توقع نداشت کسی برای من کد کامل بزاره .
یه سرچ هم بزنی در مورد iframe میبینی که موافق هاش میگن فقط جاهائی که ajax و jquery نمیشه استفاده کرد ترجیح دادن از iframe استفاده کنن. خیلی دلیل های زیادی هم هست که استفاده از iframe و اصلا مناسب نمیدونن
میدونی مثل چی میمونه میگی خوب ژیان هم ماشینه دیگه چرا نباید استفاده کرد ازش؟ واقعا چرا نیاید از ژیان استفاده کرد خوب بعضی ها دلشون میخواد استفاده کنن

ضمن اینکه منم مشکلم حل شد به سختی
به هر حال مرسی از اینکه وقت گذاشتی تو این تاپیک 2 تا مثال هم برام گذاشتی :چشمک:

numberone1

شنبه 19 اسفند 1391, 23:53 عصر

حالا کی میخواد بیاد سورس شما رو بخونه و ببینه iframe رو واسه چی استفاده کردی. زیاد نگران نباش!!

خیلی کسائی که من باهاشون کار میکنم آدم های حرفه ای هستن و خیلی دقیق این چیز ها رو چک میکنن
توضیحات گوگل میگه:
Google supports frames and iframes to the extent that it can. Frames can cause problems for search engines because they don't correspond to the conceptual model of the web.

eshpilen

یک شنبه 20 اسفند 1391, 00:52 صبح

خیلی کسائی که من باهاشون کار میکنم آدم های حرفه ای هستن و خیلی دقیق این چیز ها رو چک میکنن
توضیحات گوگل میگه:
Google supports frames and iframes to the extent that it can. Frames can cause problems for search engines because they don't correspond to the conceptual model of the web.
مورد کاربرد شما با مسئلهء موتور جستجو مشکلی نداره، چون برای محتوای خاصی استفاده نمیشه.