آشنایی با اشتراک‌گذاری منابع متقاطع (CORS)

به اشتراک گذاری منابع متقاطع (CORS) توسط کنسرسیوم وب جهانی (W3C) در سال 2006 معرفی شد تا به سرورهای وب راهی برای تعیین هر منبع دیگری (دامنه، طرح یا پورت) که اجازه دسترسی به منابع سرور را فراتر از آن دارند، ارائه دهد. سیاست همان مبدا این یک تحول قابل توجه در امنیت وب بود که برنامه های کاربردی وب تعاملی و یکپارچه تر را در عین حفظ پروتکل های امنیتی سخت ممکن می کرد.

به اشتراک گذاری منابع متقاطع چیست؟

CORS (اشتراک گذاری منابع متقابل) مکانیزمی است که از هدرهای HTTP استفاده می کند تا به مرورگر بگوید که به یک برنامه وب در حال اجرا در یک مبدا (دامنه) اجازه دسترسی به منابع انتخاب شده از یک سرور در مبدا دیگر را داشته باشد. این یک پیشرفت حیاتی در امنیت وب است، زیرا امکان ارتباط بازتر بین سرویس‌های وب مختلف را فراهم می‌کند و در عین حال از حملات مخرب محافظت می‌کند.

چگونه CORS امنیت وب را افزایش می دهد: یک بینش فنی

CORS یک ویژگی امنیتی است که به برنامه های کاربردی وب اجازه می دهد تا از سرورهایی که در مبادی متفاوتی نسبت به وب سایت میزبانی شده اند درخواست دهند.

قبل از CORS، خط مشی مبدأ یکسان، برنامه‌های کاربردی وب را محدود می‌کرد که فقط به همان دامنه سایت درخواست کنند. در حالی که این خط‌مشی یک اقدام امنیتی حیاتی است که از دسترسی سایت‌های مخرب به داده‌های حساس جلوگیری می‌کند، تعاملات متقابل مشروع لازم برای برنامه‌های کاربردی وب مدرن را نیز محدود می‌کند.

CORS به سرورها اجازه می دهد تا سربرگ های خاصی را شامل شوند که به مرورگر می گوید کدام منبع مجاز به دسترسی به منابع است. در اینجا یک مثال اساسی از چگونگی افزایش امنیت CORS آورده شده است:

1. یک برنامه وب در https://example.com تلاش می کند تا درخواستی را ارائه دهد https://api.example.org/data.
2. مرورگر به طور خودکار درخواست CORS را به https://api.example.org/data.
3. سرور در https://api.example.org خط مشی CORS خود را بررسی می کند تا تعیین کند که آیا https://example.com مجاز است.
4. اگر https://example.com مجاز است، سرور با هدرهای CORS مناسب پاسخ می دهد، مانند Access-Control-Allow-Origin: https://example.com، نشان می دهد که مرورگر باید به برنامه وب اجازه دسترسی به منابع را بدهد.

بدون CORS، خط مشی یکسانی درخواست را مسدود می‌کند، اما با CORS، سرور می‌تواند به‌طور ایمن درخواست‌های متقاطع از مبداهای مورد اعتماد را مجاز کند.

درخواست های ساده در مقابل قبل از پرواز: درک تفاوت

درخواست های CORS به دو نوع دسته بندی می شوند: درخواست های ساده و درخواست های پیش پرواز. تمایز بین آنها بر اساس روش استفاده شده و هدرهای ارسال شده با درخواست است.

• درخواست های ساده: اینها درخواست هایی هستند که معیارهای مشخصی را که توسط CORS تعریف شده است، برآورده می کنند. یک درخواست ساده می تواند از روش GET، POST یا HEAD استفاده کند. علاوه بر این، فقط باید از هدرهایی استفاده کند که ایمن و غیر تعریف شده توسط کاربر، مانند Accept, Accept-Language, Content-Language، و Content-Type با ارزش های application/x-www-form-urlencoded, multipart/form-data، یا text/plain. در اینجا یک مثال از یک درخواست ساده آورده شده است:

fetch('https://api.example.org/data', {
  method: 'GET',
  headers: {
    'Accept': 'application/json',
  }
});

