【问题标题】:Pusher - Shared web worker variable scopePusher - 共享网络工作者变量范围
【发布时间】:2021-08-07 08:06:06
【问题描述】:

我在 Laravel 中使用共享工作者作为推送器,这里 XYZABC 是我的推送键作为字符串,但是有没有办法可以使用我的刀片文件中定义的 ENV 变量或变量,所以我不必费力-code 键,还需要根据国家切换频道。那么有没有办法访问共享工作脚本中刀片中定义的java脚本变量?这是我的代码

这是我工作的推送者社区的示例代码

https://github.com/pusher-community/pusher-with-shared-workers

// Pusher notification works as shared worker thread for providing
// notification across different tab for the same user, thereby reducing 
// channel count per user

importScripts("../../common/pusher.worker.min.js");


// An array of the clients/tabs using this worker
var clients = [];


// Connect to Pusher
var pusher = new Pusher("XYZABC", {
    encrypted: true,
    cluster: 'ap2',
    useTLS : true
});


// Log pusher details to console
Pusher.logToConsole = true
// Subscribe to the channel we specified in our Laravel Event
var channel = pusher.subscribe('task-created');


// Bind a function to a Event (the full Laravel class)
channel.bind('App\\Events\\TaskCreated', function(data) {
    // Relay the message on to each client
    clients.forEach(function(client){
        client.postMessage(data);
    });
});


self.addEventListener("connect", function(evt){
    // Add the port to the list of connected clients
    var port = evt.ports[0];
    clients.push(port);

    // Start the worker.
    port.start();
});

【问题讨论】:

    标签: laravel web-worker pusher pusher-js shared-worker


    【解决方案1】:

    经过一番研究,发现工人只能使用 postMessage 或 onmessage 进行通信。所以在工作人员启动后通过 postMessage 传递了我的密钥和国家/地区详细信息。

    PS:不确定这是正确的解决方法还是在这里做错了什么,如果有更好的解决方案或错误,请发表评论。

    这是我的主线程

    if (typeof(window.SharedWorker) === 'undefined') {
        throw("Your browser does not support SharedWorkers")
    } else {
        // Start our new worker
        var worker = new SharedWorker(basePath+"/assets/frontend/js/pusher-worker.min.js");
        console.log('Worker:', worker);
    
        // Whenever we get a message, set the #message element to the data brought in
        worker.port.onmessage = function(evt){
            // Log's the data recieved from shared worked
            console.log(evt.data);
        };
    
        // If we get an error, log it out and close the worker.
        worker.onerror = function(err){
            console.log(err.message);
            worker.port.close();
        }
    
        // Start the worker.
        worker.port.start();
    
        // Post pusher key and country code to worker thread
        worker.port.postMessage({key : pusherkey, country : pusherHomeCountryCode});
    }
    

    这是我修改后的工作线程

    // Pusher notification works as shared worker thread for providing
    // notification across different tab for same user, there by reducing 
    // channel count per user
    
    importScripts("../../common/pusher.worker.min.js");
    
    
    // An array of the clients/tabs using this worker
    var clients = [];
    
    // Flag to initialize pusher only once
    var initialize = false;
    
    // These two variable value will be recieved on post message from main thread
    var pusherKey = null;
    var countryCode = null;
    
    // Function to initialize pusher and subscribe to a channel
    function initalizePusherFn(pusherKey, countryCode) {
        // Connect to Pusher
        var pusher = new Pusher(pusherKey, {
            encrypted: true,
            cluster: 'ap2',
            useTLS : true
        });
    
    
        // Log pusher details to console
        Pusher.logToConsole = true
    
        // Subscribe to the channel we specified in our Laravel Event
        var channelName = 'task-created';
        if(typeof countryCode != 'undefined' && countryCode != '' && countryCode != 'PH'){
            channelName = channelName+"-"+countryCode;
        }
        var channel = pusher.subscribe(channelName);
    
        // Bind a function to a Event (the full Laravel class)
        channel.bind('App\\Events\\TaskCreated', function(data) {
            // Relay the message on to each client
            clients.forEach(function(client){
                client.postMessage(data);
            });
        });
    }
    
    self.addEventListener("connect", function(evt){
        // Add the port to the list of connected clients
        var port = evt.ports[0];
        clients.push(port);
    
        // On first load a post message will be called to pass pusherkey and country
        port.addEventListener('message', function(eventM){
            var data = eventM.data;
            pusherKey = data.key;
            countryCode = data.country;
    
            console.log(' initialize value:', initialize, '\n');
            console.log(' key:', pusherKey, '\n');
            console.log(' country code: ', countryCode, '\n');
            
            // Check if pusher is already initialized,
            // if not initialize and subscribe to a channel based on country
            // this should onle be working once for multiple tabs, else channel and 
            // message count will increase for pusher
            if(!initialize)
                initalizePusherFn(pusherKey, countryCode);
    
            // set initialize as true after being initialized
            initialize = true;
        }, false);
    
        // Start the worker.
        port.start();
    });
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2014-04-27
      • 1970-01-01
      • 1970-01-01
      • 2016-12-13
      • 2015-05-07
      相关资源
      最近更新 更多