Menggunakan PHP untuk merealisasikan perkongsian lokasi geografi dan paparan fungsi sembang masa nyata-tutorial php-php.cn

Menggunakan PHP untuk merealisasikan perkongsian lokasi geografi dan paparan fungsi sembang masa nyata

WBOY

Lepaskan： 2023-08-26 10:16:02

asal

1296 orang telah melayarinya

Menggunakan PHP untuk merealisasikan perkongsian lokasi geografi dan paparan fungsi sembang masa nyata

Gunakan PHP untuk merealisasikan perkongsian lokasi dan paparan fungsi sembang masa nyata

Dengan perkembangan pesat Internet, pemesejan segera telah menjadi alat yang amat diperlukan dalam kehidupan seharian manusia. Dengan populariti peranti mudah alih dan kemajuan teknologi penentududukan, perkongsian lokasi juga telah menjadi ciri yang popular. Artikel ini akan memperkenalkan cara menggunakan bahasa PHP untuk melaksanakan fungsi sembang masa nyata dan berkongsi serta memaparkan lokasi geografi.

1. Pelaksanaan fungsi sembang masa nyata

Untuk melaksanakan fungsi sembang masa nyata, kita boleh menggunakan teknologi WebSocket. WebSocket ialah protokol komunikasi yang menyediakan komunikasi dua hala penuh dupleks melalui satu sambungan Ia boleh mewujudkan sambungan untuk komunikasi masa nyata antara penyemak imbas dan pelayan.

Pertama, kita perlu mencipta pelayan WebSocket. Dalam PHP, anda boleh menggunakan perpustakaan Ratchet untuk mencipta pelayan WebSocket. Anda boleh menggunakan Composer untuk memasang perpustakaan Ratchet:

composer require cboden/ratchet

Salin selepas log masuk

Kemudian, anda boleh mencipta fail chat-server.php dan menulis kod berikut di dalamnya:

<?php

require 'vendor/autoload.php';

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

class Chat implements MessageComponentInterface {
    protected $connections;

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

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

    public function onMessage(ConnectionInterface $from, $msg) {
        foreach ($this->connections as $connection) {
            if ($from !== $connection) {
                $connection->send($msg);
            }
        }
    }

    public function onClose(ConnectionInterface $conn) {
        $this->connections->detach($conn);
        echo "Connection {$conn->resourceId} has disconnected
";
    }

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

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

$server->run();

Salin selepas log masuk

Dalam kod di atas, kami menggunakan perpustakaan Ratchet untuk mencipta kelas dinamakan Sembang, Dan melaksanakan antara muka MessageComponentInterface. Dalam kaedah onOpen(), kami merekodkan maklumat setiap sambungan dalam kaedah onMessage(), kami menghantar mesej yang diterima ke sambungan lain dalam kaedah onClose(), kami memadamkan Maklumat sambungan yang terputus; kaedah, kami mengendalikan situasi ralat.

Kemudian, kita boleh menjalankan fail chat-server.php dalam terminal untuk memulakan pelayan WebSocket:

php chat-server.php

Salin selepas log masuk

Seterusnya, kita boleh menulis halaman klien menggunakan JavaScript untuk menyambung ke pelayan WebSocket dan menghantar mesej. Cipta fail chat-client.html dan tulis kod berikut di dalamnya:

<!DOCTYPE html>
<html>
<head>
    <title>Chat Client</title>
    <script>
        var conn = new WebSocket('ws://localhost:8080');

        conn.onopen = function(e) {
            console.log("Connection established!");
        };

        conn.onmessage = function(e) {
            console.log("Received: " + e.data);
        };

        function sendMessage() {
            var message = document.getElementById('message').value;
            conn.send(message);
        }
    </script>
</head>
<body>
    <input type="text" id="message" placeholder="Enter message">
    <button onclick="sendMessage()">Send</button>
</body>
</html>

Salin selepas log masuk

Dalam kod di atas, kami mencipta objek WebSocket, dan kemudian menggunakan acara onopen dan onmessage untuk mengendalikan penubuhan sambungan dan menerima mesej. Kami juga mencipta fungsi sendMessage() untuk menghantar mesej.

Buka fail chat-client.html, kita boleh menyambung ke pelayan WebSocket dalam penyemak imbas dan menghantar mesej.

2. Pelaksanaan perkongsian dan paparan lokasi geografi

Untuk merealisasikan perkongsian dan paparan lokasi geografi, kami boleh menggunakan API Geolokasi HTML5 untuk mendapatkan maklumat lokasi geografi peranti. Mula-mula, tambahkan kod berikut pada fail chat-client.html:

navigator.geolocation.getCurrentPosition(function(position) {
    var latitude = position.coords.latitude;
    var longitude = position.coords.longitude;
    var location = "Latitude: " + latitude + ", Longitude: " + longitude;
    conn.send(location);
});

Salin selepas log masuk

Dalam kod di atas, kami memperoleh maklumat lokasi geografi peranti dengan memanggil kaedah getCurrentPosition() dan menghantarnya ke pelayan.

Dalam kelas Sembang sebelah pelayan, kami boleh mengubah suai kaedah onMessage() untuk menerima dan menyiarkan maklumat geolokasi:

public function onMessage(ConnectionInterface $from, $msg) {
    $data = json_decode($msg, true);
    if (isset($data['latitude']) && isset($data['longitude'])) {
        foreach ($this->connections as $connection) {
            if ($from !== $connection) {
                $connection->send($msg);
            }
        }
    } else {
        foreach ($this->connections as $connection) {
            if ($from !== $connection) {
                $connection->send($msg);
            }
        }
    }
}

Salin selepas log masuk

Dalam kod di atas, kami menggunakan fungsi json_decode() untuk menukar mesej yang diterima kepada tatasusunan bersekutu. Jika mesej yang diterima mengandungi medan latitud dan longitud, yang menunjukkan bahawa ini adalah maklumat lokasi geografi, ia akan disiarkan ke sambungan lain jika tidak, mesej itu akan disiarkan ke sambungan lain.

Dalam fail chat-client.html, kami boleh mengubah suai fungsi pengendali acara onmessage untuk menghuraikan maklumat lokasi geografi yang diterima dan memaparkannya pada halaman:

conn.onmessage = function(e) {
    var data = JSON.parse(e.data);
    if (data.latitude && data.longitude) {
        var latitude = data.latitude;
        var longitude = data.longitude;
        // 在地图上展示地理位置
        var map = new google.maps.Map(document.getElementById('map'), {
            center: {lat: latitude, lng: longitude},
            zoom: 12
        });
        var marker = new google.maps.Marker({
            position: {lat: latitude, lng: longitude},
            map: map
        });
    } else {
        console.log("Received: " + e.data);
    }
};

Salin selepas log masuk

Dalam kod di atas, kami menggunakan JSON.parse( ) fungsi kepada Mesej yang diterima dihuraikan ke dalam objek JavaScript. Jika mesej mengandungi medan latitud dan longitud, kami membuat peta Peta Google dan memaparkan lokasi geografi pada peta.

Atas ialah kandungan terperinci Menggunakan PHP untuk merealisasikan perkongsian lokasi geografi dan paparan fungsi sembang masa nyata. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!