Vue.js 如何在带有vue的web worker中使用axios？

我已尝试在web worker中使用axios请求

我的代码如下所示：

//worker.js

import axios from 'axios';

export default function getApiData (args) {
    axios.get('/api/test').then(response => {
        console.log(response);
    });
}

和带有Vue的主文件

//main.js

import getApiData from './worker.js';

Vue.use(VueWorker);

window.vueApp = new Vue({
    //...
    created: function () {
        this.updateWorker = this.$worker.create([
            {
                message: 'getApiData ',
                func: getApiData 
            }
        ]);

        this.testWorker.postMessage('getApiData ', [this.args])
            .then(result => {
                console.log(result);
            })
    },
    //...
}

我犯了这个错误

未捕获引用错误：axios\uuuu网页包\u导入的\u模块\uu 0\uuuu默认为 未定义

---

我做错了什么？

我也遇到了同样的问题，并通过返回基础解决了它——使用普通的老XMLRequest（见下文）

您不能在worker内部使用axios，因为在后台创建的用于加载

worker.js

的blob运行在与

main.js

不同的上下文中。为了让axios工作，您必须设置一个新的webpack绑定器，以便只绑定工作程序本身。我不想那样做——这会使项目结构变得不必要的复杂

下面是一个简单的解决方案（用于json和非json响应）

//worker.js
导出默认值（）=>{
self.addEventListener（'message'，e=>{
如果（！e）返回；
//如果您想支持IE11和更旧的浏览器，请使用try/catch
//这不支持承诺。下面的实现不起作用
//即使在主项目中加载多边形填充，因为
//工人在不同的环境中运行（此处没有网页包包）。
试一试{
const fetchData=（url，isJSON=true）=>{
返回新承诺（（解决、拒绝）=>{
函数reqListener（）{
如果（this.status！==200）{
返回拒绝（）；
}
const response=isJSON
？JSON.parse（this.responseText）
：this.responseText；
决心（回应）；
}
const oReq=新的XMLHttpRequest（）；
oReq.addEventListener（'load'，reqListener）；
open（'GET'，url）；
oReq.send（）；
});
};
常量baseUrl=https://static.newsfilter.io/';
const{articleId}=e.data；
const jsonUrl=baseUrl+articleId+'.json'；
const htmlUrl=baseUrl+articleId+'.html'；
//我的用例需要两个并行请求。
const tasks=[fetchData（jsonUrl），fetchData（htmlur，false）]；
承诺。所有（任务）
。然后（数据=>{
postMessage（{json:data[0]，html:data[1]}）；
})
.catch（错误=>{
postMessage（{isError:true，error}）；
});
}捕获（错误）{
postMessage（{isError:true}）；
}
});
};

当我发现问题出在无法正确构建文件的webpack中时，我也遇到了同样的问题，我设法用fetch解决了这个问题directly@MelNik-你解决了吗？我也喜欢@GustavoAdolfo求助于

fetch

@Lukasz'Severiaan'Grela不是真的，我使用了web Workers的本机功能，而不是这个插件关于webpack有什么解决方案吗？无论是在我的代码中还是在外部库中，我都会遇到这种情况，所以这似乎是一个大问题。如果你发现了，你应该发布解决方案