web-dev-qa-db-fra.com

Chrome ne peut pas charger le travailleur Web

Je travaille sur un projet qui utilise un travailleur Web.

Dans ma section de tête, j'ai ce code:

var worker = new Worker("worker.js");
// More code

Cela fonctionne bien dans Safari, mais Chrome signale l'erreur suivante:

Uncaught SecurityError: Failed to create a worker: script at '(path)/worker.js' cannot be accessed from Origin 'null'.

Pourquoi cela fonctionne-t-il parfaitement dans Safari mais pas dans Chrome? Comment puis-je réparer ça?

Je vous remercie.

86
Progo

Chrome ne vous permet pas de charger des travailleurs Web lors de l'exécution de scripts à partir d'un fichier local.

64
Nobel Chicken

J'utilise une solution de contournement. Chrome bloque Worker mais pas <script>. Voici donc le meilleur moyen de créer une solution universelle:

function worker_function() {
    // all code here
}
// This is in case of normal worker start
// "window" is not defined in web worker
// so if you load this file directly using `new Worker`
// the worker code will still execute properly
if(window!=self)
  worker_function();

Vous le liez ensuite en tant que <script src="..." normal. Et une fois la fonction définie, vous utilisez cette abomination de code:

new Worker(URL.createObjectURL(new Blob(["("+worker_function.toString()+")()"], {type: 'text/javascript'})));
39
Tomáš Zato

Le problème a été correctement expliqué par Noble Chicken mais j'ai une solution plus générale pour le résoudre. Au lieu d'installer wamp ou xamp, utilisez python pour accéder au dossier dans lequel votre projet est hébergé et tapez: python -m http.server

Juste cela et vous aurez un serveur en cours d'exécution sur ce dossier, accessible à partir de localhost.

29
Robert Parcus

Vous pouvez également utiliser l'indicateur --allow-file-access-from-files lorsque vous lancez Chrome.

Exemple pour MacOsX:

/Applications/Google\ Chrome.app/Contents/MacOS/Google\ Chrome --allow-file-access-from-files

Plus d'infos: Paramètres de Web worker pour chrome

26
Mickaël

J'ai eu le même problème que votre post aussi. La solution est que vous devez l'exécuter avec localhost (wamp ou xamp). Ce sera fait.

6
Thara

C'est à cause des restrictions de sécurité. Vous devez utiliser le protocole http:// ou https:// au lieu de file:///.

Si vous avez installé NodeJS, vous pouvez simplement effectuer les opérations suivantes- Notez que ceci est l'une des nombreuses options disponibles}

Installer serveur-local-web

$ npm install -g local-web-server

Vous pouvez maintenant l'utiliser dans n'importe quel dossier pour lequel vous souhaitez accéder au contenu via http.

$ ws

Accédez à http://localhost:8000 (port par défaut: 8000) 

6
Safeer Hussain

vous avez besoin d'un serveur Web pour la demande du protocole HTTP au lieu d'un fichier local .__ et fonctionne correctement :)

3
Alireza Alallah

Une autre solution consiste à utiliser le serveur Web de Google pour l'extension Chrome . Choisissez votre répertoire de travail et démarrez le serveur, c'est fait!

3
Yubo

Python 2.x étant plus largement déployé que Python 3.x, un code comme python -m SimpleHTTPServer 8000 est plus généralement applicable, et pas seulement pour Mac OS X. Je l’ai jugé nécessaire pour une utilisation sous Cygwin, par exemple. 

Avec cela en place, cet exemple a fonctionné comme un champion.

2
salfter

Chrome charge le fichier mais ne peut pas l'exécuter. Utilisez Firefox. Cela fonctionne pour moi.

2
Hocine Ben
function worker_fun(num){
    num ++
    // console.log(num)
    postMessage(num);
    setTimeout(worker_fun.bind(null,num), 500)
}

var w

function startWorker(){
    var blob = new Blob([
        "onmessage = function(e){\
            " + worker_fun.toString() + "\
            worker_fun(e.data.num);}"
    ]);
    var blobURL = window.URL.createObjectURL(blob);
    if (typeof(Worker) != 'undefined'){
        if (typeof(w) == 'undefined'){

            w = new Worker(blobURL);
            w.onmessage = function(event){
                document.getElementById('num').innerHTML = event.data;
            } 
            w.postMessage({
               num:parseInt(document.getElementById('num').innerHTML)})
        }
    }
}


function stopWorker() { 
    w.terminate();
    w = undefined;
}

Comme mentionné, le chrome ne le supporte pas. J'aime définir mes ouvriers dans le même fichier. Il s'agit d'une solution de contournement qui augmentera le nombre trouvé dans innerHTML de l'élément avec id=num toutes les 500 ms.

1
Dominik Kolesar

Un moyen facile de faire serveur http local en chrome est cette application:

Serveur Web pour Chrome

https://chrome.google.com/webstore/detail/web-server-for-chrome/ofhbbkphhbklhfoeikjpcbhemlocgigb/related

La description:

Un serveur Web pour Chrome sert des pages Web à partir d'un dossier local sur le réseau, à l'aide de HTTP. Fonctionne hors ligne . Web Server for Chrome est un serveur HTTP open source (MIT) pour Chrome.

Il fonctionne partout où vous avez installé Chrome, vous pouvez donc l'emporter n'importe où. Cela fonctionne même sur ARM chromebooks.

Il a maintenant la possibilité d'écouter sur le réseau local afin que d'autres ordinateurs puissent accéder à vos fichiers. En outre, il peut essayer d’obtenir une adresse Internet.

Beaucoup de gens l'utilisent pour faire du développement Web de base sur un chromebook. Il est également pratique pour partager des fichiers sur un réseau local entre ordinateurs, ou même sur Internet.

Une fois que vous l'avez installé, accédez à http://127.0.0.1:8887

Et il n’est pas non sécurisé en tant que flag --allow-file-access-from-files

0
A. Denis

Une raison probable est que chrome ne vous permet pas de charger des travailleurs Web lors de l'exécution de scripts à partir d'un fichier local. Et je essaie de lancer le code sur mon firefox, ne peut pas non plus.

0
Eric Chang