使用Laravel自动刷新包含谷歌地图的div

Question

我在Laravel视图中有一个div，其中包含来自Google的地图，该视图从MySQL数据库接收一个包含坐标的JSON数组，以便在地图上插入标记，我希望在一定时间后自动刷新div，以防在数据库中输入新记录。

视图首次加载时发送数组的控制器的索引函数：

public function index()
{
if (Auth::guest())
{
return redirect('home');
}
else{
$user = Auth::user();
$data = Reading::where('reg_id', $user->regNumber)->get();
return view('readings.index', ['data'=>$data]);
}
}

页面加载后，准备另一个函数来开始刷新div:

$(document).ready(function(){
setInterval(function(){
$('#map').load('refresh',function () {
initMap(); //function that generates map with markers
});
},20000);
});

这会调用控制器的另一个函数：

public static function refresh()
{
$user = Auth::user();
$data = Reading::where('reg_id', $user->regNumber)->get();
return response()->json(['data'=>$data]);
}

页面加载时一切正常，但当div第一次刷新时，我收到浏览器检查器的警告："主线程上的[Deprecation]同步XMLHttpRequest已被弃用，因为它对最终用户的体验有不利影响https://xhr.spec.whatwg.org/."我看到阵列被多次发送。

显然，我的想法有问题，所以我正试图找到一种正确的方法。

Answer 1

我认为最好的方法是通过ajax请求。

Ajax请求可以返回html，所以您将调用Ajax获取响应并将其放入"旧"div中。