چند روزی میشه که درگیر پروژه جدیدی هستم و دارم سعی میکنم که یک API به کمک میکروفرمورک سیناترا در روبی بنویسم. چیزی که نوشتم روی سیستم لوکال به خوبی کار میکرد، با کال کردن متدهاش در مرورگر و به وسیله curl هم به خوبی جواب میداد. به سرم زد یه دموی تکصفحهای براش درست کنم! اما قصد این که به سمت node و این داستانا برم هم نداشتم.
بعضی از دوستانم در بسترهایی مثل توییتر و ... ؛ بهم پیشنهاد دادن از AJAX یا Fetch استفاده کنم. با کمی جست و جو فهمیدم که Fetch گزینه جدیدتر و بهتریه، پس تصمیم گرفتم ازش استفاده کنم. اما چشمتون روز بد نبینه! یه سری ارور عجیب از Console گرفتم و خب من رو بر آن داشت تا جست و جو کنم و برای مشکل، راه حلی پیدا کنم.
خب، فرض کنیم API ما چنین چیزیه، یعنی قراره یه سری داده به صورت JSON به ما برگردونه. در سیناترا معمولا به این شکل مینویسیم :
حالا، فرض کنیم که در یک فایل HTML ای قراره این دیتا رو نشون بدیم به کاربر و نیاز داریم که کمی JS بنویسیم :
حالا اگر اجراش کنید، احتمالا چنین اروری خواهید گرفت :
Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.
خب، راه حل چیه؟ اول از همه gem ها رو به این شکل در Gemfile خودتون ادیت کنید :
حالا بر میگردیم تو فایل API ، به این شکل تغییرش میدیم :
ابتدا تنظیم میکنیم که binding ها روی لوکال هاست ست شده باشن (چهارتا صفر! قبلتر این مورد رو توضیح دادم، وقتی که نتونستم درست روی فندق دپلوی کنم پروژه رو فهمیدم این گزینه باید اضافه بشه) بعد در configure گفتیم که حتما cross origins برای ما فعال باشه.
در نهایت، اومدیم در before مشخص کردیم که اون هدری که میخواهیم، به چه شکلی ست و ارسال میشه و برابر * قرارش دادیم. در options هم گفتیم برای همه هدرها، برای ما چه کار کنه و اگر موفقیت آمیز بود؛ تازه کد ۲۰۰ (یعنی درخواست موفقیت آمیز) رو برگردونه.
در نهایت هم، از وقتی که گذاشتید و این ویرگول رو خوندید متشکرم! امیدوارم به دردتون خورده باشه :)