• درخواست های پیش از پرواز: این درخواست‌ها معیارهای درخواست‌های ساده را برآورده نمی‌کنند و قبل از ارسال درخواست واقعی، به درخواست اولیه «پیش پرواز» با روش OPTIONS نیاز دارند. این پیش از پرواز بر اساس خط مشی CORS منبع هدف بررسی می کند که آیا درخواست واقعی برای ارسال امن است یا خیر. درخواست‌های Preflighted زمانی استفاده می‌شوند که روشی غیر از GET، POST یا HEAD باشد، یا زمانی که از هدرهای سفارشی استفاده می‌شود. در اینجا یک مثال است:

fetch('https://api.example.org/data', {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json',
    'X-Custom-Header': 'value'
  },
  body: JSON.stringify({key: 'value'})
});

در این حالت، مرورگر ابتدا یک درخواست OPTIONS را به https://api.example.org/data برای تعیین اینکه آیا درخواست POST با a Content-Type از application/json و یک هدر سفارشی X-Custom-Header مجاز است.

سرصفحه‌های CORS توضیح داد: چه هستند و چگونه کار می‌کنند

CORS برای برقراری ارتباط بین سرور و مرورگر به هدرهای HTTP خاص متکی است. این سربرگ ها تعیین می کنند که آیا مرورگر باید درخواست را مسدود کند یا اجازه دهد تا ادامه یابد. در اینجا سرفصل های کلیدی CORS آمده است:

• Access-Control-Allow-Origin: این هدر مشخص می کند که کدام مبدأ (ها) مجاز به دسترسی به منبع هستند. می توان آن را روی یک مبدا خاص تنظیم کرد، مانند https://example.com، یا * اجازه دادن به همه مبداها (هر چند با استفاده از * با مدارک مجاز نیست).
• Access-Control-Allow-Methods: این هدر در پاسخ به یک درخواست پیش از پرواز استفاده می شود تا مشخص کند کدام روش های HTTP هنگام دسترسی به منبع مجاز هستند.
• Access-Control-Allow-Headers: در پاسخ به درخواست قبل از پرواز، این هدر مشخص می کند که کدام سرفصل ها می توانند در درخواست واقعی استفاده شوند.
• Access-Control-Expose-Headers: این هدر به سرورها اجازه می دهد تا سرصفحه هایی را که مرورگرها مجاز به دسترسی به آنها هستند در لیست سفید قرار دهند.
• Access-Control-Allow-Credentials: این هدر نشان می دهد که آیا زمانی که پرچم اعتبارنامه درست است، پاسخ به درخواست قابل نمایش است یا خیر. باید تنظیم شود true اگر کوکی ها یا جزئیات احراز هویت در درخواست دخیل باشد.
• Access-Control-Max-Age: این هدر نشان می دهد که چه مدت می توان نتایج یک درخواست قبل از پرواز را در حافظه پنهان نگه داشت.

درک و اجرای صحیح هدرهای CORS برای ایمن سازی برنامه های کاربردی وب و در عین حال اجازه دادن به درخواست های ضروری متقابل ضروری است. با تنظیم این هدرها، توسعه‌دهندگان می‌توانند درخواست‌های متقاطع مجاز را تنظیم کنند و اطمینان حاصل کنند که فقط منابع قابل اعتماد می‌توانند به منابع وب خود دسترسی داشته باشند.

پیاده سازی CORS

پیاده‌سازی به اشتراک‌گذاری منابع متقاطع (CORS) برای برنامه‌های کاربردی وب مدرن که با منابع در منابع مختلف تعامل دارند، ضروری است. این بخش نحوه فعال کردن CORS را در برنامه‌های خود، اشکال‌زدایی خطاهای رایج CORS و تشریح بهترین روش‌ها برای توسعه‌دهندگان وب را بررسی می‌کند.

فعال کردن CORS در برنامه های شما: راهنمای گام به گام

فعال کردن CORS شامل پیکربندی سرور شما برای ارسال هدرهای CORS مناسب در پاسخ به درخواست‌ها است. این فرآیند بسته به فناوری سرور (به عنوان مثال، Apache، Nginx، Node.js) که استفاده می کنید، متفاوت است. در اینجا نحوه فعال کردن CORS در محیط های مختلف سرور آورده شده است:

• آپاچی: برای سرورهای آپاچی، می توانید CORS را با افزودن دستورالعمل های زیر به خود فعال کنید .htaccess فایل پیکربندی فایل یا سرور:

<IfModule mod_headers.c>
    Header set Access-Control-Allow-Origin "*"
    Header set Access-Control-Allow-Methods "POST, GET, OPTIONS, DELETE, PUT"
    Header set Access-Control-Allow-Headers "Content-Type, Access-Control-Allow-Headers, Authorization, X-Requested-With"
