Ошибка CORS при взаимодействии с ЮКасса?

Ссылка скопирована
1 ответ

Приветствую. Кто нибудь использовал стороннюю библиотеку @a2seven/yoo-checkout для ЮКасса?
Он почему-то вызывает у меня ошибку политики CORS.

Вот участок кода с настройкой политики:

const corsOptions = {   origin: ['https://api.mydomain.ru','https://admin.mydomain.ru', 'https://app.mydomain.ru','http://localhost:3000', 'http://localhost:3005', 'http://localhost:5173'],    methods: 'GET,POST,PUT,DELETE,PATCH', // разрешенные методы   credentials: true, // Разрешает использование учетных данных (куки, авторизация и т.д.)   optionsSuccessStatus: 200 };   app.use(cors(corsOptions));

const corsOptions = { origin: ['https://api.mydomain.ru','https://admin.mydomain.ru', 'https://app.mydomain.ru','http://localhost:3000', 'http://localhost:3005', 'http://localhost:5173'], methods: 'GET,POST,PUT,DELETE,PATCH', // разрешенные методы credentials: true, // Разрешает использование учетных данных (куки, авторизация и т.д.) optionsSuccessStatus: 200 }; app.use(cors(corsOptions));

Как только я импортирую библиотеку const { YooCheckout } = require('@a2seven/yoo-checkout')
тут же возникает ошибка в консоли браузера
Access to XMLHttpRequest at 'https://api.mydomain.ru/api/branches' from origin 'https://admin.mydomain.ru' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.
И так абсолютно по любому маршруту, а их около сотни.

Причем, на локальной машине все работает корректно, оплаты проходят, веб-хуки от Юкассы приходят, все работает как положено.
Проблема с @a2seven/yoo-checkout именно на сервере. Причем я отключил все, что связано с платежами, оставив только импорт этой библиотеки, ошибка все равно возникает.
Сервер node.js, express, nginx, debian
Клиент react

Дополнительно:

Оказывается я банально забыл установить npm пакеты на сервере после обновления скрипта.
Странно конечно, почему это вызвало ошибку CORS, но сейчас все работает.
Вопрос решен.

Ответы:

У вас в политике не хватает разрешения на OPTIONS, который используется в префлайт-запросах.
https://developer.mozilla.org/en-US/docs/Glossary/...

  • Сделал так:
    const corsOptions = {   origin: ['https://api.mydomain.ru','https://admin.mydomain.ru', 'https://app.mydomain.ru','http://localhost:3000', 'http://localhost:3005', 'http://localhost:5173'],    methods: 'GET,POST,PUT,DELETE,PATCH,OPTIONS', // разрешенные методы   credentials: true, // Разрешает использование учетных данных (куки, авторизация и т.д.)   optionsSuccessStatus: 200 };

    const corsOptions = { origin: ['https://api.mydomain.ru','https://admin.mydomain.ru', 'https://app.mydomain.ru','http://localhost:3000', 'http://localhost:3005', 'http://localhost:5173'], methods: 'GET,POST,PUT,DELETE,PATCH,OPTIONS', // разрешенные методы credentials: true, // Разрешает использование учетных данных (куки, авторизация и т.д.) optionsSuccessStatus: 200 };

    К сожалению проблема осталась

  • crn05, А на OPTIONS даётся правильный ответ? Что в инструментах разработчика в браузере видно?
  • Rsa97, уже решил вопрос, оказывается я npm пакеты на сервере не обновил. Все работает. OPTIONS оставил в методах
Нужно решить такую задачу?

Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.

Заказать помощь
Лучший ответ
1
Андрей PHP Ответ

Проблема с CORS (Cross-Origin Resource Sharing) может возникать при попытке взаимодействия с внешними ресурсами, такими как API ЮКасса. CORS представляет собой механизм, который позволяет веб-страницам запрашивать ресурсы с других доменов, чем тот, с которого была загружена сама страница.

Для решения проблемы с CORS при взаимодействии с ЮКасса, вам необходимо настроить сервер таким образом, чтобы он правильно обрабатывал запросы с других доменов. Вот несколько шагов, которые могут помочь вам решить эту проблему:

1. Добавьте заголовки CORS к ответам сервера. В случае с PHP, вы можете добавить следующий код в ваш скрипт:

header("Access-Control-Allow-Origin: *");
header("Access-Control-Allow-Methods: POST, GET, OPTIONS");
header("Access-Control-Allow-Headers: Content-Type");

header("Access-Control-Allow-Origin: *"); header("Access-Control-Allow-Methods: POST, GET, OPTIONS"); header("Access-Control-Allow-Headers: Content-Type");

2. Убедитесь, что ваш сервер отвечает на запросы preflight (OPTIONS) правильно. Для этого также можно добавить следующий код в ваш скрипт:

if ($_SERVER['REQUEST_METHOD'] == 'OPTIONS') {
    header("Access-Control-Allow-Origin: *");
    header("Access-Control-Allow-Methods: POST, GET, OPTIONS");
    header("Access-Control-Allow-Headers: Content-Type");
    exit;
}

if ($_SERVER['REQUEST_METHOD'] == 'OPTIONS') { header("Access-Control-Allow-Origin: *"); header("Access-Control-Allow-Methods: POST, GET, OPTIONS"); header("Access-Control-Allow-Headers: Content-Type"); exit; }

3. Проверьте, что ваш запрос к API ЮКасса отправляется с правильными заголовками. Убедитесь, что вы используете правильный метод запроса (GET, POST и т.д.) и правильный заголовок Content-Type.

Если после выполнения этих шагов проблема с CORS при взаимодействии с ЮКасса все еще остается, возможно, вам стоит обратиться к документации ЮКасса или к их поддержке за дополнительной помощью.

Другие ответы (0)

Пока нет других ответов. Будьте первым, кто поможет автору.

Ответить на вопрос

комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Вам также может быть интересно