|
|
俊秀的小狗 · Microsoft Build of ...· 1 月前 · |
|
|
骑白马的山羊 · C++实现一个SOAP客户端 - ...· 1 年前 · |
|
|
暴走的伤疤 · 内存、性能问题分析的利器——valgrain ...· 1 年前 · |
|
|
阳光的香槟 · Python中deque怎么用 ...· 2 年前 · |
|
|
豪情万千的眼镜 · maven - 为什么mvn ...· 3 年前 · |
我正在尝试使用Mediainfo.js获取一些视频信息在一个角8项目的前端。但我发现了下面的错误:
GET https://192.168.25.177:4200/MediaInfoModule.wasm 404 (Not Found)
wasm streaming compile failed: TypeError: Failed to execute 'compile' on 'WebAssembly': HTTP status code is not ok
falling back to ArrayBuffer instantiation
GET https://192.168.25.177:4200/MediaInfoModule.wasm 404 (Not Found)
bothg async and sync fetching of the wasm failed
failed to asynchronously prepare wasm: RuntimeError: abort(both async and sync fetching of the wasm failed). Build with -s ASSERTIONS=1 for more info.
RuntimeError: abort(both async and sync fetching of the wasm failed). Build with -s ASSERTIONS=1 for more info.
ERROR Error: Uncaught (in promise): RuntimeError: abort(RuntimeError: abort(both async and sync fetching of the wasm failed). Build with -s ASSERTIONS=1 for more info.). Build with -s ASSERTIONS=1 for more info.
RuntimeError: abort(RuntimeError: abort(both async and sync fetching of the wasm failed). Build with -s ASSERTIONS=1 for more info.). Build with -s ASSERTIONS=1 for more info.
at abort (vendor.js:131481)
at vendor.js:131481
at ZoneDelegate.invoke (polyfills.js:3709)
at Object.onInvoke (vendor.js:82905)
at ZoneDelegate.invoke (polyfills.js:3708)
at Zone.run (polyfills.js:3474)
at polyfills.js:4205
at ZoneDelegate.invokeTask (polyfills.js:3741)
at Object.onInvokeTask (vendor.js:82886)
at ZoneDelegate.invokeTask (polyfills.js:3740)
at resolvePromise (polyfills.js:4147)
at polyfills.js:4212
at ZoneDelegate.invokeTask (polyfills.js:3741)
at Object.onInvokeTask (vendor.js:82886)
at ZoneDelegate.invokeTask (polyfills.js:3740)
at Zone.runTask (polyfills.js:3518)
at drainMicroTaskQueue (polyfills.js:3909)
我试图安装wasm包,但它返回了许多与V8相关的错误。在它的npm页面上说它是唯一的节点( https://www.npmjs.com/package/wasm )
我也检查了Webpack的例子( https://github.com/buzz/mediainfo.js/blob/50830088bd775942a3962416ce61f759b13bc7c2/webpack.config.js#L34 ),但是它和角的结构太不一样了。我还找到了 这 页面,该页面显示了如何使用wasm模块的角度,但是我不知道我会放什么,而不是这个例子的fibonacci函数。
然而Mediainfo的页面声称“所有的分析都是在浏览器中完成的”,所以应该是可能的。
如何将介质集成到角8中?还有其他关于这个错误的信息可以帮助我吗?
另外,如果有人知道如何在前端安装wasm,这将有助于我继续尝试集成。
编辑
我让它起作用了,但方法很笨拙。我将CDN导入到index.html中,并将
declare let MediaInfo: any ;
在组件里。
一定有更好的办法。
另外,在我的生产环境中,我在控制台中获得了这些消息,这些消息不会在本地出现:
DevTools failed to load SourceMap: Could not parse content for https://assiste.estaleiro.serpro.gov.br/assets/js/mediainfo.min.js.map: Unexpected token < in JSON at position 0
wasm streaming compile failed: TypeError: Failed to execute 'compile' on 'WebAssembly': Incorrect response MIME type. Expected 'application/wasm'.
falling back to ArrayBuffer instantiation
我需要的是正确的角度积分。如何使用
import MediaInfo from 'mediainfo.js'
也许我应该把一些配置放在应用程序模块或者什么的。我只是不知道从哪里开始。
发布于 2020-07-23 08:01:20
问题是
mediainfo
将尝试从根目录:
http://localhost:4200/MediaInfoModule.wasm
加载
MediaInfoModule.wasm
文件。
所以你只需要确保这个文件是可触及的。
步骤1
将
node_modules/mediainfo.js/dist/MediaInfoModule.wasm
复制到项目的
src
目录,
步骤2
修改
angular.json
文件以将该文件添加到
options
of
build
目标中的
assets
部分
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"assets": [
"src/assets",
"src/favicon.ico",
"src/MediaInfoModule.wasm"
"styles": [
步骤3
重启
ng serve
发布于 2021-01-30 03:35:30
我知道这个问题是关于角度的,但是如果有人发现了这个帖子,想要一个使用服务工作者的解决方案,并使用Create (CRA)进行了测试,我已经 把我的解决方案发到这个帖子上 了。
发布于 2020-07-25 02:48:09
我尝试用上面的解决方案使用一个简单的项目创建一个对MediaInfo的拉请求,作者向我展示了一种更好的方法将它与角集成:
步骤1
修改
angular.json
文件,将node_modules mediainfo dir中的wasm文件添加到
options
of
build
目标的
assets
部分
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"assets": [
"src/assets",
"src/favicon.ico",
"input": "node_modules/mediainfo.js/dist",
"glob": "MediaInfoModule.wasm",
"output": ""
"styles": [
...
步骤2
在package.json中包含本节,否则在前端运行mediainfo时会得到运行时的错误。它可能就在依赖项之上:
...