</IfModule>

این پیکربندی به همه مبداها اجازه می دهد (*) برای درخواست با استفاده از متدها و هدرهای مشخص شده. تنظیم Access-Control-Allow-Origin ارزش برای محدود کردن دسترسی به منابع قابل اعتماد.

• Nginx: در Nginx، CORS را می توان با افزودن موارد زیر به بلوک سرور خود فعال کرد:

location / {
    if ($request_method = 'OPTIONS') {
        add_header 'Access-Control-Allow-Origin' '*';
        add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, DELETE, PUT';
        add_header 'Access-Control-Allow-Headers' 'Content-Type, Access-Control-Allow-Headers, Authorization, X-Requested-With';
        add_header 'Content-Length' '0';
        add_header 'Content-Type' 'text/plain charset=UTF-8';
        return 204;
    }
    add_header 'Access-Control-Allow-Origin' '*';
    add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, DELETE, PUT';
    add_header 'Access-Control-Allow-Headers' 'Content-Type, Access-Control-Allow-Headers, Authorization, X-Requested-With';
}

• Node.js (اکسپرس): برای برنامه های Node.js با استفاده از Express، CORS را می توان به راحتی با استفاده از آن فعال کرد cors میان افزار:

const express = require('express');
const cors = require('cors');

const app = express();

app.use(cors({
    origin: '*', // Adjust this to your specific origin
    methods: ['GET', 'POST', 'OPTIONS', 'DELETE', 'PUT'],
    allowedHeaders: ['Content-Type', 'Access-Control-Allow-Headers', 'Authorization', 'X-Requested-With'],
}));

app.get('/data', (req, res) => {
    res.json({ message: 'This is CORS-enabled for all origins!' });
});

app.listen(3000, () => {
    console.log('Server running on port 3000');
});

اشکال زدایی خطاهای معمول CORS: نکات و ترفندها

خطاهای CORS معمولاً زمانی رخ می دهد که مرورگر یک درخواست را به دلیل خط مشی CORS سرور مسدود می کند. خطاهای رایج شامل پیام هایی در مورد گم شدن است Access-Control-Allow-Origin هدرها یا روش ها مجاز نیستند برای رفع اشکال این خطاها:

1. از ابزارهای توسعه دهنده مرورگر استفاده کنید: مرورگرهای مدرن پیام های خطای مفصلی را در کنسول ارائه می دهند. این پیام‌ها اغلب نشان می‌دهند که چه چیزی گم شده یا پیکربندی نادرست است.
2. پیکربندی سرور را بررسی کنید: مطمئن شوید که سرور شما به درستی پیکربندی شده است تا سرصفحه های CORS لازم را ارسال کند. از دست دادن هدرها یا مقادیر نادرست از مشکلات رایج هستند.
3. تست با ابزار: ابزارهایی مانند Postman یا cURL می‌توانند درخواست‌هایی را از مبداهای مختلف شبیه‌سازی کنند و به تشخیص اینکه آیا سرور با هدرهای CORS درست پاسخ می‌دهد یا خیر کمک می‌کنند.
4. سیاست CORS را مرور کنید: مطمئن شوید که خط مشی CORS شما در سرور با الزامات برنامه وب شما مطابقت دارد. به عنوان مثال، اگر برنامه شما نیاز به ارسال اعتبار (کوکی ها، احراز هویت HTTP) دارد، مطمئن شوید Access-Control-Allow-Credentials تنظیم شده است true و Access-Control-Allow-Origin تنظیم نشده است *.

بهترین روش های پیکربندی CORS برای توسعه دهندگان وب

پیاده سازی CORS به طور ایمن و کارآمد مستلزم رعایت بهترین شیوه ها است:

