Chrome. Remote debugging from connected Android Device: CORS issue - google-chrome

I have a SPA running on my localhost:3000 and my ASP.NET Core 3.1 Web API running on localhost:44372.
I'm trying to debug the SPA from my connected Android Device. I connected the device, did port forwarding, everything is well, SPA gets opened, but then it does a request to Web API and receives CORS error. When I check network tab I see that the origin is https://localhost:3000, which is correct. Does chrome remote debugging mode somehow replace the origin, because everything works well if I open the SPA locally?
I tried to debug Web API project with custom middleware, but I'm unable to hit the breaking point: seems like it returns CORS error before pipeline even started.
Here are my CORS configs in Web API:
builder.UseCors(x => x
.WithOrigins("https://localhost:3000", "http://localhost:3000")
.AllowAnyMethod()
.AllowAnyHeader()
.AllowCredentials())
UPDATE
The CORS errors:
UPDATE 2
I also forwarded the port 44372 which I have the Web API on and the error changed to: net::ERR_CERT_AUTHORITY_INVALID. Is this an issue with the chrome on android? I'm not quite sure how to address it. The issue seems to be with the Web API server certificate, because SPA gets loaded properly.

I managed to solve the issue by opening https://localhost:44372 on the Device. There I got a security warning, but when I chose "proceed to localhost (unsafe)" I was able to reach Web API. Then https://localhost:3000 started working well.

Related

Chrome Web Serial API not working in VueJs Web app

I'm developing an enterprise web app with Vue.js, and I would like to use the Web Serial API in Chrome. On the linux machine that I'm developing on, I went to this Chrome flag chrome://flags/#enable-experimental-web-platform-features and enabled it. Then I did console.log('serial' in navigator) and it returned true, meaning that the flag is enabled. All is good so far.
So I went and did the same thing on the corporate computer I need to be using (running windows 10). I enabled the flag in Chrome, restarted it, and ran console.log('serial' in navigator) on the tab running the web app, but it returns false, which is bad because I need it to be true. But when I run that code on a different tab, it returns true. How could my web app be changing the navigator? So I can't use the Web Serial API on the one computer that needs to be using it and I don't know why.
Any help is appreciated.
UPDATED. The problem is not specific from vue js, you should make the script execute from a secure environment, either localhost or from a ssl secured domain. This security concerns are covered on this draft https://wicg.github.io/serial/#security.

Self signed certificate for communication between local Win10 native app and web app

Background: I have a web app that is accessed via Chrome on a Windows 10 machine.
I also have a native Win10 application installed on the device. The web app sends data to the Win10 application via a local web service running on the machine in IISExpress.
To allow for HTTPS communication on port 44300, I've created a self-signed certificate via PowerShell:
New-SelfSignedCertificate -DnsName "localhost" -CertStoreLocation "cert:\LocalMachine\My" -NotAfter (Get-Date).AddMonths(60)
And then imported it to 'Local Computer\Trusted Root Certificates\Certificates'
From within the web app I send a command to the win10 app that looks something like this:
https://localhost:44300/CMTService.svc/JumpToAssignment?Param=Key=418584577
The win10 app is polling for these requests and picks up the message.
Issue:
Different versions of Chrome behave differently with the acceptance of the self-signed certificate. For instance versions 62, 64 and 75 all accept the certificate and allow for communication with the web service. But other versions of Chrome like 76 and 78 block communication. The Security tab in the Chrome DevTools shows https://localhost:44300 as "Unknown / cancelled" and my requests fail with ERR_SSL_CLIENT_AUTH_CERT_NEEDED. Whereas in working versions of Chrome my URL shows under "Secure origins". The only thing that I change is the Chrome version to get these different results.
I've tried enabling the Chrome setting to allow for invalid certs for localhost (chrome://flags/#allow-insecure-localhost). This temporarily works, but then after closing and reopening chrome, my requests start failing again with the same error code.
If I take one of my failing URLs and paste it into a new Chrome tab, suddenly communication with my native app in my web app resumes as normal. But it only works for that session - when I close and reopen Chrome my communication is broken again.
Question:
How do I allow for communication between my Chrome v78 web app and my local native app?
ERR_SSL_CLIENT_AUTH_CERT_NEEDED means the server is asking the browser for a certificate for client authentication.
You've described how you setup server authentication, but not described how you setup client authentication.
Likely you have enabled certificates for client authentication, but have not configured the web app to send the correct client certificate or have not configured the native app to accept the correct client certificate. That's a very open ended topic to be prescriptive without knowing more about your development efforts, but you can confirm if client authentication is enabled by inspecting a packet capture. One description of the handshake is here : https://blogs.technet.microsoft.com/nettracer/2013/12/30/how-it-works-on-the-wire-iis-http-client-certificate-authentication/.
Just an update: I implemented a javascript workaround to get around my communication issues. When first loading the web app, I simply send my first communication to IIS (destined for Win10 native app) in a separate chrome browser tab. For whatever reason this allows for successful acceptance of the certificate and kick starts the communication with IIS. This is my code to send the command in a new tab and then close it:
var inst = window.open(launchWinAppURL);
if (inst != null) {
window.setTimeout(function() {
inst.close();
}, 1000);
}
This is not the most elegant solution, but it seems to work on all chrome versions, so i'm satisfied.
Is the web app only communicating with the one win10 machine? Have you installed the self-signed cert directly to the machine? I would try installing it directly to the machine and see if the later instances of chrome allow communication.

