Asp.Net Core SignalR + Angular 6 issue - asp.net

I have a WebApi that was made using Asp.net Core 2.0 and consuming this API an Angular 5 App. Now I'm making a new version of this App using Angular 6.
In this Web API I use SignalR 1.0.0-alpha-final and in the Angular 5 app I use this as client "#aspnet/signalr-client": "^1.0.0-alpha2-final".
In the old Angular App everything works fine as intended. My problem is that I can use this package on the new version of my app:
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! #aspnet/signalr-client#1.0.0-alpha2-update1 install: `echo "This package has been deprecated. Use '#aspnet/signalr' instead." && exit 1`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the #aspnet/signalr-client#1.0.0-alpha2-update1 install script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
Then I try to use the recommended version, I follow this article and everything runs OK on the Angular 6 App side, but it never actually connects to the Hub. this is the message I get when running my local Angular APP:
Access to XMLHttpRequest at 'http://localhost:27081/hub/notification/negotiate?jwttoken=the_token_here' from origin 'http://localhost:4200' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.
It's not a real CORS problem, I made the WebAPI and and Angular APP run in the same domain and I never had CORS problem in my old App. I have the right Cors policies to allow localhost to use the api.
It's weird that the client added negotiate to the connection URL and even If I make my hub answer in this address I get error 400 with this message: Connection ID required
I do believe that this Client Library was made to another version than the one I have on the server, since the client and server has to follow the same version.
I tried using the node_modules from the older Angular App but I cannot get it to compile.. I don't know what to do. Has anyone experienced this issue and managed to solve? Any tips? I can't update the version on the WebAPI or I'll make the current App stop working.
Thanks for any help

I just got to make it work without changing the version of the webapi. This is how I make the connection:
this._hubConnection = new signalR.HubConnectionBuilder()
.withUrl('http://localhost:27081/hub/notification/?jwttoken='+ this.jwt,
{
accessTokenFactory: ()=> this.jwt ,
skipNegotiation: true,
transport: signalR.HttpTransportType.WebSockets
})
.build();
That's all. Yes, in the version I have in the API i have to send the token in the querysting. This documentation helped me achieve that.

You should update to the latest .Net core SignalR if you can
This include the client script #aspnet/signalR (currently 1.0.4)
With the latest Nuget Package Microsoft.AspNetCore.SignalRCore (currently 1.0.4)
Also note that initialising the hub in javascript changed from the preview version, looks something like this:
var connection = new signalR.HubConnectionBuilder().withUrl("/yourhub/").build();

Related

xamarin.forms: ios cannot create async on firestore. failing with with "bad gRPC response"