• Exact Origins را مشخص کنید: بجای استفاده از * برای Access-Control-Allow-Origin، مبداهای دقیقی را که باید اجازه دسترسی به منابع شما را داشته باشند، مشخص کنید. این قرار گرفتن در معرض درخواست‌های متقابل ناخواسته را محدود می‌کند.
• از اعتبارنامه ها با دقت استفاده کنید: اگر برنامه شما از اعتبارنامه استفاده می کند، مطمئن شوید Access-Control-Allow-Credentials تنظیم شده است trueو به جای آن، مبدا دقیق را مشخص کنید *. به یاد داشته باشید که اعتبارنامه ها شامل کوکی ها، احراز هویت HTTP، و گواهی های SSL سمت سرویس گیرنده است.
• هدرهای در معرض دید را محدود کنید: فقط هدرهای لازم را از طریق نمایش دهید Access-Control-Expose-Headers. افشای بیش از حد هدرها می تواند به طور ناخواسته اطلاعات حساس را درز کند.
• اعتبارسنجی مدت زمان کش قبل از پرواز: استفاده کنید Access-Control-Max-Age برای ذخیره پاسخ های قبل از پرواز، کاهش تعداد درخواست های قبل از پرواز. با این حال، مطمئن شوید که مدت زمان ممکن است با تعداد دفعاتی که ممکن است خط مشی CORS شما تغییر کند مطابقت دارد.
• سیاست های دینامیک CORS را اجرا کنید: برای کاربردهای پیچیده تر، اجرای سیاست های CORS پویا که تنظیم می شوند را در نظر بگیرید Access-Control-Allow-Origin بر اساس منشاء درخواست این کار را می توان به صورت برنامه نویسی بر روی سرور انجام داد.
• به طور منظم سیاست های CORS را مرور کنید: همانطور که برنامه وب شما تکامل می یابد، به طور منظم خط مشی های CORS خود را بررسی و به روز کنید تا مطمئن شوید که همچنان الزامات امنیتی و عملکردی شما را برآورده می کنند.

با پیروی از این دستورالعمل‌ها و درک نحوه پیکربندی و اشکال‌زدایی CORS، توسعه‌دهندگان می‌توانند اطمینان حاصل کنند که برنامه‌های کاربردی وب خود به طور ایمن و مؤثر در سراسر مبدا ارتباط برقرار می‌کنند.

CORS در عمل

پیاده‌سازی اشتراک‌گذاری منابع متقاطع (CORS) فقط در مورد فعال کردن یک ویژگی نیست. این در مورد درک نحوه عملکرد آن در زمینه برنامه های کاربردی وب مدرن است. این بخش نمونه‌های واقعی CORS، مدیریت سیاست‌های CORS و ابزارها و تکنیک‌های پیاده‌سازی مؤثر را بررسی می‌کند.

نمونه‌های واقعی CORS: از تئوری تا عمل

CORS بخش اساسی توسعه وب است که به منابع اجازه می دهد تا به طور ایمن از منابع مختلف درخواست شوند. در اینجا چند سناریو در دنیای واقعی وجود دارد که در آن CORS نقش مهمی ایفا می کند:

• مصرف API در برنامه های تک صفحه ای (SPA): SPA ها اغلب API هایی را مصرف می کنند که در دامنه های مختلف میزبانی می شوند. به عنوان مثال، یک برنامه React ارائه شده از https://myapp.com ممکن است نیاز به واکشی داده های کاربر از https://api.userdata.com. بدون CORS، این درخواست متقاطع توسط مرورگر مسدود می شود. با تنظیم هدرهای CORS مناسب (Access-Control-Allow-Origin: https://myapp.com) در سرور API، SPA می تواند به طور ایمن داده های مورد نیاز را درخواست کند.

// Example fetch request in an SPA
fetch("https://api.userdata.com/user", {
  method: "GET",
  headers: {
    "Content-Type": "application/json",
  },
})
.then(response => response.json())
.then(data => console.log(data))
.catch(error => console.error('Error fetching user data:', error));

• شبکه های تحویل محتوا (CDN): CDN ها دارایی های ثابت (تصاویر، اسکریپت ها، شیوه نامه ها) را از مکان های مختلف در سراسر جهان ارائه می کنند. زمانی که برنامه وب شما میزبانی می شود https://example.com درخواست تصویر از https://cdn.example.com، CORS تضمین می کند که این درخواست های متقاطع برای دارایی های ثابت به طور ایمن رسیدگی می شود.
• ویجت ها و ادغام های شخص ثالث: وب‌سایت‌ها اغلب ویجت‌های شخص ثالث (مانند چت‌بات‌ها، فیدهای رسانه‌های اجتماعی) را که نیاز به دسترسی به منابع از سرورهای خارجی دارند، یکپارچه می‌کنند. CORS این ابزارک ها را قادر می سازد تا به طور یکپارچه در سرچشمه های مختلف کار کنند و تجربه کاربر را بدون به خطر انداختن امنیت افزایش دهند.

مدیریت سیاست‌های CORS: ابزارها و تکنیک‌های پیاده‌سازی مؤثر

مدیریت موثر سیاست های CORS مستلزم درک ابزارها و تکنیک های در اختیار شما است:

