Ръководство за конфигуриране на CORS за Webhook API в API Designer

Споделянето на ресурси от различни източници (CORS) е механизъм за сигурност на браузъра, който ограничава уеб страниците да отправят заявки към различен домейн от този, който е обслужил уеб страницата. Това се прави, за да се защитят потребителите от злонамерени уебсайтове, които се опитват да получат достъп до чувствителни данни от друг сайт без разрешение.

Overview

API Designer на Vtiger е създаден като мощен инструмент, който служи като работна среда за разработчиците, за да изграждат лесно персонализирани HTTP-базирани API. Тези API могат да бъдат безпроблемно интегрирани с VTAP JavaScript API или външни приложения.

Добавихме функция в API Designer за определяне на разрешени домейни (домейни, които могат да бъдат в белия списък). Само тези домейни в белия списък ще имат право да правят CORS заявки.

Нека научим повече за CORS и неговото приложение.

Цел

Основните цели на активирането на CORS:

  • Позволете сигурна комуникация от различни източници между frontend приложенията и CRM системата.
  • Активирайте извиквания на API на webhook от клиентски приложения или външни портали.
  • Предотвратете грешките на CORS от страна на браузъра.
  • Защитете CRM данните от неоторизирани домейни.

Техническо изпълнение

Когато създавате Webhook API в API Designer, има опция за добавете домейн към конфигурацията. Този домейн представлява източника (уебсайта или приложението), който ще прави заявки или ще получава данни от Vtiger. 

След като домейнът бъде добавен:

  • Втигър ще разрешаване на заявки от друг произход от този домейн.
  • API-то на уеб кукичката ще се стартира успешно получаване на данни от CRM системата.
  • Браузърът ще блокира всички заявки, идващи от домейни, които не са в белия списък.

Тази настройка гарантира, че webhook API може да функционира сигурно по предназначение, без да изисква backend прокси сървъри или заобиколни решения, като същевременно запазва контрол върху това кои домейни могат да взаимодействат с Vtiger.

Пример

Ако уеб приложение, хоствано на https://app.example.com, се опита да изпрати заявка към API на https://api.vtiger.com, браузърът ще блокира заявката, освен ако API изрично не я позволи чрез CORS заглавките.

За да направи това взаимодействие възможно и сигурно, сървърът трябва да отговори със специални заглавки (като Access-Control-Allow-Origin), които казват на браузъра кои източници (домейни) имат разрешение за достъп до него.

В случая с Vtiger, това дава възможност Бял списък на CORS позволява на доверените домейни да взаимодействат с CRM (като например изпращане на заявки за уеб куки или извикване на API), без да бъдат блокирани от браузъра.

Случай за употреба

Имате frontend приложение, хоствано на https://portal.mycompany.com, което трябва да изпраща заявки за webhook API към вашия Vtiger CRM екземпляр на https://crm.mycompany.com.

Проблем

Браузърът блокира заявката поради грешка в CORS: Достъпът за извличане на „https://crm.mycompany.com/webhook“ от произход „https://portal.mycompany.com“ е блокиран от политиката на CORS.

Решение Добавете https://portal.mycompany.com към белия списък на CORS във Vtiger. След това браузърът ще разреши заявката, тъй като отговорът ще включва правилните заглавки.

Ползи

  • Предотвратява свързани с CORS грешки при заявки във фронтенд приложения.
  • Позволява сигурен и контролиран достъп до Vtiger API от надеждни домейни.
  • Поддържа интеграция със съвременни frontend framework-и като React, Angular, Vue и др.
  • Премахва необходимостта от backend прокси сървъри за обработка на API комуникация.
  • Лесно управление и актуализиране чрез администраторския интерфейс.

Вярваме, че тези примери ще подобрят вашето изживяване с Vtiger CRM. Искаме да гарантираме, че разработчиците и потребителите на CRM могат взаимно да споделят информация и знания, за да подобрят функционалността на CRM. 

Очаквайте още. Честито кодиране!

 
 

Регистрирайте се, за да получавате най-новите актуализации!