Chrome không thể tải nhân viên web

Tôi đang làm việc trên một dự án sử dụng nhân viên web.

Trong phần đầu của tôi, tôi có mã này:

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

Điều này hoạt động tốt trong Safari, nhưng Chrome báo cáo lỗi sau:

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

Tại sao điều này hoạt động hoàn hảo trong Safari mà không phải Chrome? Làm cách nào để sửa lỗi này?

Cảm ơn bạn.

Chrome không cho phép bạn tải nhân viên web khi chạy tập lệnh từ tệp cục bộ.

Tôi sử dụng một cách giải quyết khác. Chrome chặn Workernhưng không <script>. Do đó, cách tốt nhất để tạo ra một giải pháp phổ quát là:

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();

Sau đó bạn liên kết nó như bình thường <script src="...". Và khi hàm được xác định, bạn sử dụng đoạn mã ghê tởm này:

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

Vấn đề đã được Noble Chicken giải thích hợp lý nhưng tôi có một giải pháp chung hơn cho nó. Thay vì cài đặt wamp hoặc xamp, với python, bạn có thể điều hướng đến thư mục mà dự án của bạn được lưu trữ và nhập:python -m http.server

Chỉ vậy thôi và bạn sẽ có một máy chủ đang chạy trên thư mục đó, có thể truy cập được từ localhost.

Bạn cũng có thể sử dụng cờ --allow-file-access-from-files khi khởi chạy Chrome.

Ví dụ cho MacOsX:

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

Thông tin thêm: Cài đặt nhân viên web cho chrome

Đó là vì các hạn chế bảo mật. Bạn cần sử dụng http://hoặc https://giao thức thay vì file:///.

Nếu bạn đã cài đặt NodeJS, bạn chỉ cần làm như sau. - Lưu ý rằng đây là một trong nhiều tùy chọn có sẵn

Cài đặt máy chủ web cục bộ

$ npm install -g local-web-server

Bây giờ bạn có thể sử dụng nó trong bất kỳ thư mục nào mà bạn muốn truy cập nội dung http.

$ ws

Điều hướng đến http://localhost:8000(cổng mặc định: 8000)

Tôi cũng có vấn đề tương tự như bài viết của bạn. Giải pháp là bạn phải chạy nó với localhost (wamp hoặc xamp). Nó sẽ được thực hiện.

Một giải pháp khác là sử dụng máy chủ web của Google cho tiện ích mở rộng của Chrome . Chọn thư mục công việc của bạn và khởi động máy chủ, Xong!

bạn cần một máy chủ web cho yêu cầu từ giao thức HTTP Thay vì tệp cục bộ và hoạt động chính xác :)

Chrometải tệp nhưng không thể chạy nó. Sử dụng Firefox. Nó làm việc cho tôi.

Cách dễ dàng để tạo máy chủ http cục bộ trong chrome là ứng dụng này:

Máy chủ web dành cho Chrome

https://chrome.google.com/webstore/detail/web-server-for-chrome/ofhbbkphhbklhfoeikjpcbhemlocgigb/ liên quan

Sự miêu tả:

Máy chủ Web dành cho Chrome, cung cấp các trang web từ một thư mục cục bộ qua mạng, sử dụng HTTP. Chạy ngoại tuyến. Máy chủ web dành cho Chrome là một máy chủ HTTP mã nguồn mở (MIT) dành cho Chrome.

Nó chạy ở bất kỳ đâu mà bạn đã cài đặt Chrome, vì vậy bạn có thể mang nó đi bất cứ đâu. Nó thậm chí còn hoạt động trên chromebook ARM.

Bây giờ nó có tùy chọn để nghe trên mạng cục bộ, vì vậy các máy tính khác có thể truy cập tệp của bạn. Ngoài ra, nó có thể thử và lấy một địa chỉ internet.

Nhiều người sử dụng điều này để phát triển web cơ bản trên chromebook. Nó cũng rất tiện lợi để chia sẻ tệp qua mạng cục bộ giữa các máy tính hoặc thậm chí trên internet.

Sau khi bạn cài đặt nó, hãy điều hướng đến http://127.0.0.1:8887

Và nó không phải là không an toàn vì cờ --allow-file-access-from-files

Điều này được lấy cảm hứng từ câu trả lời Thomas ở trên. Nhưng có một lưu ý rằng tôi chỉ muốn phân phối HTML, vì vậy tôi đã chuyển đổi thủ công js thành dataURL . và bật hộp kiểm URL dữ liệu trong đó.

const myWorker = new Worker("data:application/x-javascript;base64,b25tZXNzYW...");

Với việc Python 2.x được triển khai rộng rãi hơn Python 3.x, một cái gì đó giống như python -m SimpleHTTPServer 8000được áp dụng rộng rãi hơn và không chỉ dành cho Mac OS X. Ví dụ, tôi thấy nó cần thiết để sử dụng trong Cygwin.

Với điều đó, ví dụ này hoạt động như một nhà vô địch.

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;
}

Như đã đề cập chrome không hỗ trợ nó. Tôi muốn xác định công nhân của mình trong cùng một tệp. Đây là một cách giải quyết hiệu quả sẽ làm tăng một số được tìm thấy trong innerHTML của phần tử với id=nummỗi 500ms.

Một lý do có thể là chrome không cho phép bạn tải web worker khi chạy tập lệnh từ tệp cục bộ. Và tôi thử chạy mã trên firefox của mình, cũng không được.

Có, Nó sẽ không hoạt động trong chorome nếu bạn đang tải tệp cục bộ. Nhưng nó sẽ hoạt động tốt trong trình duyệt firefox. Và bạn phải thêm mã bên dưới vào tệp HTML.

<head>
    <meta charset="UTF-8" />
</head>