• پیکربندی سرور: اولین گام در مدیریت سیاست های CORS پیکربندی وب سرور شما است. این شامل تنظیم هدرهای CORS لازم بر اساس نیازهای برنامه شما است. اکثر وب سرورها (Apache، Nginx، IIS) به شما این امکان را می دهند که این هدرها را در فایل های پیکربندی خود یا از طریق htaccess. (برای Apache) مشخص کنید.
• میان افزار برای چارچوب های وب: اگر از یک چارچوب وب استفاده می کنید (Express.js برای Node.js، جنگو برای Python)، بسیاری از آنها بسته های میان افزاری را ارائه می دهند که مدیریت خط مشی CORS را ساده می کند. به عنوان مثال cors بسته برای Express به شما امکان می دهد تا سیاست های CORS را مستقیماً در کد برنامه خود تعریف کنید.

// Example using the cors middleware in an Express.js application
const cors = require('cors');
const express = require('express');
const app = express();

// Define CORS options
const corsOptions = {
  origin: 'https://example.com',
  optionsSuccessStatus: 200,
};

app.use(cors(corsOptions));

app.get('/data', (req, res) => {
  res.json({ message: 'CORS-enabled route' });
});

app.listen(3000, () => console.log('Server running on port 3000'));

• هندلینگ CORS دینامیک: برای برنامه هایی که نیاز به اجازه درخواست از چندین منبع قابل اعتماد دارند، مدیریت CORS پویا می تواند پیاده سازی شود. این شامل تنظیم برنامه ای است Access-Control-Allow-Origin هدر بر اساس مبدا درخواست ورودی.

// Example of dynamic CORS handling
app.use((req, res, next) => {
  const allowedOrigins = ['https://example.com', 'https://api.example.com'];
  const origin = req.headers.origin;
  if (allowedOrigins.includes(origin)) {
    res.setHeader('Access-Control-Allow-Origin', origin);
  }
  next();
});

ابزارهایی برای تست و رفع اشکال سیاست های CORS

• ابزارهای توسعه دهنده مرورگر: برگه شبکه در ابزارهای توسعه دهنده مرورگر برای بررسی خطاهای CORS و درک نحوه ارسال و دریافت هدرهای CORS در زمان واقعی بسیار ارزشمند است.
• ابزارهای آنلاین: ابزارهایی مانند تستر CORS و پستچی به شما امکان می دهد با ارسال درخواست هایی از مبداهای مختلف به سرور خود و بررسی پاسخ، سیاست های CORS را آزمایش کنید.
• ابزارهای خط فرمان: curl یک ابزار قدرتمند برای آزمایش سیاست های CORS از خط فرمان است. می توان از آن برای شبیه سازی درخواست ها از مبداهای مختلف و بازرسی هدرهای CORS در پاسخ سرور استفاده کرد.

# Example curl command to test CORS
curl -H "Origin: https://example.com" \
     -I https://api.example.com/data

با درک این برنامه‌های کاربردی دنیای واقعی و استراتژی‌های مدیریت، توسعه‌دهندگان می‌توانند اطمینان حاصل کنند که برنامه‌های کاربردی وب خود به طور ایمن با منابع در سرتاسر مبدا تعامل دارند، و از CORS با پتانسیل کامل خود استفاده می‌کنند.

خواه درخواست‌های API متقاطع را در SPA‌ها فعال کند، به دارایی‌ها از طریق CDN ها ارائه دهد یا ویجت‌های شخص ثالث را ادغام کند، CORS بخشی ضروری از اکوسیستم وب مدرن است که وقتی به درستی مدیریت می‌شود، هم امنیت و هم عملکرد را فراهم می‌کند.

مفاهیم امنیتی CORS

اجرای اشتراک منابع متقاطع (CORS) پیامدهای امنیتی قابل توجهی برای برنامه های کاربردی وب دارد. در حالی که CORS برنامه های وب را قادر می سازد تا منابعی را از مبداهای مختلف درخواست کنند، در صورت عدم پیکربندی صحیح، آسیب پذیری های احتمالی را نیز معرفی می کند.

این بخش به جنبه‌های امنیتی CORS می‌پردازد و بر کاهش حملات Cross-Site Scripting (XSS) و اهمیت سیاست‌های سخت CORS تأکید می‌کند.

CORS و امنیت وب: کاهش حملات Cross-Site Scripting (XSS).

حملات اسکریپت نویسی متقابل (XSS) به مهاجمان اجازه می دهد تا اسکریپت های مخرب را به محتوای وب سایت هایی که در غیر این صورت خوش خیم و قابل اعتماد هستند تزریق کنند.

