Розуміння спільного використання ресурсів між джерелами (CORS)

Спільне використання ресурсів між джерелами (CORS) було запроваджено Консорціумом всесвітньої павутини (W3C) у 2006 році, щоб надати веб-серверам можливість вказувати будь-які інші джерела (домен, схему або порт), яким дозволено доступ до ресурсів сервера за межами політика того самого походження. Це була значна еволюція в веб-безпеці, яка дозволила створювати більш інтерактивні та інтегровані веб-програми, зберігаючи суворі протоколи безпеки.

Розуміння механіки CORS (Cross-Origin Resource Sharing) має вирішальне значення для сучасної веб-розробки. У цьому розділі розповідається про те, як CORS підвищує веб-безпеку, розрізняє прості запити та запити перед друком і пояснює значення заголовків CORS.

CORS (Cross-Origin Resource Sharing) це механізм, який використовує заголовки HTTP, щоб повідомити браузеру дозволити веб-додатку, що працює в одному джерелі (домене), мати дозвіл на доступ до вибраних ресурсів із сервера в іншому джерелі. Це важливий розвиток у веб-безпеці, оскільки він забезпечує більш відкритий зв’язок між різними веб-сервісами, водночас захищаючи від зловмисних атак.

Як CORS покращує веб-безпеку: Технічне розуміння

CORS — це функція безпеки, яка дозволяє веб-додаткам надсилати запити до серверів, розміщених на інших джерелах, ніж веб-сайт.

До CORS політика того самого походження обмежувала веб-програми надсиланням запитів лише до того самого домену, що й сайт. Хоча ця політика є критично важливим заходом безпеки, що запобігає доступу шкідливих сайтів до конфіденційних даних, вона також обмежує легітимну взаємодію між джерелами, необхідну для сучасних веб-програм.

CORS дозволяє серверам включати спеціальні заголовки, які повідомляють браузеру, яким джерелам дозволено доступ до ресурсів. Ось базовий приклад того, як CORS підвищує безпеку:

Веб-додаток на https://example.com спроби зробити запит до https://api.example.org/data.
Браузер автоматично надсилає запит CORS https://api.example.org/data.
Сервер за адресою https://api.example.org перевіряє свою політику CORS, щоб визначити, чи https://example.com дозволено.
Якщо 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 цільового ресурсу. Попередньо перевірені запити використовуються, якщо метод не 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. Його потрібно встановити на true якщо запит містить файли cookie або деталі автентифікації.
Access-Control-Max-Age: цей заголовок вказує, як довго можуть кешуватися результати запиту перед друком.

Розуміння та правильна реалізація заголовків CORS має важливе значення для захисту веб-додатків, одночасно дозволяючи необхідні перехресні запити. Встановлюючи ці заголовки, розробники можуть точно налаштувати, які запити між джерелами дозволені, забезпечуючи доступ до їхніх веб-ресурсів лише надійним джерелам.

Впровадження CORS

Реалізація спільного використання ресурсів між джерелами (CORS) є важливою для сучасних веб-додатків, які взаємодіють з ресурсами різних джерел. У цьому розділі описано, як увімкнути CORS у ваших програмах, налагодити поширені помилки CORS, а також наведено найкращі практики для веб-розробників.

Увімкнення CORS у ваших програмах: покроковий посібник

Увімкнення CORS передбачає налаштування вашого сервера для надсилання відповідних заголовків CORS у відповідь на запити. Процес залежить від серверної технології (наприклад, Apache, Nginx, Node.js), яку ви використовуєте. Ось як увімкнути CORS у різних серверних середовищах:

Apache: Для серверів Apache ви можете ввімкнути 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 заголовки або методи заборонені. Щоб усунути ці помилки:

Використовуйте Browser DevTools: Сучасні браузери надають докладні повідомлення про помилки в консолі. Ці повідомлення часто вказують на те, чого немає або неправильно налаштовано.
Перевірте конфігурацію сервера: переконайтеся, що ваш сервер правильно налаштований для надсилання необхідних заголовків CORS. Відсутні заголовки або неправильні значення є типовими проблемами.
Тест за допомогою інструментів: Такі інструменти, як Postman або cURL, можуть симулювати запити з різних джерел і допомагати визначити, чи відповідає сервер правильними заголовками CORS.
Перегляньте політику CORS: переконайтеся, що ваша політика CORS на сервері відповідає вимогам вашої веб-програми. Наприклад, якщо ваша програма потребує надсилання облікових даних (файли cookie, HTTP-автентифікація), переконайтеся, що Access-Control-Allow-Credentials встановлено на true і Access-Control-Allow-Origin не встановлено *.

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, Django для 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.

