وقتی صفحه ای در یک وب سایت بارگزاری و لود میشه و شما اون صفحه رو مشاهده می کنید شامل اجزای مختلفی میشه از جمله فونت ها و تصاویر و استایل و … که در کنار هم باعث میشه یک صفحه وب ساخته بشه. در اکثر مواقع این فایل های در همون هاست یا به بیان دیگه همون سروری که وب سایت قرار داره لود میشه. اما اگر قرار باشه که بعضی از این فایل ها و یا تصاویر و یا کدهای و درخواست ها از سایت های دیگه و سرورهای دیگه فراخوانی بشه و در این صفحه لود بشه باید برای جلوگیری از لود کدهای مخرب و امنیت سایت، موارد امنیتی رو در نظر گرفت و قوانینی وضع کرد. چون این منابع از خارج از هاست اصلی وب سایت شما فراخوانی و لود میشن.
CORS مخفف Cross-Origin Resource Sharing هست که یک نوع مکانسیم هست که برای مرورگر تعریف می کنه که آیا اجازه داره از منبعی خارج از خود سایت، بارگزاری و لود کنه یا نه. این مکانسیم از طریق هدر یا همون سر صفحه http کار می کنه و از طریق یکی از روش های دامنه یا پورت و یا نوع http یا https ، کار می کنه.
CORS قبل از ارسال درخواست های اصلی، یه سری درخواست اولیه به نام preflight برای سرور میزبان ارسال می کنه و چک می کنه که آیا به سرور اجازه لود میده و اگر درخواست های اولیه موفق بودن درخواست های اصلی رو برای سرورها ارسال می کنه.
خود origin به معنی ریشه و اصل و نسب هست و same origin این معنی رو میده که یک وب سایت می تونه منابعی که روی همون سرور قرار داره رو دریافت و بارگزاری کنه.
هر origin شامل 3 چیز هست : : پروتکل، هاست و شماره پورت.
cross-origin چیه ؟
هر درخواستی که خارج از origin اصلی سایت ارسال بشه cross-origin هست . ممکنه این درخواست آدرس یک تصویر باشه و یا یک فونت و یا یک درخواست دیگه. این درخواست ممکنه به یک پورت دیگه غیر از پورت 80 ارسال بشه و یا اگر به یک سابدامنه یک سایت این درخواست ارسال بشه و یا یک درخواست از یک وب سایت که http هست به همون صفحه از سایت که https باشه ارسال بشه یک cross origin محسوب میشه.
چون یک وب سایت همه منابع رو از هاست خودش فراخوانی نمی کنه و ممکنه بسیاری از فایل ها و منابع رو از خارج از سرور فراخوانی کنه ، cross origin کمک می کنه که این منابع بدون مشکل لود بشه.
cross origin امکان ایجاد سفارشی سازی امنیتی برای دریافت فایل ها رو میده و کمک می کنه که بتونیم به منابع خارجی دسترسی داشته باشیم و از اونها استفاده کنیم.
فعال بودن same-origin باعث میشه از حملات رکوئست های جعلی از یک وب سایت دیگر که به نام Cross Site Request Forgery (CSRF) شناخته میشه پیشگیری شود. به طور خلاصه حمله CSRF باعث می شود که کاربر تایید شده در یک وب اپلیکیشن یک کار و عملیات که موجب به خطر انداختن امنیت وب اپلیکیشن شود. این اقدام ممکن هست از طریق مهندسی اجتماعی اتفاق بیافتد و درخواست هایی مانند تغییر ایمیل و یا هر عمل ناخواسته دیگر توسط کاربر انجام شود.
بعضی از اصطلاحات که با اون ها سر و کار خواهیم داشت اینها هستن :
Access-Control-Allow-Origin
Access-Control-Allow-Credentials
Access-Control-Allow-Headers
Access-Control-Allow-Methods
Access-Control-Expose-Headers
Access-Control-Max-Age
Access-Control-Request-Headers
Access-Control-Request-Method
با استفاده از کد می توانیم برای یک سایت، این استثنا رو برای آن دامنه قائل شویم
Access-Control-Allow-Origin: https://domain-a.com
برای اینکه همه دامنه ها و وب سایت ها رو از این قاعده مستثنی کنیم می تونیم از این کد استفاده کنیم :
Access-Control-Allow-Origin: *
از جمله بیشترین ارورهایی که در کنسول مرورگر نمایش داده میشه این 3 ارور هست :
No ‘Access-Control-Allow-Origin’ header presentNo ‘Access-Control-Allow-Headers’ headers presentMethod not supported under Access-Control-Allow-Methods header
اطلاعات بیشتر در مورد cros origin را در سایت موزیلا مشاهده و مطالعه کنید :
https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS
از جمله دلایلی که با ارور cross مواجه می شویم می توانیم به دلایل زیر اشاره کنیم :
CORS disabled
CORS request did not succeed
CORS header ‘Origin’ cannot be added
CORS request external redirect not allowed
CORS request not http
CORS header ‘Access-Control-Allow-Origin’ missing
CORS header ‘Access-Control-Allow-Origin’ does not match ‘xyz’
Credential is not supported if the CORS header ‘Access-Control-Allow-Origin’ is ‘*’
Did not find method in CORS header ‘Access-Control-Allow-Methods’
expected ‘true’ in CORS header ‘Access-Control-Allow-Credentials’
CORS preflight channel did not succeed
invalid token ‘xyz’ in CORS header ‘Access-Control-Allow-Methods’
invalid token ‘xyz’ in CORS header ‘Access-Control-Allow-Headers’
missing token ‘xyz’ in CORS header ‘Access-Control-Allow-Headers’ from CORS preflight channel
Multiple CORS header ‘Access-Control-Allow-Origin’ not allowed
ساخت فهرست از تیتر ها
مفهوم کراس
(زبان ساده و قابل فهم)
5 خط به انگلیسی
توضیحات کامل تر
لینک های اصلی
رفع مشکل در پایتون و چنگو
به همراه عنوان انگلیسی
رفع مشکل در نود جی اس
به همراه عنوان انگلیسی
رفع مشکل در لاراول
به همراه عنوان انگلیسی
ویدئو 10 دقیقه ای زبان اصلی
یک تصویر برای هر سکشن
لینک دهی به سایر مقالات سایت
لینک دهی به محصولات سایت
استفاده از ایموچی
https://auth0.com/blog/cors-tutorial-a-guide-to-cross-origin-resource-sharing/