Как правильно использовать laravel-echo-server для cross domain?

Question

[zagamay_ru]

Привет!

Есть backend на laravel (api.domain.local) и frontend (localhost:3000) на react
Laravel выступает в роли api.

Между собой общаются без проблем, есть необходимость пристроить broadcast от laravel
я выбрал redis + socket.io, взял готовый пакет laravel-echo-server

Конфигурация echo server такая:

{
	"authHost": "http://api.domain.local",
	"authEndpoint": "/broadcasting/auth",
	"clients": [],
	"database": "redis",
	"databaseConfig": {
		"redis": {},
		"sqlite": {
			"databasePath": "/database/laravel-echo-server.sqlite"
		}
	},
	"devMode": true,
	"host": null,
	"port": "6001",
	"protocol": "http",
	"socketio": {},
	"sslCertPath": "",
	"sslKeyPath": "",
	"sslCertChainPath": "",
	"sslPassphrase": "",
	"subscribers": {
		"http": true,
		"redis": true
	},
	"apiOriginAllow": {
		"allowCors": true,
		"allowOrigin": "http://localhost:3000",
		"allowMethods": "GET, POST",
		"allowHeaders": "Origin, Content-Type, X-Auth-Token, X-Requested-With, Accept, Authorization, X-CSRF-TOKEN, X-Socket-Id"
	}
}

На стороне фронта так вызываю Echo:

import Echo from 'laravel-echo';

window.io = require('socket.io-client');

const EchoServer = new Echo({
  broadcaster: 'socket.io',
  host: window.location.hostname + ':6001'
});

export default EchoServer;

И получаю такую ошибку в консоле браузера:

Access to XMLHttpRequest at 'http://localhost:6001/socket.io/?EIO=3&transport=polling&t=MUVFI1G' from origin 'http://localhost:3000' has been blocked by CORS policy: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.

Много комбинаций laravel-echo-server.json перепробывал, ничего не помогает, помогите плз!

Answer 1

[zagamay_ru]

Решилась проблема

new Echo({
    broadcaster: 'socket.io',
    host: window.location.hostname + ':6001',
    transports: ['websocket', 'polling', 'flashsocket'],
    auth: {
      headers: {
        Authorization: `Bearer ${token}`
      }
    }
  });

transports: ['websocket', 'polling', 'flashsocket']
Но щас Client can not be authenticated, got HTTP status 419 но думаю это уже решится)

Comments

[zagamay_ru]

Client can not be authenticated, got HTTP status 419

У меня используется laravel passport, поэтому Broadcast::routes(['middleware' => 'auth:api']); в BroadcastServiceProvider