Cannot get a ipc connection to run with aspnetcore 2.1 & angular 6

[ffetech]

Hello Gregor, Hello Robert, Hello all,

Thank you for this library!

I have a AspNetCore 2.1 Angular 6 App with ElectronApi 0.11. "electronize start" works fine and the app starts fine but I cannot get a ipc connection to run.

I have an Angular service with the following parts of code to establish a ipc connection. Its executing immediately after angular app start,

import { IpcRenderer } from 'electron';
...
if (process.versions.electron && (<any>window).require)
this.ipc = (<any>window).require("electron").ipcRenderer;
...
this.ipc.send("connect", "x");

This is my code on C# side

var browserWindow = await Electron.WindowManager.CreateWindowAsync(new BrowserWindowOptions { Show = false });
browserWindow.OnReadyToShow += () =>
{
Electron.IpcMain.On("connect", args => Connect());
browserWindow.Show();
};

if I make a sendSync on angular side, the app freezes. Do you have some idea what i did wrong.

[GregorBiswanger]

Hi @ffetech
do you can create a small project with the problem?
So I can download and try it...

Best,
Gregor

[ffetech]

Hi Gregor,

Thank you for help. Now I have created a new small project with angular 7.

You can download it from here.
https://customer.ffe-tech.com/code/ElectronDotNet.Core21Ng7Ipc.zip

Now I have a different solution (but also not working). In the header of index.html you can find the javascript-like electron import "const electron = require('electron'). Then there is a angular service "IpcService" which encapsulates the ipc code. The app component injects the service and make the corresponding method calls to the IpcService. Debugging with the chrome dev tools is possible. But on c# side the message is not receiving.

Best Regards

[jsantanders]

Hi ffetech,

I'm having the same issue, do you solve it? or find a workaroud?

Cheers,
Jesus Santander.

[ffetech]

Hi jsantanders, Hi Gregor,

It‘s not solves yet, but I have noticed the following behaviour:

If i debug it in chrome developer tools it surprisingly worked if i step over the ipcRenderer.send method.

Because of that I had the idea to implement a „setTimeout“ of 5000ms to send delayed. But this also do not work.

[GregorBiswanger]

Hey @ffetech, @jsantanders and other Angular Devs from our Community :)

@ffetech I downloaded your sample code and immediately recognized the problem.

The ipcRenderer works asynchronously in the background. When a message arrives and your data is changed, no Angular Change Detection becomes active.

That's because the Change Detection runs over Zone.js. This subscribes to all DOM events, XHR events, etc. - When these are triggered, only their call stack is processed. Then goes through the change detection. With otherwise asynchronous code, Zone.js does not recognize this.

The solution is to run your own asynchronous code in one zone. This automatically triggers a change detection. Here the updated code from your sample:

constructor(private ipc: IpcService, zone: NgZone) {
  this.ipc.on('asynchronous-reply', (event, args) => {
    zone.run(() => {
      this.message = `Asynchronous message reply: ${args}`;
    });
  });

  this.ipc.send("async-msg", 'ping');
}

p.s. I would disguise the zone call in the service. Looks like better... :)

[ffetech]

Hello Gregor,

good to know. Thank You :)

[Spiti]

Hi guys, I tried to run the example above, but I get an error:

pm ERR! errno 1
npm ERR! electron.net.host@1.0.2 start: `tsc -p . "--port" "59776"`

I installed the npm packages, built the angular project and ran electronize start. what am I missing?

Thanks!

[GustavoGSA]

Hi,

The same problema of @Spiti here.