CORS є невід’ємною частиною сучасної веб-екосистеми, яка за умови правильного керування забезпечує як безпеку, так і функціональність.

Наслідки безпеки CORS

Реалізація спільного використання ресурсів між джерелами (CORS) має значні наслідки для безпеки веб-додатків. Хоча CORS дозволяє веб-додаткам запитувати ресурси з різних джерел, він також представляє потенційні вразливості, якщо його не налаштовано належним чином.

У цьому розділі розглядаються аспекти безпеки CORS, підкреслюється пом’якшення атак міжсайтових сценаріїв (XSS) і важливість суворих політик CORS.

CORS і веб-безпека: пом’якшення атак із застосуванням міжсайтових сценаріїв (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. Це обмеження допомагає пом’якшити потенційні атаки XSS, обмежуючи взаємодію з вашим API надійними джерелами.

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

Однак для ефективного пом’якшення XSS та інших типів атак надзвичайно важливо поєднувати політики CORS з іншими методами безпеки, такими як перевірка та дезінфекція введених користувачами даних.

Важливість строгих політик CORS: захист ваших веб-додатків

Впровадження строгих політик CORS є життєво важливим для захисту ваших веб-додатків від різних загроз безпеці. М’яка політика CORS, наприклад налаштування Access-Control-Allow-Origin до *, може піддати вашу програму крадіжці даних, атакам CSRF та іншим уразливостям, дозволяючи будь-якому джерелу надсилати запити до вашого сервера.

Сувора політика CORS визначає, які джерела, методи та заголовки дозволені. Ця особливість гарантує, що лише надійні веб-програми можуть взаємодіяти з вашими ресурсами, забезпечуючи рівень безпеки, який допомагає захистити конфіденційні дані та цілісність програм.

Наприклад, розглянемо програму, яка дозволяє доступ із певного домену та використовує облікові дані (файли cookie, 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

Укажіть дозволені джерела: Завжди вказуйте конкретні джерела, а не використовуйте символ підстановки *. Ця практика гарантує, що лише довірені домени можуть надсилати запити до вашої програми.
Обмежити доступ за допомогою облікових даних: Будьте обережні, дозволяючи облікові дані. Переконайтеся в цьому Access-Control-Allow-Credentials встановлено на true лише тоді, коли це необхідно, і походження чітко визначено.
Визначте дозволені методи та заголовки: укажіть, які методи та заголовки дозволені. Це обмеження не лише посилює безпеку, але й надає чітку документацію для розробників, які взаємодіють із вашим API.
Використовуйте запити перед друком: скористайтеся перевагами попередніх запитів, щоб перевірити запити між джерелами перед їх прийняттям. Запити перед друком додають додатковий рівень перевірки, гарантуючи, що фактичний запит відповідає вашій політиці CORS.
Регулярно переглядайте політику CORS: у міру розвитку програми регулярно переглядайте та оновлюйте свої політики CORS, щоб відобразити зміни в архітектурі програми та взаємодії домену.
Поєднайте CORS з іншими заходами безпеки: CORS має бути частиною комплексної стратегії безпеки. Поєднайте політики CORS із політиками безпеки вмісту (CSP), перевіркою введення, кодуванням виводу та іншими найкращими методами безпеки для захисту від XSS та інших веб-уразливостей.

Розуміючи наслідки CORS для безпеки та впроваджуючи сувору політику CORS, розробники можуть захистити свої веб-додатки від перехресних атак, забезпечуючи при цьому необхідні перехресні взаємодії, які вимагають сучасні веб-додатки.

Розширені теми CORS

У міру того, як веб-програми стають все складнішими, розуміння нюансів спільного використання ресурсів між джерелами (CORS) стає все більш важливим. У цьому розділі розглядаються розширені теми CORS, включаючи безпеку CORS і API, окрім базових конфігурацій і усунення типових проблем.

Безпека CORS та API: забезпечення безпечних запитів між джерелами

API є основою сучасних веб-додатків, полегшуючи обмін даними та функціональність між різними службами. CORS відіграє ключову роль у безпеці API, гарантуючи, що лише авторизовані джерела можуть отримати доступ до вашого API. Ось як CORS підвищує безпеку API:

Аутентифікація на основі маркерів: багато 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: Хоча WebSockets не підпадають під дію CORS так само, як запити HTTP, захист з’єднань WebSocket є надзвичайно важливим. Переконайтеся, що початковий запит рукостискання WebSocket (який є HTTP-запитом) містить належну перевірку CORS, є хорошою практикою.
Оптимізація кешу перед друком: The 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 з обліковими даними: якщо ваші запити містять облікові дані (файли cookie, 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, а вивчення складних тем оптимізує веб-розробку.

Що таке спільне використання ресурсів між джерелами?