این حملات زمانی اتفاق می‌افتند که یک برنامه شامل داده‌های غیرقابل اعتماد در یک صفحه وب بدون اعتبارسنجی یا فرار مناسب باشد و مهاجمان را قادر می‌سازد تا اسکریپت‌ها را در زمینه مرورگر قربانی اجرا کنند. CORS در کاهش حملات XSS با کنترل اینکه کدام مبدا مجاز به تعامل با برنامه وب شما است، بسیار مهم است.

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

بدون پاکسازی مناسب محتوا و سیاست سختگیرانه CORS، این برنامه می‌تواند به یک بردار برای حملات XSS تبدیل شود. CORS مستقیماً از XSS جلوگیری نمی کند، اما با اطمینان از اینکه فقط مبداهای مشخص می توانند درخواست هایی را برای برنامه شما ارسال کنند و سطح حمله را کاهش می دهد، به یک استراتژی امنیتی گسترده تر کمک می کند.

به عنوان مثال، برنامه شما را فرض کنید https://safe-app.com از یک API میزبانی شده در استفاده می کند https://api.safe-app.com. با تنظیم Access-Control-Allow-Origin سربرگ به https://safe-app.com، مطمئن می شوید که فقط درخواست هایی که از برنامه شما منشا می گیرند می توانند به API دسترسی داشته باشند. این محدودیت با محدود کردن تعامل با API شما به مبداهای قابل اعتماد، به کاهش حملات احتمالی XSS کمک می کند.

Access-Control-Allow-Origin: https://safe-app.com

با این حال، ترکیب سیاست‌های CORS با سایر روش‌های امنیتی، مانند اعتبارسنجی و پاک‌سازی ورودی کاربر، برای کاهش مؤثر XSS و انواع دیگر حملات، بسیار مهم است.

اهمیت سیاست های سختگیرانه CORS: محافظت از برنامه های کاربردی وب شما

اجرای سیاست های سختگیرانه CORS برای محافظت از برنامه های کاربردی وب شما در برابر تهدیدات امنیتی مختلف حیاتی است. سیاست CORS سهل‌انگیز، مانند تنظیم Access-Control-Allow-Origin به *، می تواند برنامه شما را در معرض سرقت داده ها، حملات CSRF و سایر آسیب پذیری ها قرار دهد و به هر منبعی اجازه دهد تا درخواست هایی را به سرور شما ارسال کند.

یک خط‌مشی سختگیرانه CORS مشخص می‌کند که کدام مبدا، روش‌ها و سرصفحه‌ها مجاز هستند. این ویژگی تضمین می‌کند که فقط برنامه‌های کاربردی وب قابل اعتماد می‌توانند با منابع شما تعامل داشته باشند و لایه‌ای از امنیت را فراهم می‌کند که به محافظت از داده‌های حساس و یکپارچگی برنامه کمک می‌کند.

به عنوان مثال، برنامه‌ای را در نظر بگیرید که اجازه دسترسی از یک دامنه خاص را می‌دهد و از اعتبارنامه‌ها (کوکی‌ها، احراز هویت HTTP) استفاده می‌کند:

Access-Control-Allow-Origin: https://trusted-domain.com
Access-Control-Allow-Credentials: true

این پیکربندی اجازه می دهد https://trusted-domain.com درخواست هایی با اعتبارنامه به برنامه خود ارائه دهید، در حالی که درخواست هایی از مبداهای دیگر رد می شود. این محدودیت برای برنامه‌هایی که اطلاعات حساس را مدیریت می‌کنند یا اقداماتی را از طرف کاربر انجام می‌دهند بسیار مهم است.

علاوه بر این، مشخص کردن روش‌ها و هدرهای مجاز، امنیت را بیشتر تقویت می‌کند:

Access-Control-Allow-Methods: GET, POST
Access-Control-Allow-Headers: Content-Type, X-Custom-Header

این تنظیمات تضمین می‌کند که فقط درخواست‌های GET و POST با هدرهای مشخص شده پذیرفته می‌شوند و خطر درخواست‌های غیرمجاز یا مخرب را کاهش می‌دهد.

بهترین روش ها برای اجرای ایمن CORS