Sending javascript code to a chrome app via the remote debug protocol

In the context of a unit test I need to send some code to the console of a chrome app I am developing. It's clear that I can do that from the chrome.debug API, but is there a way to do that from outside the browser?
Yes, there is a way; if you can do something with chrome.debug you can do so with remote debugging.
You need to enable remote debugging with command line switches; you can then connect to Chrome with a debugger client instance.
Google lists some existing debugger clients, and you can implement your own by following the debugger protocol (which works over HTTP+WebSockets).
The procedure for a debugger client is to request /json from the debugger port over HTTP, which lists all possible debug targets; the client then connects to the WebSocket associated with that target to work with it.

HTTP Server in Chrome Packaged App using Sockets API

I am trying to get a simple web page server from within a Google Chrome Packaged App. There is already a UDP server running within the app and working without any problems.
I am starting the socket.listen on 0.0.0.0:8080 and copying most of the code from
https://github.com/GoogleChrome/chrome-app-samples/tree/master/webserver
. The same issue is replicated in the sample app.
What I am doing is accepting the request and sending a single HTML file to all requests which have some data in the request (request.data.length > 0). The flow of the app is similar to the sample app with near-equivalent functions.
To test this I am using Socket Test 3.0 (from SourceForge). Creating a socket to 127.0.0.1:8080 and sending it GET / HTTP/1.1 as the content. As intended the Chrome App responds with the html file and correct headers. I can repeat this multiple times without restarting the App. The problem arises when the App is sent a request through Chrome. On first look it works as intended, but then it Time Out on refresh. This is also replicated in the sample app.
On debugging I found that every thing was being handles. The write socket being destroyed and a socket.accept(serverSocket, ...) being issued. I also made sure that it was done inside the callback function of the socket.write. The first request as intended is for the page requested (GET / HTTP/1.1 for localhost:8080). Second was for favicon.ico as GET /favicon.ico HTTP/1.1. And then a third connection with none in data (which is then ignored and socket destroyed). Unlike in the SocketTest where every request was answered back.
I have created a video showing the screencast while reproducing the error on YouTube. Also the repo for the project that I'm working on is at GitHub.
I had the same issues with Google's sample web server. I wrote a more robust socket server app that does not hang. The source is on GitHub at https://github.com/kzahel/web-server-chrome and you can install it from the Chrome web store at https://chrome.google.com/webstore/detail/web-server-for-chrome/ofhbbkphhbklhfoeikjpcbhemlocgigb

having problems integrating Kaazing with my website: Unable to post message to X. Recipient has origin Y

I keep getting the error trying to integrate Kaazing jms version with my .net website and activemq message broker:
Unable to post message to http://www.xgateway.com:8001. Recipient has origin http://www.x.com.
When I try to build a javascript client that is hosted by my Asp .NET website trying to connect to kaazing gateway.
I know I have everything setup ok, because i can go to www.xgateway.com:8001 and i can browse all the documentation and run the demos. I have run the stock ticker demo and watch it work perfectly. so all setup seems OK.
Now the problem is, I also have my asp .net website hosted on IIS 7 on the same machine. i'm trying to build javascript clients hosted on my .net website (port 80) that connect with the kaazing gateway. But I keep getting the above cross origin error.
In my client I am referencing StompJms.js as instructed. I have activemq setup up properly and working as well as the message broker. All demos working prove everything is setup properly.
i have also taken these steps following the instructions in the documentation:
Copy the file GATEWAY_HOME/lib/client/javascript/PostMessageBridge.html and serve it from the source origin web server (http://www.example.com); for example at http://www.example.com/bridge/PostMessageBridge.html.
Note: You must ensure that the file PostMessageBridge.html is hosted on the same origin (same scheme, host, and port) as the web server.
Add the following tags (shown in lines 2 and 3) to the section of your main application page:
<head>
<meta name="kaazing:postMessageBridgeURL"
content="http://www.x.com/PostMessageBridge.html" >
.
.
.
</head>
but still get the error. What else am i missing?
Since the port numbers used by your .NET app and your kaazing websocket gateway are different, these are considered to be separate sites. Therefore, you'll need to specify cross-site-constraint for your service.
Here's a sample snippet you'll need to add to your gateway-config.xml:
<service>
<accept>ws://localhost:8001/remoteService</accept>
<connect>tcp://localhost:61613</connect>
<type>stomp.proxy</type>
<auth-constraint>
<require-role>AUTHORIZED</require-role>
</auth-constraint>
<cross-site-constraint>
<allow-origin>http://localhost:8000</allow-origin>
</cross-site-constraint>
</service>
And here you find detailed documentation on the topic.