如何检查php中的数据库中是否添加了新记录，并将其转换为本地反应(通知消息)

Question

我是react native的新手，我正在创建一个应用程序，该应用程序显示存储在mysql数据库中的播客列表。然后，我使用php获取信息，并将其转换为json格式。一旦信息被覆盖到json中，我就会在react native中获取它，并在平面列表中显示它。

我希望每次更新播客列表时都会出现一个通知。

我使用onesignal设置了通知，并在后端使用node.js创建和发送通知。

我希望每次数据库有新行时都能监听数据库，然后将其转换为react native，这样我就可以发送通知了。

在做了一些研究之后，我一直无法找到解决方案。

这是我的php

<?php

include 'DBConfig.php';
$json = file_get_contents('php://input');
$obj = json_decode($json, true);
$id = $obj['id'];
$query = "SELECT * FROM SermonsTable WHERE Category ='$id'";
$result = mysqli_query($con, $query) or die("Invalid Query");
while($row = mysqli_fetch_assoc($result)){ 
$Item[] = $row;
$json = json_encode($Item);
}

echo $json;
?>

React本机文件

export default class MainScreen extends React.Component 
{
constructor(props) {
super(props);
this.state = {
isLoading: true
}
}
componentDidMount(){
const fetch = require('node-fetch');
fetch('http://03d77927eb6d.ngrok.io/AntrimElimChurch/backend/FilterCat.php', {
method: 'POST',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
},
body: JSON.stringify({

// Getting the id.
id: this.props.navigation.state.params.FlatListClickItemHolder
})
}).then((response) => response.json())
.then((responseJson) => {
this.setState({
isLoading: false,
dataSource: responseJson     
});
}).catch((error) => {
console.error(error);
});
}

FlatListViewItemSeparator = () => {
return (
<View
style={{
height: .5,
width: "100%",
backgroundColor: "#000",
}}
/>
);
}
OpenSecondActivity(id) {
this.props.navigation.navigate("Podcats", { FlatListClickItemHolder: id});
}
componentDidMount() {
this.dataSource.addEventListener('change', this.RunNotification);
}
RunNotification = () => {
fetch('http://localhost:8080/api', {
method: 'GET',
headers: {
'Content-Type': 'application/json',
'Accept': 'application/json'
}
}).then(res => {
console.log(res);
return res.json();
}).then(response => {
console.log(response)
this.data = response;
}).catch(error =>{
this.error = error.message || error.error;
});
};
render() {
if (this.state.isLoading) {
return (
<View style={{flex: 1, paddingTop: 20}}>
<ActivityIndicator />
</View>
);
}
return (
<View style={styles.MainContainer}>
<FlatList style={{paddingTop: 30}}
data={ this.state.dataSource }
ItemSeparatorComponent = {this.FlatListItemSeparator}
renderItem={this._renderItem}
keyExtractor={(item, index) => index.toString()} />
</View>
);
}

_renderItem = ({item}) => {
return(
<View style={styles.MainView}>
<View style={{flex: 1, flexDirection: 'row'}}>
<Text style={styles.rowViewContainer} onPress={this.OpenSecondActivity.bind(this, item.id)}>{item.Name}</Text>
{/* <Text style={styles.SermonByText}>{item.SermonBy}</Text> */}
<Text style={styles.PodcastByText}> - {item.DateRecorded}</Text>
</View>
</View>
);
}

}

我真的很困惑如何做到这一点，因为我是新手，对php没有那么自信。

Answer 1

我建议您使用套接字。

NPM插座.io易于用于前端

对于PHP后端，您可以使用此库https://github.com/walkor/phpsocket.io

因此，每次向数据库中添加新记录时，都必须使用处理程序向客户端发送套接字请求