I created an empty xamarin forms project and followed the path to connect to the database. I am able to connect with the right key store file but as soon as I try to create data on the server I am getting a bad grpc response.
It look like ios is calling with http 1.1, but google requiers 2.0.
This is the line that fails:
await docRef.SetAsync(user);
This is the error I am getting:
e {Grpc.Core.RpcException: Status(StatusCode="Internal", Detail="Bad gRPC response. Response protocol downgraded to HTTP/1.1.") at Google.Api.Gax.Grpc.ApiCallRetryExtensions+<>c__DisplayClass0_0`2[TRequest,TResponse].<WithRetry>b__0 (TRequest request, Google.Ap…}
I am stuck here for days now, please help.
The same code works fine on android devices, its just iOS problem in xamarin.forms.
EDIT:
I have noticed, that this issue does not exist on the firebase nuget package 3.2.1 and below. Just the higher ones throw this error.

Progressive Web App: The FetchEvent for "<URL>" resulted in a network error response: the promise was rejected

I am seeing the following errors in the console of my PWA:
The FetchEvent for "https://static.cloudflareinsights.com/beacon.min.js" resulted in a network error response: the promise was rejected.
The FetchEvent for "https://www.google-analytics.com/analytics.js" resulted in a network error response: the promise was rejected.
It seems that external scripts have problems being fetched by workbox? The website is a next.js app and i am using next-pwa to turn it into a PWA. Here is the pwa-config for next-pwa: next-pwa config
Does anyone know how to fix this?
This is fairly common if you have a ad/tracking blocker extension installed, or if your browser has built-in blocking. A Workbox-powered service worker will not do anything to work around this blocking.

React-Native fetch call to localhost endpoint is giving Type Error: Network request failed when using https

I have a react-native application running on expo client using npm run android on Android Studio Emulator, WebApi call to get data using fetch works perfectly fine when I disable Enable SSL on the Visual Studio project settings see below, which means it is running on http port 54715, if you see arrow mark I unchecked Enable SSL checkbox
And also I made changes in applicationhost.config file to point my localhost to 127.0.0.1 which is an alias for 10.0.2.2 to connect from Android emulator, see below:
<bindings>
<binding protocol="http" bindingInformation="*:54715:127.0.0.1" />
<binding protocol="http" bindingInformation="*:54715:localhost" />
<binding protocol="https" bindingInformation="*:44367:127.0.0.1" />
</bindings>
So from above if I make fetch call from react native app it is working just fine, see code below:
fetch("http://10.0.2.2:54715/WeatherForecast/getAllProgramTypes")
.then((response) => {
return response.json();
})
.then((data) => {
console.log(data);
})
.catch((err) => {
console.log(err);
});
But the moment I click on EnableSSL on the project properties it would run on https port which is self certified
https://10.0.2.2:44367/WeatherForecast/getAllProgramTypes
https run on 44367 port, and when I make fetch to the web api:
fetch("https://10.0.2.2:44367/WeatherForecast/getAllProgramTypes")
.then((response) => {
return response.json();
})
.then((data) => {
console.log(data);
})
.catch((err) => {
console.log(err);
});
now with https I am getting TypeError: Network request failed, it is unable to make https call on localhost.
I got it working with http when I un-check Enable SSL and run the .Net Core solution but how to make fetch call with local https work ?
When I look at Microsoft docs it says Bypass the certificate security check, how do i do it with react-native code ?
https://learn.microsoft.com/en-us/xamarin/cross-platform/deploy-test/connect-to-local-web-services#bypass-the-certificate-security-check
Ciao unfortunately seems that is not possible to bypass the certificate security check in Javascript.
Possible solution:
Add the self-signed certificate to your root certificate repository on your local machine.
Obtain a valid signed certificate from a free service such as Let's Encrypt.
So, http or https even if it's working on Android Emulator, the question again is how it will work on your iPhone device or an Android device, I mean if you are using Expo Client app to open you react native app, now how do you connect your localhost .NET Core WebApi or any other endpoints on your local machine to your mobile devices to have the app running.
I have a common working solution which works for both emulators and mobile apps on the individual devices.
Step 1: Go to https://ngrok.com/
Step 2: Sign Up, you may use GitHub account
Step 3: Click on Download for windows if you have windows OS and unzip the file, you will
see the .exe, copy that to your desktop or the location you wanted.
Step 4: Go windows explorer and open command prompt on the location where you copied the
exe, run dir to check to see if you have ngrok.exe in the location you are on.
Step 5: Run ngrok authtoken yourTokenGivenDuringSignUp , it’s one-time thing you may need
to do
Step 6: Run ngrok http https://localhost:PortNumber -host-header="localhost:PortNumber" , Port number is the port that your .NET core solution is running, Enable SSL in the project properties we need https for this to work.
Step 7: Copy https link which will be ngrok created https URL which is highlighted, given as below example
Now you can use above link to replace in the fetch url to make the mobile app or Emulators work from your local code.
Note*** We need to be running the ngrok on step 6 & our solution, also url is different every time so run the step 6 and .NET Core solution to generate new web address and use it in the react native app.
Happy Coding :)

Disable firebase analytics by default [duplicate]

I update 'Google/Analytics' from CocoaPod and get FirebaseAnalytics.
After that, each time I run project, the FirebaseAnalytics turns out many error loggings.
Currently I don't use this library and want to remove it. Unfortunately I can't find any way to disable / remove it out of Pod.
Here is the Podfile configuration
target 'myApp' do
inhibit_all_warnings!
use_frameworks!
pod 'Google/Analytics'
end
Console log:
<FIRAnalytics/DEBUG> Debug mode is on
<FIRAnalytics/INFO> Firebase Analytics v.3200000 started
<FIRAnalytics/INFO> To enable debug logging set the following application argument: -FIRAnalyticsDebugEnabled (see 'https://developer.apple.com/library/ios/recipes/xcode_help-scheme_editor/Articles/SchemeRun.html')
<FIRAnalytics/DEBUG> Debug logging enabled
<FIRAnalytics/DEBUG> Firebase Analytics is monitoring the network status
<FIRAnalytics/DEBUG> Uploading data. Host: https://play.googleapis.com/log
<FIRAnalytics/INFO> Successfully created Firebase Analytics App Delegate Proxy automatically. To disable the proxy, set the flag FirebaseAppDelegateProxyEnabled to NO in the Info.plist
<FIRAnalytics/INFO> Firebase Analytics disabled
...
<FIRAnalytics/DEBUG> Network status has changed. code, status: 2, Connected
<FIRAnalytics/DEBUG> Network status has changed. code, status: 2, Connected
<FIRAnalytics/DEBUG> Received SSL challenge for host. Host: https://play.googleapis.com/log
<FIRAnalytics/DEBUG> Cancelling authentication challenge for host. Host: https://play.googleapis.com/log
<FIRAnalytics/ERROR> Encounter network error. Error: Error Domain=NSURLErrorDomain Code=-999 "cancelled" UserInfo={NSErrorFailingURLKey=https://play.googleapis.com/log, NSLocalizedDescription=cancelled, NSErrorFailingURLStringKey=https://play.googleapis.com/log}
...
UPDATE:
I also try to add FirebaseAppDelegateProxyEnabled = false in Info.plist but it doesn't work either.
To disable the collection of data by Firebase Analytics in your app, see the instructions here.
In summary, to disable temporarily, set FIREBASE_ANALYTICS_COLLECTION_ENABLED to NO in the GoogleServices-Info.plist file. To disable permanently, set FIREBASE_ANALYTICS_COLLECTION_DEACTIVATED to YES in the same plist file.
For 2018
For 2018, you Info.plist will have entries like this:
<key>FIREBASE_ANALYTICS_COLLECTION_ENABLED</key>
<string>NO</string>
<key>FIREBASE_ANALYTICS_COLLECTION_DEACTIVATED</key>
<string>YES</string>
<key>FirebaseScreenReportingEnabled</key>
<false/>
It seems to be in Info.plist, NOT GoogleServices-Info.plist.
I recently ran into a similar issue. I'm using Google Analytics but do not want or need Firebase analytics, which is installed by default if you follow the docs. After searching through the podspecs. I found that the Google/Analytics subspec has a dependency on Google/Core. The core subspec in turn depends on FirebaseAnalytics which is why it is getting installed.
I noticed, however, that the Analytics subspec also depends on the GoogleAnalytics cocoapods.
So I changed my Podfile from:
target 'myApp' do
inhibit_all_warnings!
use_frameworks!
pod 'Google/Analytics'
end
To this:
target 'myApp' do
inhibit_all_warnings!
use_frameworks!
pod 'GoogleAnalytics'
end
As a result, the Google/Analytics.h umbrella header is no longer available, and you need to include the correct headers manually or create your own umbrella header with the following includes:
#import "GAI.h"
#import "GAIDictionaryBuilder.h"
#import "GAIEcommerceFields.h"
#import "GAIEcommerceProduct.h"
#import "GAIEcommerceProductAction.h"
#import "GAIEcommercePromotion.h"
#import "GAIFields.h"
#import "GAILogger.h"
#import "GAITrackedViewController.h"
#import "GAITracker.h"
If you're doing this in a Swift project, you'll need to add these files to your bridging header in place of the umbrella header.
In my opinion, this is a small price to pay to not be forced to install the FirebaseAnalytics cocoapod.
Update
Although Google's docs haven't been updated, their podspec now tells you to use the GoogleAnalytics pod directly
Those logs are not actually from Firebase Analytics but the Firebase Core SDK (based on the URL that it sent to). Therefore, disabling the Firebase Analytics will not eliminate those logs. I guess there was a problem with the device network that the requests from Firebase SDK were cancelled.
Set the Android platform to true for Google Analytics
<meta-data
android:name="firebase_analytics_collection_enabled"
android:value="true" />

How to use Firebase behind Firewall / Proxy?

We are running a simple application that connects to Firebase are reads some data. It fails to connect with the following timeout error:
#firebase/database: FIREBASE WARNING: {"code":"app/invalid-credential",
"message":"Credential implementation provided to initializeApp()
via the \"credential\" property failed to fetch a valid Google OAuth2 access token
with the following error: \"Failed to parse access token response: Error: Error
while making request: connect ETIMEDOUT
We are behind Firewall / Proxy and it appears that is blocking traffic to/from Firebase and hence failed connection. My question is what ports need to be opened and to what destination URLs to make this application work normally?
Any help will be much appreciated!
Finally, after struggling with the issue for several days got it working. Needed to contact network team and request to perform following actions:
Open ports 5228, 5229, 5230 for Firebase communication.
Opened communication at proxy level between the source server and following URLs:
fcm.googleapis.com
gcm-http.googleapis.com
accounts.google.com
{project-name}.firebaseio.com
Added following code in my node.js application:
var globalTunnel = require('global-tunnel-ng');
globalTunnel.initialize({
host: '<proxy-url>',
port: <proxy-port>,
//proxyAuth: 'userId:password', // optional authentication
sockets: 50 // optional pool size for each http and https
});
Installed module global-tunnel-ng:
npm install global-tunnel-ng
It solved the my problem and I hope it can help others too. :-)
I used Wireshark to monitor a local install of a Node.js application using the Admin SDK for firestore. I also referenced this list by Netify. This is what I found:
*.firebaseio.com
*.google.com
*.google-analytics.com
*.googleapis.com
*.firebase.com
*.firebaseapp.com

Resources