如果从主javascript调用，下面的代码运行完美，但它不会在web worker中运行。
function getSpecData(detailLvl, startWeek, endWeek, mkt) {
var params = { "detailLvl": detailLvl, "startWeek": startWeek, "endWeek": endWeek, "mkt": mkt };
var xhr;
var url = "WebServices/wsSProgress.asmx/GetSpecProgressTable";
try {
xhr = new XMLHttpRequest();
xhr.open('POST', url, false);
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.onreadystatechange = function () {
if (xhr.readyState == 4 && xhr.status == 200) {
var result = JSON.parse(xhr.responseText);
$('#specProgTbl').html(result.d);
}
};
xhr.send(JSON.stringify(params));
} catch (e) {
alert('Error occured in XMLHttpRequest: ' + xhr.statusText + ' ReadyState: ' + xhr.readyState + ' Status:' + xhr.status);
}
}
Web worker代码的唯一区别是它使用postMessage返回结果：
<script id="worker" type="javascript/worker">
self.onmessage = function (e) {
var data = e.data;
//self.postMessage(data.mkt + " " + data.detailLvl + " " + data.refreshMin + " " + data.isRotate +" "+data.weekNum);
var startWeek=data.weekNum-3;
var endWeek=data.weekNum;
self.postMessage(getSpecData(1,startWeek,endWeek,data.mkt));
};
function getSpecData(detailLvl, startWeek, endWeek, mkt) {
self.postMessage('DetailLvl '+detailLvl+' Start '+startWeek+' End '+endWeek+' Mkt '+mkt);
var params = { "detailLvl": detailLvl, "startWeek": startWeek, "endWeek": endWeek, "mkt": mkt };
var xhr;
var url = "WebServices/wsSpecProgress.asmx/GetSpecProgressTable";
try {
xhr = new XMLHttpRequest();
xhr.open('POST', url, false);
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.onreadystatechange = function () {
if (xhr.readyState == 4 && xhr.status == 200) {
var result = JSON.parse(xhr.responseText);
self.postMessage(result.d);
}
};
xhr.send(JSON.stringify(params));
} catch (e) {
self.postMessage('Error occured in XMLHttpRequest: ' + xhr.statusText + ' ReadyState: ' + xhr.readyState + ' Status:' + xhr.status);
}
}
</script>
启动工作人员的主要javascript：
$(function initialize() {
$('#options').hide();
$("[id$='btnViewOpt']").val("View Options");
var mkt = $("[id$='lstMkt'] :selected").text();
var detailLvl = $("[id$='lstDetailLvl'] :selected").val();
var refreshMin = $("[id$='lstRefresh'] :selected").val();
var isRotate = $("[id$='chkRotate']").is(":checked");
var BlobBuilder = window.BlobBuilder || window.WebKitBlobBuilder || window.MozBlobBuilder;
window.URL = window.URL || window.webkitURL;
if (BlobBuilder) {
var bb = new BlobBuilder();
bb.append(document.querySelector('#worker').textContent);
wUrl = window.URL.createObjectURL(bb.getBlob());
worker = new Worker(wUrl);
alert("Web worker started");
worker.addEventListener('message', dispMsg, false);
worker.addEventListener('error', onError, false);
worker.postMessage({ 'mkt': mkt, 'detailLvl': detailLvl, 'refreshMin': refreshMin, 'isRotate': isRotate, 'weekNum': getCurrentWeekNumber() }); // Start the worker.
}
else
alert("Your browser does not support web workers");
});
function onError(e) {
alert('ERROR in WebWorker: Line ' + e.lineno + ' in ' + e.filename + ': ' + e.message);
}
function dispMsg(e) {
alert("Message from worker: " + e.data);
$('#specProgTbl').html(e.data);
}
网络工作者启动并且参数正确但 result.d未定义。 catch没有statusText，只有 readyState = 0 和 status = 0 。
这是什么巫术？
更新
xhr.responseText 如果从主Javascript调用，则为：
{"d":"\u003ctable border=\u00271px\u0027 cellpadding=\u00275\u0027 cellspacing=\u00270\u0027\u003e\u003ctr height=\u002710\u0027 \u003e\u003cth height=\u002710\u0027 colspan=\u002712\u0027\u003ePAS\u003c/th\u003e\u003c/tr\u003e\u003ctr height=\u002710\u0027 \u003e\u003ctd align=\u0027center\u0027 width=\u0027200\u0027\u003eManufacturer\u003c/td\u003e\u003ctd align=\u0027center\u0027 width=\u0027150\u0027\u003eMake\u003c/td\u003e\u003ctd align=\u0027center\u0027 width=\u0027100\u0027\u003eNoSpec W22\u003c/td\u003e\u003ctd align=\u0027center\u0027 width=\u0027100\u0027\u003eComplete% W22\u003c/td\u003e\u003ctd align=\u0027center\u0027 width=\u0027100\u0027\u003eNoSpec W23\u003c/td\u003e\u003ctd align=\u0027center\u0027 width=\u0027100\u0027\u003eComplete% W23\u003c/td\u003e\u003ctd align=\u0027center\u0027 width=\u0027100\u0027\u003eNoSpec W24\u003c/td\u003e\u003ctd align=\u0027center\u0027 width=\u0027100\u0027\u003eComplete% W24\u003c/td\u003e\u003ctd align=\u0027center\u0027 width=\u0027100\u0027\u003eNoSpec W25\u003c/td\u003e\u003ctd align=\u0027center\u0027 width=\u0027100\u0027\u003eComplete% W25\u003c/td\u003e\u003ctd align=\u0027center\u0027 width=\u0027100\u0027\u003eNoSpec W26\u003c/td\u003e\u003ctd align=\u0027center\u0027 width=\u0027100\u0027\u003eComplete% W26\u003c/td\u003e\u003c/tr\u003e\u003ctr height=\u002710\u0027 \u003e\u003ctd align=\u0027left\u0027 class=\u0027default\u0027 height=\u002710\u0027 \u003eAAD\u003c/td\u003e\u003ctd align=\u0027left\u0027 class=\u0027default\u0027 height=\u002710\u0027 \u003eCHERY\u003c/td\u003e\u003ctd align=\u0027left\u0027 class=\u0027noSpecSame\u0027 height=\u002710px\u0027 \u003e0\u003c/td\u003e\u003ctd align=\u0027center\u0027 class=\u0027percSame\u0027 height=\u002710\u0027 \u003e\u003cdiv style=\u0027background-image: linear-gradient(left , rgba(8,68,250,1) 18%, rgba(240,241,250,1) 92%, rgba(240,241,250,0) 8%);background-image: -o-linear-gradient(left , rgba(8,68,250,1) 18%, rgba(240,241,250,1) 92%, rgba(240,241,250,0) 8%);background-image: -moz-linear-gradient(left , rgba(8,68,250,1) 18%, rgba(240,241,250,1) 92%, rgba(240,241,250,0) 8%);background-image: -webkit-linear-gradient(left , rgba(8,68,250,1) 18%, rgba(240,241,250,1) 92%, rgba(240,241,250,0) 8%);background-image: -ms-linear-gradient(left , rgba(8,68,250,1) 18%, rgba(169,199,245,1) 92%, rgba(240,241,250,0) 8%);background-image: -webkit-gradient(linear,left bottom,right bottom,color-stop(0.18, rgba(8,68,250,1)),color-stop(0.92, rgba(240,241,250,1)),color-stop(1, rgba(240,241,250,0)));\u0027\u003e92\u003c/div\u003e\u003c/td\u003e\u003ctd align=\u0027left\u0027 class=\u0027noSpecSame\u0027 height=\u002710\u0027 \u003e0\u003c/td\u003e\u003ctd align=\u0027center\u0027 class=\u0027percSame\u0027 height=\u002710\u0027 \u003e\u003cdiv style=\u0027background-image: linear-gradient(left , rgba(8,68,250,1) 18%, rgba(240,241,250,1..............."}
答案 0 :(得分：9)
好的，我真的很傻。我之所以得到
DOMException: INVALID_STATE_ERR
是因为根据W3 documentation xhr.status 属性会抛出异常，如果 xhr.readyState 的值无效：
>
Exceptions on retrieval
DOMException INVALID_STATE_ERR exception SHOULD be raised if this attribute is accessed when readyState has an inappropriate value.
我有一个无效的 xhr.readyState ，因为我没有指定我正在调用的webservice的完整路径。需要完整的Web服务路径，因为webworker在单独的 Blob文件中“即时”创建。
无论如何，下面是具有工作webservice调用脚本的webwoker代码：
<script id="worker" type="javascript/worker">
self.onmessage = function (e) {
var param = e.data;
var url="http://localhost:54071/WebServices/wsSProgress.asmx/GetSpecProgressTable";
var data=getSpecData(param.detailLvl,param.startWeek,param.endWeek,param.mkt,url)
self.postMessage(data);
};
function getSpecData(detailLvl, startWeek, endWeek, mkt, url) {
var params = { "detailLvl": detailLvl, "startWeek": startWeek, "endWeek": endWeek, "mkt": mkt };
var xhr;
try {
xhr = new XMLHttpRequest();
xhr.open('POST', url, false);
xhr.setRequestHeader('Content-Type', 'application/json');
xhr.onreadystatechange = function () {
if (xhr.readyState == 4 && xhr.status == 200) {
var result = JSON.parse(xhr.responseText);
self.postMessage(result.d);
}
};
xhr.send(JSON.stringify(params));
} catch (e) {
self.postMessage('Error occured in XMLHttpRequest: ' + xhr.statusText + ' ReadyState: ' + xhr.readyState + ' Status:' + xhr.status + ' E: ' +e+' Msg:'+e.message);
}
}
</script>
答案 1 :(得分：2)
从评论中，您的例外是：
DOMException: INVALID_STATE_ERR
这意味着您回发给父级的邮件内容无法序列化。
根据我的经验，这通常是因为对象中存在循环引用或函数。在不知道服务器给出的响应的情况下，这就像我可以帮助你一样。