我的問題很簡單，我通過我的 API 獲取資料，所以我可以對 vueJS 做出什么最好和最合適的方法，以便每當我的資料庫發生變化時，它會自動更新給用戶，而無需重繪 頁面
例子：
用戶進入我的網站，看到第一個用戶的名字Alex當時Alex改成了他的名字Jone，它在資料庫上被改變了我如何讓 vueJS 自動更新他看到名字的第一個用戶的頁面Alex
這是我的代碼：
<template>
<div class="w-50">
<table class="table ">
<thead>
<tr>
<th scope="col"></th>
<th scope="col"></th>
</tr>
</thead>
<tbody>
<tr v-for="user in users" v-bind:key="user.UID">
<td>{{ user.name }}</td>
<td>{{ user.timer }}</td>
</tr>
</tbody>
</table>
</div>
</template>
<script>
export default {
data() {
return {
users: [],
user: {
UID: '',
isActive: ''
}
};
},
mounted() {
axios.get('/Myusers')
.then(res => {
this.name = res.data;
console.log(res.data);
})
}
}
</script>
在不給服務器帶來壓力的情況下，讓 VueJS 觀察或觀察資料庫的任何變化的最佳方法是什么？
uj5u.com熱心網友回復：
如果您需要通過實作廣播事件在 API 和前端應用程式之間進行實時通信，我建議使用 WebSockets ，但要小心：
如果您選擇開源替代方案，例如laravel-websockets，您將為使用大約 400Mb RAM 的 WS 服務器提供服務。這個包實作了統計和除錯儀表板，使您的服務器過載。此外，實作并不容易：在部署到生產環境時會遇到一些 SSL 問題，并且在嘗試將前端應用程式連接到套接字時會遇到很多麻煩。
我假設您的大多數資料庫操作都很關鍵，并且您不希望 API 和前端應用程式之間缺少通信，因此您需要使用佇列來確保正確完成廣播，或者，如果不是，則嘗試重試。
話雖如此，您必須意識到您將需要作業人員來處理佇列，這將消耗一些服務器 RAM，具體取決于您擁有的作業人員數量。
根據我的經驗，一個小的 DigitalOcean droplet（1CPU 1GB RAM）對于我的 API 來說是不夠的，這很瘋狂，因為根本沒有復雜的演算法。
最后，我決定使用pusher-channels，它有一個免費計劃，可能也足以滿足您的目的。集成非常簡單，我已經顯著降低了服務器壓力。
IMO，您可以實作 laravel-websockets，但要注意服務器規范，或者只是使用建議的 laravel 方式和 pusher。
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/372561.html