با استفاده از Fetch API یک صفحه HTML بسازید که یک فرم ساده (نام و پیام) دارد و با ارسال فرم داده‌ها را با روش POST به https://jsonplaceholder.typicode.com/posts بفرستد و پاسخ JSON سرور را در صفحه نمایش دهد.

7.0 بازدید آخرین ویرایش در 201 روز قبل ساعت 03:51

0.0

یک فرم HTML بسازید و در رویداد submit تابعی با event.preventDefault() بنویسید که مقادیر ورودی را گرفته و با fetch و گزینه‌های method: 'POST', headers: {'Content-Type': 'application/json'}, body: JSON.stringify(...) به endpoint ارسال کند. از async/await و try/catch برای مدیریت پاسخ و خطا استفاده کنید، وضعیت بارگذاری و پیام‌های خطا/موفقیت را در DOM نمایش دهید و قبل از نمایش نتیجه response.ok را بررسی و با response.json() داده را بخوانید؛ برای تست می‌توانید از jsonplaceholder استفاده کنید و به محدودیت‌های CORS دقت کنید.

توسط پژوهشگر در 201 روز قبل ساعت 03:51
دسته بندی ها: JavaScript JavaScript for beginner
reyhaneh در 201 روز قبل ساعت 04:56

برای پیاده‌سازی خوب، قبل از نمایش نتیجه وضعیت loading را مدیریت کرده و با فعال/غیرفعال کردن دکمه ارسال تجربه کاربر را بهبود دهید. مطمئن شوید پاسخ فقط در صورت ok بودن با response.json() خوانده شود و در غیر این صورت پیغام خطای مناسب نشان داده شود. همچنین برای جلوگیری از مشکلات CORS، درخواست JSON را با Content-Type: application/json ارسال کرده و از سرور مورد نظر بخواهید که اجازه پاسخ‌دهی دهد. استفاده از async/await و try/catch کد را تمیزتر کرده و خطاها را به‌خوبی مدیریت می‌کند.

گزارش

1 پاسخ

جدید ترین قدیمی ترین بالاترین امتیاز پاسخ های من

در حال بارگیری...
ورود به حساب کاربری