Я работаю в системе уведомлений с React Native и Symfony. Я настроил Mercure с docker для обработки фронтальной подписки на обновления в реальном времени: файл .env:
###> symfony/mercure-bundle ###
# See https://symfony.com/doc/current/mercure.html#configuration
MERCURE_PUBLISH_URL=http://mercure.localhost/.well-known/mercure
# The default token is signed with the secret key: !ChangeMe!
MERCURE_JWT_TOKEN=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJtZXJjdXJlIjp7InB1Ymxpc2giOlsiKiJdfX0.9-LscFk3QfdDtZ4nyg6BiH4_qDm6pbYHydURBMsDgEc
###< symfony/mercure-bundle ###
mercure.yaml:
mercure:
enable_profiler: '%kernel.debug%'
hubs:
default:
url: '%env(MERCURE_PUBLISH_URL)%'
jwt: '%env(MERCURE_JWT_TOKEN)%'
Я создал компонент Уведомления в своем Реагируйте на приложение Native, и я использую код в официальной документации symfony mercure: https://symfony.com/doc/4.3/mercure.html#subscribing Уведомления. js код:
import React, { Component } from 'react';
import { View, Text } from 'react-native';
export default class Notifications extends Component {
constructor(props) {
super(props);
this.state = {
};
}
componentDidMount() {
const url = new URL('http://mercure.localhost/.well-known/mercure');
url.searchParams.append('topic', 'http://dev.api.partage-mandats.proprietes-privees.com/mandate_shares/{id}');
url.searchParams.append('topic', 'http://example.com/books/1');
const eventSource = new EventSource(url);
eventSource.onmessage = e => console.log(e);
}
render() {
return (
<View>
<Text> Notifications </Text>
</View>
);
}
}
Я тестировал с Postan и получаю действительный ответ:
И я попробовал javaScript код в html файле для тестирования:
<script type="text/javascript">
const url = new URL('http://mercure.localhost/.well-known/mercure');
url.searchParams.append('topic', 'http://dev.api.partage-mandats.proprietes-privees.com/mandate_shares/{id}');
url.searchParams.append('topic', 'http://example.com/books/1');
const eventSource = new EventSource(url);
eventSource.onmessage = e => console.log(e);
</script>
</html>
И я получил реальный время отклика при выполнении запроса с почтальоном: Моя проблема заключается в том, что URL, searchParams и eventSource не совместимы с реагировать нативно. Как я могу преобразовать этот javaScript код, чтобы он реагировал на собственный действительный код? Я попытался установить несколько библиотек: whatwg-url, buffer, response-native-event-source и мой текущий код:
import React, { Component } from 'react';
import { View, Text } from 'react-native';
import { URL, URLSearchParams } from 'whatwg-url';
import { Buffer } from 'buffer';
import RNEventSource from 'react-native-event-source';
export default class Notifications extends Component {
constructor(props) {
super(props);
this.state = {
};
}
componentDidMount() {
global.Buffer = Buffer;
global.URL = URL;
global.URLSearchParams = URLSearchParams;
global.EventSource = RNEventSource;
const url = new global.URL('http://mercure.localhost/.well-known/mercure');
url.global.URLSearchParams.append('topic', 'http://dev.api.partage-mandats.proprietes-privees.com/mandate_shares/{id}');
url.global.URLSearchParams.append('topic', 'http://example.com/books/1');
const eventSource = new global.EventSource(url);
eventSource.onmessage = e => console.log(e);
}
render() {
return (
<View>
<Text> Notifications </Text>
</View>
);
}
}
Я получил эту ошибку: undefined не является объектом (оценивающим 'url. global.URLSearchParams')