1. مبدا مجاز را مشخص کنید: همیشه به جای استفاده از حروف عام، مبداهای خاصی را تعریف کنید *. این عمل تضمین می‌کند که فقط دامنه‌های قابل اعتماد می‌توانند برای برنامه شما درخواست ارسال کنند.
2. محدود کردن دسترسی با اعتبار: هنگام اجازه دادن به اعتبارنامه محتاط باشید. اطمینان حاصل کنید که Access-Control-Allow-Credentials تنظیم شده است true فقط در صورت لزوم و منشاء به صراحت تعریف شده است.
3. متدها و هدرهای مجاز را تعریف کنید: مشخص کنید کدام متدها و هدرها مجاز هستند. این محدودیت نه تنها امنیت را تشدید می کند، بلکه مستندات واضحی را برای توسعه دهندگانی که با API شما در تعامل هستند فراهم می کند.
4. از درخواست های قبل از پرواز استفاده کنید: از درخواست‌های قبل از پرواز برای تأیید درخواست‌های مبدا متقابل قبل از پذیرش آنها استفاده کنید. درخواست‌های قبل از پرواز یک لایه تأیید اضافی اضافه می‌کنند و اطمینان می‌دهند که درخواست واقعی با خط‌مشی CORS شما مطابقت دارد.
5. به طور منظم سیاست های CORS را مرور کنید: همانطور که برنامه شما تکامل می یابد، به طور منظم خط مشی های CORS خود را بررسی و به روز کنید تا تغییرات در معماری برنامه شما و تعاملات دامنه را منعکس کند.
6. CORS را با سایر اقدامات امنیتی ترکیب کنید: CORS باید بخشی از یک استراتژی امنیتی جامع باشد. خط‌مشی‌های CORS را با خط‌مشی‌های امنیتی محتوا (CSP)، اعتبارسنجی ورودی، کدگذاری خروجی و سایر بهترین شیوه‌های امنیتی برای محافظت در برابر XSS و سایر آسیب‌پذیری‌های وب ترکیب کنید.

با درک مفاهیم امنیتی CORS و اجرای سیاست‌های سختگیرانه CORS، توسعه‌دهندگان می‌توانند از برنامه‌های کاربردی وب خود در برابر حملات متقاطع محافظت کنند و در عین حال تعاملات متقابل لازم را که برنامه‌های کاربردی وب مدرن به آن نیاز دارند، فعال کنند.

موضوعات پیشرفته CORS

با افزایش پیچیدگی برنامه های کاربردی وب، درک تفاوت های ظریف به اشتراک گذاری منابع متقابل (CORS) اهمیت فزاینده ای پیدا می کند. این بخش به بررسی موضوعات پیشرفته CORS، از جمله امنیت CORS و API، فراتر از تنظیمات اولیه، و عیب‌یابی مشکلات رایج می‌پردازد.

امنیت CORS و API: اطمینان از ایمن درخواست های متقاطع

APIها ستون فقرات برنامه های کاربردی وب مدرن هستند که تبادل داده و عملکرد را در سرویس های مختلف تسهیل می کنند. CORS با اطمینان از اینکه فقط منابع مجاز می توانند به API شما دسترسی داشته باشند، نقشی اساسی در امنیت API ایفا می کند. در اینجا نحوه افزایش امنیت API توسط CORS آمده است:

• احراز هویت مبتنی بر توکن: بسیاری از API ها از احراز هویت مبتنی بر نشانه (به عنوان مثال، OAuth 2.0، JWT) برای دسترسی ایمن استفاده می کنند. خط‌مشی‌های CORS باید به دقت پیکربندی شوند تا هدرهای توکن، مانند Authorization، از مبداهای مورد اعتماد. مثلا اجازه دادن Authorization هدر در درخواست‌های متقاطع، سرور شما باید به صراحت آن را فهرست کند Access-Control-Allow-Headers.

Access-Control-Allow-Headers: Authorization

• مصرف API شخص ثالث: وقتی برنامه وب شما از API های شخص ثالث استفاده می کند، درک سیاست های CORS این API ها بسیار مهم است. اگر API شخص ثالث دارای یک خط مشی محدودکننده CORS است، ممکن است لازم باشد از یک پروکسی سمت سرور در دامنه خود برای ارسال درخواست ها به API استفاده کنید و در نتیجه محدودیت های CORS را دور بزنید.
• افشای هدرهای سفارشی: اگر API شما از هدرهای سفارشی برای اطلاعات خاص برنامه استفاده می کند، این سرصفحه ها باید به طور صریح در معرض مشتری قرار گیرند. Access-Control-Expose-Headers. این به برنامه سمت سرویس گیرنده اجازه می دهد تا مقادیر این هدرها را بخواند.

