Для связи фронтенд-проекта на React с фреймворком Yii2 вы можете использовать RESTful API.
1. Создайте контроллер в Yii2, который будет обрабатывать запросы от React. Например, `ApiController.php`.
2. В контроллере определите методы для обработки различных запросов от React. Эти методы будут возвращать данные в формате JSON. Например:
```php
class ApiController extends \yii\rest\Controller
{
public function actionGetData()
{
return [
'data' => 'Hello React!'
];
}
}
```
3. Настройте маршруты в файле конфигурации Yii2 (`config/web.php`). Например:
```php
return [
'components' => [
// ...
'urlManager' => [
'enablePrettyUrl' => true,
'showScriptName' => false,
'rules' => [
['class' => 'yii\rest\UrlRule', 'controller' => 'api'],
],
],
// ...
],
];
```
4. В вашем фронт-проекте на React создайте компоненты или сервисы для вызова API-методов Yii2. Вы можете использовать стандартный `fetch` или библиотеки, такие как `axios` или `fetch`.
5. В компонентах или сервисах ваших компонентов на React выполните запросы к API-методам Yii2. Например:
```javascript
import axios from 'axios';
class ApiClient {
getData() {
return axios.get('/api/get-data')
.then(response => response.data)
.catch(error => {
console.error('API request error:', error);
throw error;
});
}
}
export default ApiClient;
```
Вызовите этот метод в вашем React-компоненте и используйте полученные данные.
Важно убедиться, что ваши сервер и клиент работают на разных портах, чтобы избежать ошибок политики одного источника (CORS).
Это пример базовой интеграции между React и Yii2, и в зависимости от вашей задачи может потребоваться более сложная интеграция с обменом данными между React и Yii2. В таком случае вы можете рассмотреть использование библиотеки, такой как `redux` или `mobx`, для управления состоянием данных на фронтенде и работы с API.
Надеюсь, это поможет вам интегрировать ваш фронт-проект на React с Yii2!