angular - 如何在 Angular 9 的 webworker 中使用 aws-sdk？

Question

I installed aws-sdk :- npm install aws-sdk

然后像这样在我的工作文件中导入 aws-sdk:

app.worker.ts :- import * as AWS from 'aws-sdk';

然后尝试到 console.log 里面的 addEventListener 代码在这里:-

    addEventListener('message', async ({ data }) => {
    console.log(AWS);
}

执行此操作后，出现屏幕截图中的错误:

我也尝试解决这个错误，因为我在 polyfills.ts 中定义了全局，但它不起作用

polyfills.ts :- (window as any).global = window;

任何帮助将不胜感激。我想要实现的是我正在尝试使用 aws-sdk 从我的 Angular 项目将文件从工作人员上传到 s3。谢谢大家!

Answer 1

它也可能对其他人有帮助，所以我给出了我如何解决问题的解决方案:-

Web Worker 没有全局 window目的。所以要访问全局对象，我们可以使用 self相反。

为了解决我的问题，我遵循了以下步骤:

步骤:-

• 在app.worker.ts , 将 Type-Script 定义文件与全局 AWS 一起使用前端项目中的对象。我们必须在工作文件的顶部添加引用类型，例如 /// <reference types="aws-sdk" /> .

• 定义窗口 const window = self;

• 然后导入 aws-sdk 脚本 importScripts('assets/js/aws-sdk.js');然后我们就可以访问 AWS里面的物体 addEventListener('message', async ({ data }) => { console.log(window.AWS) });

• 我在这里从 Assets 中导入脚本，因为我必须自定义 aws-sdk 以避免在调用 s3.createMultipartUpload() 时出现窗口未定义错误。

• 这是链接 https://raw.githubusercontent.com/nyaupane/customized_aws_sdk/master/assets/js/aws-sdk.js自定义 aws_sdk 的情况下，如果您的要求与我的相同，否则您可以根据您的要求进行自定义。

• 最终 app.worker.ts将如下所示:https://github.com/nyaupane/customized_aws_sdk/blob/master/assets/worker/app.worker.ts

现在它非常适合分段上传...在 angular9 web worker 中使用 aws_sdk。