Access-Control-Expose-Headers: X-My-Custom-Header

فراتر از پایه CORS: پیکربندی پیشرفته و عیب یابی

پیکربندی های پیشرفته CORS می توانند سناریوهای پیچیده تری را بررسی کنند:

• اعتبارسنجی مبدأ پویا: برای برنامه هایی که نیاز به اجازه درخواست از یک مجموعه پویا از مبدا دارند (به عنوان مثال، برنامه های کاربردی چند مستاجر که هر مستاجر دامنه خاص خود را دارد)، اجرای اعتبارسنجی مبدا پویا ضروری است. این شامل بررسی برنامه‌ای است Origin هدر در برابر لیستی از مبداهای مجاز و تنظیم آن Access-Control-Allow-Origin بر این اساس سربرگ کنید.

const allowedOrigins = ['https://tenant1.example.com', 'https://tenant2.example.com'];
const origin = request.headers.origin;
if (allowedOrigins.includes(origin)) {
    response.setHeader('Access-Control-Allow-Origin', origin);
}

• CORS برای WebSockets: در حالی که WebSocket ها مانند درخواست های HTTP مشمول CORS نیستند، ایمن کردن اتصالات WebSocket بسیار مهم است. اطمینان از اینکه درخواست اولیه WebSocket handshake (که یک درخواست HTTP است) شامل اعتبار سنجی CORS مناسب است، یک عمل خوب است.
• بهینه سازی کش قبل از پرواز: Access-Control-Max-Age از هدر می توان برای تعیین مدت زمان ذخیره شدن نتایج یک درخواست قبل از پرواز استفاده کرد. بهینه سازی این مقدار بر اساس تعداد دفعات تغییرات سیاست CORS شما می تواند تعداد درخواست های قبل از پرواز را کاهش دهد و عملکرد برنامه را بهبود بخشد.

Access-Control-Max-Age: 86400

عیب یابی مشکلات رایج CORS

حتی با راه اندازی مناسب CORS، ممکن است مشکلاتی ایجاد شود. در اینجا راهکارهایی برای عیب یابی مشکلات رایج CORS آورده شده است:

• سرصفحه های CORS وجود ندارد یا نادرست است: مطمئن شوید که سرور شما برای ارسال سرصفحه های CORS مورد انتظار به درستی پیکربندی شده است. ابزارهایی مانند curl می توان برای بازرسی دستی هدرها استفاده کرد:

curl -I -H "Origin: https://example.com" https://api.example.com/resource

• پاسخ های مات در JavaScript Fetch API: هنگام درخواست با Fetch API، یک پاسخ غیر شفاف (پاسخی از یک درخواست no-cors) می تواند منجر به مشکلاتی شود زیرا نوع اطلاعاتی را که می توانید در مورد پاسخ به آن دسترسی داشته باشید محدود می کند. مطمئن شوید که تنظیم نمی کنید mode: 'no-cors' در درخواست های Fetch API شما مگر اینکه کاملا ضروری باشد.
• خطاهای CORS با اعتبارنامه: اگر درخواست های شما شامل اعتبار (کوکی ها، احراز هویت HTTP) است، اطمینان حاصل کنید Access-Control-Allow-Credentials تنظیم شده است true، و آن Access-Control-Allow-Origin عام نیست (*).
• اشکال زدایی درخواست های قبل از پرواز: اگر درخواست‌های قبل از پرواز با شکست مواجه شدند، بررسی کنید که سرور شما مدیریت می‌کند OPTIONS به درستی درخواست می کند و با هدرهای CORS مناسب پاسخ می دهد (Access-Control-Allow-Methods, Access-Control-Allow-Headers).

با غواصی در این موضوعات پیشرفته CORS، توسعه دهندگان می توانند بهتر بفهمند که چگونه برنامه های وب خود را برای به اشتراک گذاری منابع متقاطع ایمن و بهینه کنند. چه با امنیت API سر و کار داشته باشید، چه تنظیمات پیچیده CORS، یا عیب یابی مسائل چالش برانگیز CORS، درک عمیق CORS برای توسعه وب مدرن ضروری است.

نتیجه

درک CORS برای تعاملات وب ایمن ضروری است. اجرای صحیح آن، برنامه ها را در برابر نفوذها تقویت می کند، خط مشی سختگیرانه آن در برابر حملات XSS دفاع می کند و کاوش در موضوعات پیشرفته توسعه وب را بهینه می کند.