stdout: fail: Microsoft.AspNetCore.Diagnostics.DeveloperExceptionPageMiddleware[1] An unhandled exception has occurred while executing the request. System.AggregateException: One or more errors occurred. (One or more errors occurred. (The NPM script 'start' exited without indicating that the Angular CLI was listening for requests. The error output was: npm ERR! cod e ELIFECYCLE npm ERR! errno 1 npm ERR! electron.net.host@1.0.2 start: tsc -p . "--port" "50649"npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the electron.net.host@1.0.2 start script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above. npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\gusta\AppData\Roaming\npm-cache\_logs\2019-09-20T02_36_29_998Z-debug.log )) ---> System.AggregateException: One or more errors occurred. (The NPM script 'start' exited without indicating that the Angular CLI was listening for requests. The error output was: npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! electron.net.host@1.0.2 start:tsc -p . "--port" "50649"npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the electron.net.host@1.0.2 start script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above. npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\gusta\AppData\Roaming\npm-cache\_logs\2019-09-20T02_36_29_998Z-debug.log ) ---> System.InvalidOperationException: The NPM script 'start' exited without indicating that the Angular CLI was listening for requests. The error output was: npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! electron.net.host@1.0.2 start:tsc -p . "--port" "50649" npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the electron.net.host@1.0.2 start script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above. npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\gusta\AppData\Roaming\npm-cache\_logs\2019-09-20T02_36_29_998Z-debug.log ---> System.IO.EndOfStreamException: Attempted to read past the end of the stream. at Microsoft.AspNetCore.SpaServices.AngularCli.AngularCliMiddleware.StartAngularCliServerAsync(String sourcePath, String npmScriptName, ILogger logger) --- End of inner exception stack trace --- at Microsoft.AspNetCore.SpaServices.AngularCli.AngularCliMiddleware.StartAngularCliServerAsync(String sourcePath, String npmScriptName, ILogger logger) --- End of inner exception stack trace --- at System.Threading.Tasks.Task1.GetResultCore(Boolean waitCompletionNotification)
at Microsoft.AspNetCore.SpaServices.AngularCli.AngularCliMiddleware.<>c.b__2_0(Task1 task) at System.Threading.Tasks.ContinuationResultTaskFromResultTask2.InnerInvoke()
at System.Threading.ExecutionContext.RunInternal(ExecutionContext executionContext, ContextCallback callback, Object state)
--- End of stack trace from previous location where exception was thrown ---
at System.Threading.Tasks.Task.ExecuteWithThreadLocal(Task& currentTaskSlot)
--- End of inner exception stack trace ---
at System.Threading.Tasks.Task1.GetResultCore(Boolean waitCompletionNotification) at Microsoft.AspNetCore.SpaServices.Extensions.Util.TaskTimeoutExtensions.WithTimeout[T](Task1 task, TimeSpan timeoutDelay, String message)
at Microsoft.AspNetCore.SpaServices.Extensions.Proxy.SpaProxy.PerformProxyRequest(HttpContext context, HttpClient httpClient, Task1 baseUriTask, CancellationToken applicationStoppingToken, Boolean proxy404s) at Microsoft.AspNetCore.Builder.SpaProxyingExtensions.<>c__DisplayClass2_0.<<UseProxyToSpaDevelopmentServer>b__0>d.MoveNext() --- End of stack trace from previous location where exception was thrown --- at Microsoft.AspNetCore.Routing.EndpointMiddleware.Invoke(HttpContext httpContext) at Microsoft.AspNetCore.Routing.EndpointRoutingMiddleware.Invoke(HttpContext httpContext) at Microsoft.AspNetCore.StaticFiles.StaticFileMiddleware.Invoke(HttpContext context) at Microsoft.AspNetCore.StaticFiles.StaticFileMiddleware.Invoke(HttpContext context) at Microsoft.AspNetCore.Diagnostics.DeveloperExceptionPageMiddleware.Invoke(HttpContext context) ---> (Inner Exception #0) System.AggregateException: One or more errors occurred. (The NPM script 'start' exited without indicating that the Angular CLI was listening for requests. The error output was: npm ERR! code EL IFECYCLE npm ERR! errno 1 npm ERR! electron.net.host@1.0.2 start: tsc -p . "--port" "50649"npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the electron.net.host@1.0.2 start script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above. npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\gusta\AppData\Roaming\npm-cache\_logs\2019-09-20T02_36_29_998Z-debug.log ) ---> System.InvalidOperationException: The NPM script 'start' exited without indicating that the Angular CLI was listening for requests. The error output was: npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! electron.net.host@1.0.2 start:tsc -p . "--port" "50649" npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the electron.net.host@1.0.2 start script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above. npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\gusta\AppData\Roaming\npm-cache\_logs\2019-09-20T02_36_29_998Z-debug.log ---> System.IO.EndOfStreamException: Attempted to read past the end of the stream. at Microsoft.AspNetCore.SpaServices.AngularCli.AngularCliMiddleware.StartAngularCliServerAsync(String sourcePath, String npmScriptName, ILogger logger) --- End of inner exception stack trace --- at Microsoft.AspNetCore.SpaServices.AngularCli.AngularCliMiddleware.StartAngularCliServerAsync(String sourcePath, String npmScriptName, ILogger logger) --- End of inner exception stack trace --- at System.Threading.Tasks.Task1.GetResultCore(Boolean waitCompletionNotification)
at Microsoft.AspNetCore.SpaServices.AngularCli.AngularCliMiddleware.<>c.b__2_0(Task1 task) at System.Threading.Tasks.ContinuationResultTaskFromResultTask2.InnerInvoke()
at System.Threading.ExecutionContext.RunInternal(ExecutionContext executionContext, ContextCallback callback, Object state)
--- End of stack trace from previous location where exception was thrown ---
at System.Threading.Tasks.Task.ExecuteWithThreadLocal(Task& currentTaskSlot)
---> (Inner Exception #0) System.InvalidOperationException: The NPM script 'start' exited without indicating that the Angular CLI was listening for requests. The error output was: npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! electron.net.host@1.0.2 start: tsc -p . "--port" "50649"
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the electron.net.host@1.0.2 start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\gusta\AppData\Roaming\npm-cache_logs\2019-09-20T02_36_29_998Z-debug.log
---> System.IO.EndOfStreamException: Attempted to read past the end of the stream.
at Microsoft.AspNetCore.SpaServices.AngularCli.AngularCliMiddleware.StartAngularCliServerAsync(String sourcePath, String npmScriptName, ILogger logger)
--- End of inner exception stack trace ---
at Microsoft.AspNetCore.SpaServices.AngularCli.AngularCliMiddleware.StartAngularCliServerAsync(String sourcePath, String npmScriptName, ILogger logger)<---
<---
stdout: info: Microsoft.AspNetCore.Hosting.Internal.WebHost[2]
Request finished in 499.0983ms 500 text/html; charset=utf-8
C:\WorkSpace\Electron\ASP.NETCoreWebApplication\ASP.NETCoreWebApplication\obj\Host\node_modules.bin>
`

Anybody can help?

thanks.

[PitySOFT]

I have the same issue with .Net Core 2.2 and 3.0 using a default MVC project but with Angular.

11 silly lifecycle electron.net.host@1.0.2 start: Returned: code: 1 signal: null
12 info lifecycle electron.net.host@1.0.2 start: Failed to exec start script
13 verbose stack Error: electron.net.host@1.0.2 start: tsc -p . "--port" "55259"
13 verbose stack Exit status 1

Any idea why this error and how to solve it?