Gunakan php untuk membangunkan Websocket untuk melaksanakan fungsi penentududukan peta masa nyata-tutorial php-php.cn

Gunakan php untuk membangunkan Websocket untuk melaksanakan fungsi penentududukan peta masa nyata

WBOY

Lepaskan： 2023-12-17 20:10:01

asal

1197 orang telah melayarinya

Gunakan php untuk membangunkan Websocket untuk melaksanakan fungsi penentududukan peta masa nyata

Tajuk: Menggunakan PHP untuk membangunkan Websocket bagi melaksanakan fungsi penentududukan peta masa nyata

Pengenalan:
Websocket ialah protokol yang melaksanakan sambungan berterusan dan komunikasi dua hala masa nyata, membolehkan penghantaran dan kemas kini data masa nyata. Artikel ini akan menggunakan PHP untuk membangunkan Websocket, digabungkan dengan fungsi penentududukan peta, untuk mencapai fungsi penentududukan peta masa nyata. Proses pelaksanaan kod khusus akan diperkenalkan secara terperinci di bawah.

1. Persediaan

Pasang persekitaran PHP (keperluan versi: PHP 5.3.0+)
Pasang Komposer (alat pengurusan perpustakaan pihak ketiga)

2 , Masukkan direktori di mana projek itu terletak dan laksanakan arahan berikut untuk memasang perpustakaan Ratchet:

composer require cboden/ratchet

Salin selepas log masuk

Selepas pemasangan selesai, salin direktori vendor yang dijana ke direktori akar projek. . kod berikut:

<?php
require 'vendor/autoload.php';

use RatchetMessageComponentInterface;
use RatchetConnectionInterface;
use RatchetServerIoServer;
use RatchetHttpHttpServer;
use RatchetWebSocketWsServer;

class MapLocation implements MessageComponentInterface 
{
 protected $clients;

 public function __construct() {
     $this->clients = new SplObjectStorage;
 }

 public function onOpen(ConnectionInterface $conn) {
     $this->clients->attach($conn);
     echo "New connection! ({$conn->resourceId})
";
 }

 public function onClose(ConnectionInterface $conn) {
     $this->clients->detach($conn);
     echo "Connection closed! ({$conn->resourceId})
";
 }

 public function onMessage(ConnectionInterface $from, $msg) {
     foreach ($this->clients as $client) {
         $client->send($msg);
     }
 }

 public function onError(ConnectionInterface $conn, Exception $e)
 {
     echo "An error occurred: {$e->getMessage()}
";
     $conn->close();
 }
}

$server = IoServer::factory(
 new HttpServer(
     new WsServer(
         new MapLocation()
     )
 ),
 8080
);

$server->run();

Salin selepas log masuk

<!DOCTYPE html>
<html>
<head>
 <meta charset="UTF-8">
 <title>实时地图定位</title>
 <style>
     #map {
         width: 800px;
         height: 600px;
         border: 1px solid #ccc;
     }
 </style>
 <script src="https://cdn.leafletjs.com/leaflet/v1.3.1/leaflet.js"></script>
 <link rel="stylesheet" href="https://cdn.leafletjs.com/leaflet/v1.3.1/leaflet.css" />
</head>
<body>
 <div id="map"></div>

 <script>
     var map = L.map('map').setView([39.9075, 116.39723], 13);
     L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
         maxZoom: 18,
         attribution: 'Map data &copy; OpenStreetMap contributors'
     }).addTo(map);

     var ws = new WebSocket("ws://localhost:8080");

     ws.onmessage = function (event) {
         var data = JSON.parse(event.data);
         var marker;

         if (data.action === 'add') {
             marker = L.marker([data.lat, data.lng]).addTo(map);
         } else if (data.action === 'update') {
             marker = markers[data.id];
             if (marker) {
                 marker.setLatLng([data.lat, data.lng]);
             }
         } else if (data.action === 'remove') {
             marker = markers[data.id];
             if (marker) {
                 map.removeLayer(marker);
             }
         }

         if (marker) {
             markers[data.id] = marker;
         }
     };

     var markers = {};
 </script>
</body>
</html>

Salin selepas log masuk

Buka fail index.html dalam penyemak imbas , dan anda akan melihat antara muka peta.

Anda boleh mensimulasikan kemas kini data yang berbeza dengan mengubah suai data penghantaran dalam kaedah onMessage dalam server.php.

Artikel ini memperkenalkan cara menggunakan PHP untuk membangunkan Websocket dan menggabungkannya dengan fungsi penentududukan peta untuk mencapai fungsi penentududukan peta masa nyata. Dengan menulis kod untuk halaman sebelah pelayan dan muka hadapan, kami boleh mengemas kini maklumat lokasi penanda pada peta dalam masa nyata melalui Websocket. Dalam projek sebenar, lebih banyak fungsi dan interaksi data boleh ditambah mengikut keperluan.

Atas ialah kandungan terperinci Gunakan php untuk membangunkan Websocket untuk melaksanakan fungsi penentududukan peta masa nyata. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!