Isu merentas domain dan penyelesaian protokol WebSocket

Isu merentas domain dan penyelesaian protokol WebSocket

Dengan pembangunan teknologi bahagian hadapan, protokol WebSocket memainkan peranan penting dalam komunikasi masa nyata. Walau bagaimanapun, disebabkan oleh sekatan dasar keselamatan merentas domain, menggunakan protokol WebSocket untuk komunikasi merentas domain mungkin menghadapi beberapa masalah. Artikel ini akan memperkenalkan isu merentas domain protokol WebSocket, menyediakan beberapa penyelesaian dan memberikan contoh kod khusus.

1. Isu merentas domain protokol WebSocket

Secara lalai, penyemak imbas moden akan mengikut dasar asal yang sama. Dasar asal yang sama mengehadkan permintaan merentas domain antara sumber yang berbeza (nama domain, protokol, nombor port). Walau bagaimanapun, piawaian protokol WebSocket membenarkan penubuhan sambungan komunikasi dua hala antara domain yang berbeza, yang menimbulkan isu merentas domain.

Secara konkrit, katakan kita menggunakan protokol WebSocket pada halaman web dalam domain A untuk berkomunikasi dengan pelayan yang terletak dalam domain B. Menurut dasar asal yang sama, penyemak imbas akan menghalang penubuhan sambungan merentas domain ini, menyebabkan komunikasi gagal.

2. Penyelesaian

1. Gunakan proksi terbalik

Salah satu cara untuk menyelesaikan masalah silang domain WebSocket adalah melalui pelayan proksi terbalik. Pelayan ini terletak di peringkat pertengahan dalam domain yang sama dengan aplikasi web dan mengendalikan permintaan sambungan merentas domain daripada pelanggan. Dalam kes ini, pelanggan sebenarnya berkomunikasi dengan pelayan proksi asal yang sama, dan bukannya terus dengan pelayan destinasi yang diminta.

Berikut ialah konfigurasi contoh menggunakan pelayan proksi terbalik Nginx:

server {
    listen 80;
    server_name your.domain;
    
    location / {
        proxy_pass http://target.server;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "Upgrade";
    }
}

Dalam konfigurasi ini, kami membuat proksi permintaan kepada pelayan sasaran dan menetapkan pengepala permintaan yang sesuai untuk mendayakan protokol WebSocket. Dengan menyediakan proksi terbalik pada pelayan proksi, kami boleh memintas sekatan dasar asal yang sama penyemak imbas dan dengan itu menyelesaikan masalah merentas domain WebSocket.

2. Gunakan Polisi CORS (Cross-Origin Resource Sharing)

Cara lain untuk menyelesaikan masalah merentas domain WebSocket ialah menggunakan polisi CORS (Cross-Origin Resource Sharing). CORS membenarkan pelayan menambah pengepala Access-Control-Allow-Origin pada respons untuk menentukan domain yang dibenarkan untuk mengakses sumber.

Berikut ialah contoh kod menggunakan rangka kerja Node.js dan Express:

const express = require('express');
const app = express();

app.use((req, res, next) => {
    res.header('Access-Control-Allow-Origin', 'http://your.origin');
    res.header('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept');
    next();
});

app.listen(3000, () => {
    console.log('Server is running on port 3000');
});

Dalam contoh ini, kami mencipta pelayan HTTP mudah menggunakan rangka kerja Express dan menetapkan Access-Control-Allow-Origin dalam pengepala pengepala respons untuk membenarkan silang asal permintaan daripada domain yang ditentukan.

Apabila pelanggan mewujudkan sambungan WebSocket dengan pelayan, respons pelayan akan termasuk pengepala Access-Control-Allow-Origin. Dalam kes ini, penyemak imbas akan membenarkan penubuhan sambungan merentas domain, dengan itu menyelesaikan masalah merentas domain WebSocket.

Ringkasan:

Protokol WebSocket mempunyai nilai aplikasi yang penting dalam komunikasi masa nyata, tetapi isu merentas domain sentiasa menjadi cabaran yang membelenggu pembangun. Artikel ini memperkenalkan masalah merentas domain protokol WebSocket dan menyediakan dua penyelesaian: menggunakan proksi terbalik dan menggunakan dasar CORS. Adalah penting bagi pembangun bahagian hadapan untuk memahami dan menguasai penyelesaian ini untuk menangani masalah merentas domain WebSocket dengan lebih baik.

Nota: Kod contoh di atas adalah untuk tujuan ilustrasi sahaja. Dalam aplikasi sebenar, pengubahsuaian dan pelarasan yang sesuai perlu dibuat mengikut situasi tertentu.

Atas ialah kandungan terperinci Isu merentas domain dan penyelesaian protokol WebSocket. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!