I'm following the Facebook Auth tutorial on the Firebase website. You can see it here: https://www.firebase.com/docs/web/libraries/ionic/guide.html
$scope.login = function() {
Auth.$authWithOAuthRedirect("facebook").then(function(authData) {
// User successfully logged in
}).catch(function(error) {
if (error.code === "TRANSPORT_UNAVAILABLE") {
Auth.$authWithOAuthPopup("facebook").then(function(authData) {
// User successfully logged in. We can log to the console
// since we’re using a popup here
console.log(authData);
});
} else {
// Another error occurred
console.log(error);
}
});
};
My issue is that I am correctly receiving the TRANSPORT_UNAVAILABLE error and I am getting to the following line of code
Auth.$authWithOAuthPopup("facebook").then(function(authData) {
// do stuff with the authData
})
But, when I run on my device or in emulator, the popup window that is coming from the InAppBrowser Plugin closes immediately and doesn't allow me to enter any of my credentials.
EDIT
Two things to note. First, with the above code auth does not work when done via the browser. So, if I do ionic serve and try to login nothing happens except that I see the url change briefly to http://localhost:8100/#/login&__firebase_request_key=0wRrfF07Ojg1PmJXNX1OsvrRFR2Q1LGj
but then it goes back to http://localhost:8100/#/login
Secondly, when I build the project via Xocde and run on my device, the InAppBrowser plugin seems to no longer be closing right away but instead freezes with a white screen. The logs in Xcode show the following
THREAD WARNING: ['InAppBrowser'] took '79.103027' ms. Plugin should use a background thread.
NSURLSession/NSURLConnection HTTP load failed (kCFStreamErrorDomainSSL, -9802)
webView:didFailLoadWithError - -1200: An SSL error has occurred and a secure connection to the server cannot be made.
EDIT 2
Looks like the above issues with SSL error was because of an unrelated bug with upgrading to ios 9. I've since corrected those issues and now I'm back to the original. Except now the InAppBrowser window doesn't even open, I'm still hitting the catch block with TRANSPORT_UNAVAILABLE.
Not sure exactly how I fixed this issue. Hard to isolate what was breaking originally and what was breaking due to ios 9 upgrades. But, I've been able to fix the issue. I started by blowing away the /ios and /android folders inside of /platforms. I also deleted all the plugins from the /plugins folder.
Then I added back ios and android platforms. Then I added back the plugins. Then I followed the steps found in these 2 blog posts modifying your app to be ios 9 compliment.
http://blog.ionic.io/ios-9-potential-breaking-change/
http://blog.ionic.io/preparing-for-ios-9/
Related
Messages are reported as successfully sent, but no pop-up notifications appear.
With onMessage it is sometimes possible to log the message.
Requesting an FCM token only works on localhost.
When tried on the .com site, the error message depends on whether I use the PC or chromebook - the error messages generated are different.
I have used 2 different devices, but always Chrome browser. The cloud function writes the message and the FCM response to the function log, so it confirms success in sending.
When I deleted onMessage from the recipient webpage there was no sign of any notification.
The webpage is open during these trials. This is web/javascript.
Notification permission is set to allow, in both devices.
I have spent hours on web searches trying to find any hint as to what to try.
firebase-messaging-sw.js
importScripts('https://www.gstatic.com/firebasejs/3.9.0/firebase-app.js');
importScripts('https://www.gstatic.com/firebasejs/3.9.0/firebase-messaging.js');
firebase.initializeApp({
'messagingSenderId': '593287500713'
});
const messaging = firebase.messaging();
the relevant code which runs with the webpage
messaging.onMessage(function (payload) {
console.log('Message received. ', payload);
});
I assume that without onMessage, the notifications should appear based on the Firebase SDK, but they don't. WRONG ASSUMPTION
When in the background, nothing appears. (I think notifications are supposed to appear automatically.)
I can request and receive an FCM token when running on local host but the same code throws an error when deployed. "Request is missing required Authentication..."
I have been in contact with support # Google who have assured me that this suggestion, and then another would 100% fix the problem. Nothing made any difference.
I have tried the code snippets in the Firebase docs and also github examples.
If I could find existing code that works, that would be a great start, because I think that finding a solution after about 40 hours of effort is hopeless.
Have I missed something obvious?
UPDATES....
I have found two reasons for not seeing notifications.
1) My PC had a setting which seems to have partially suppressed the display. Unexpected because YouTube notifications do display. (Open notification tray on far right bottom of screen. "focus assist" with a crescent moon symbol. If when clicked it says "on" or "alarms only" I think this restricts what is seen.)
2) My assumption based on the Firebase docs and video was that onMessage() is to prevent notifications when the user is on the webpage and to allow the developer to ignore or handle the notifications within the page. Half right. Apparently the notifications are default ignored UNLESS onMessage() does something with them. The docs give snippets of code for onMessage() but only how to log to the console.
Also, found an amusing problem. Now that my PC has registered the recipient of the messages, it receives them even if that recipient is signed out and has signed in on another device. That sounds like a problem.
The currently working version of the code. This goes in the webpage / app (NOT in the messaging-sw.js file
The introductory video to messaging suggests that it is bad UX to have notifications from a website popping up when someone is on the website. Therefore the code can include onMessage() to either ignore the notification or to handle it within the page.
The docs give a version of onMessage that just logs the notification to the console and has just a comment about doing something else.
Other parts of the docs explain that the system automatically displays notifications.
Therefore I inferred that without onMessage() the notifications would appear automatically.
It seems I was wrong.
It has taken me a massive amount of time to figure this out and to find some code to make the notifications appear. (Even now I am not sure I have grasped what is happening, but the following seems to work)
This goes in the web page / app. (Not in the messaging-sw.js. Putting it there will throw an error "using window methods")
[Do note that I also found my PC was set in a way that seemed to allow YouTube to send notifications, but was preventing the display of FCM notifications. (See explanation in question)
So far I have tested this when the use has the webpage open, the webpage in the background and when the browser is closed. Notifications appear with the default sound and are listed in the notification tray.
This also happens if the recipient is signed out of the webpage and signed in on another device.. the messages continue to go to the same device.
Messages go to devices not to users]
messaging.onMessage(function (payload) {
try{ //try???
console.log('Message received. ', payload);
noteTitle = payload.notification.title;
noteOptions = {
body: payload.notification.body,
icon: "typewriter.jpg", //this is my image in my public folder
};
console.log("title ",noteTitle, " ", payload.notification.body);
//var notification = //examples include this, seems not needed
new Notification(noteTitle, noteOptions);//This can be used to generate a local notification, without an incoming message. noteOptions has to be an object
}
catch(err){
console.log('Caught error: ',err);
}
});
``````````
I seem to be following the code as suggested by Google Labs to create serviceWorker and have written the code for pushing notifications, yet it does not seem to be showing up. It seems like the push event from the server does reach the browser, however the showNotification function is just ignored.
// in sw.js
self.addEventListener('push', function(event) {
console.log('Push Received'); // this shows up
event.waitUntil(self.registration.showNotification('Hello World'));
// tried self.registration.showNotification('Hello World') but still does not show up
});
Further to check whether the showNotification works I have put the following in the main.js.
//in main.js
console.log(Notification.permission) // shows granted
if (Notification.permission == 'granted') {
console.log('will show notification') // this gets logged
navigator.serviceWorker.getRegistration().then(function(reg) {
Console.log('reached here'); // this too gets logged
reg.showNotification('Hello world!');
});
Lastly I came across this site that some folks have used for testing
https://gauntface.github.io/simple-push-demo/
as well as
https://web-push-book.gauntface.com/demos/notification-examples/
After permitting notifications from this site, I find no notifications appearing using the screen or the given curl command.
I have tried in both Chrome and Firefox and the results are the same. I am using Chrome 68.x and Firefox 61.x on Mac OS 10.13.6
I find that the site I am using has notifications enabled in the Chrome Settings (advanced section). Even clicking on the secure part of the address bar shows that notifications have been set to allow. Is there some other settings that I am missing? Thanks
It was such a silly error. Mac OS X has a notifications settings which was (I think default) set to 'DO NOT DISTURB`. Disabling that showed the push notifications. Thought other folks, like me, who may not have realised this should know.
Some additional advice for Windows 10 desktop users:
Not a -browser- notification - The notifications caused by self.registration.showNotification will not show up in the browser as you might expect. These notifications show up in the Windows Action Center.
Focus Assist - There is a "Focus Assist" setting in Windows that (analogous to the Apple setting mentioned above) determines whether notifications to the Action Center are silent or result in a toast. It does not mention Action Center.
More than one type of "Notification" Just to confuse things, the Windows "Notifications" area is a different, but related feature. The Action Center has an icon in the Taskbar Notification Area. You can read more here.
Dual Monitors - If you have more than one monitor, you will only see the Action Center icon on the task bar of your primary monitor. Further, you will only see the Action Center toast on the primary monitor.
Existing notifications suppress toasts - If the domain for your site is already listed in the Action Center, you won't see an additional toast for new messages. However, you will still see the item your site created in the Action Center. Clear that item, and your next notification will result in a toast.
Check the MacOS notifications settings -> google chrome -> allow notification
NOTE: only for Macbook users
I was looking for a reason I could not see the notifications either. but In windows I had to go to notification settings and for chrome it was disabled. In the browser allowed notifications was enabled.
I am failing to configure my Google OAuth for my Meteor app.
I was successful in setting it up a few weeks ago when it worked perfectly, but now all of a sudden I cant seem to correctly configure this.
I have tunneled my app via ngrok. Am going to give you a step by step illustration of the how I go towards setting this up. Kindly point out what am doing wrong and what I can do to rectify this.
I start in my terminal. I fire up the app using:
meteor --port 7000
I open up another terminal and fire up ngrok using:
./ngrok http 7000
This yields
In my Meteor.startup I add the following code:
../client/main.js
Meteor.startup(function () {
// Client startup method.
METEOR_OFFLINE_CATALOG=1;
METEOR_PROFILE=1;
Meteor.absoluteUrl.defaultOptions.rootUrl ='http://41958975.ngrok.io';
//
});
In my browser console when I type:
Meteor.absoluteUrl()
I get
I now paste the http://41958975.ngrok.io link into the browser and get this:
Clicking on the button is followed by:
Since the steps 1 to 5 have previously been done, I jump straight to steps 6, 7, and 8.
...and complete by pasting in the Client ID and the Client Secret
then clicking on the save configuration. The results is:
Now when I click on the sign in with google button: This pops up, just like its supposed to happen.
I click on one of the account options. This is when it all goes bazurk! I am redirected back to the sign in with google button (login page) with this error message showing
Looking at the terminal, I also get this error message:
I cant seem to get beyond this point.
What am I doing wrong and how can I get beyond this point?
Looking forward to your help.
You forgot to modify your ROOT_URL when you're running your app. The very first line of your last screenshot clearly shows it:
App running at: http://localhost:7000/
Setting absoluteUrl on client won't help, because it's your server who tries to obtain a token.
It uses OAuth._redirectUri() function to get redirect_uri, and there the Meteor.absoluteUrl() is used (it takes ROOT_URL from env variables, as stated in documentation).
Thus, your redirect_uri becomes http://localhost:7000/_oauth/google and that clearly mismatches with http://41958975.ngrok.io/_oauth/google (step #7).
To fix that you should start your Meteor application like this:
ROOT_URL="http://41958975.ngrok.io" meteor
IS there a way to trick the server so I don't get this error:
Content was blocked because it was not signed by a valid security certificate.
I'm pulling an iframe of an html website into another website but I keep getting the console (chrome) error in the title of this question and in internet explorer it says:
Content was blocked because it was not signed by a valid security certificate.
Your resource probably use a self-signed SSL certificate over HTTPS protocol.
Chromium, so Google Chrome block by default this kind of resource considered unsecure.
You can bypass this this way :
Assuming your frame's URL is https://www.domain.com, open a new tab in chrome and go to https://www.domain.com.
Chrome will ask you to accept the SSL certificate. Accept it.
Then, if you reload your page with your frame, you could see that now it works
The problem as you can guess, is that each visitor of your website has to do this task to access your frame.
You can notice that chrome will block your URL for each navigation session, while chrome can memorise for ever that you trust this domain.
If your frame can be accessed by HTTP rather than HTTPS, I suggest you to use it, so this problem will be solved.
Sometimes Google Chrome throws this error, even if it should not.
I experienced it when Chrome had a new version, and it needed to be restarted.
After restarting the same page worked without any errors.
The error in the console was:
net::ERR_INSECURE_RESPONSE
I still experienced the problem described above on an Asus T100 Windows 10 test device for both (up to date) Edge and Chrome browser.
Solution was in the date/time settings of the device; somehow the date was not set correctly (date in the past). Restoring this by setting the correct date (and restarting the browsers) solved the issue for me. I hope I save someone a headache debugging this problem.
Offering another potential solution to this error.
If you have a frontend application that makes API calls to the backend, make sure you reference the domain name that the certificate has been issued to.
e.g.
https://example.com/api/etc
and not
https://123.4.5.6/api/etc
In my case, I was making API calls to a secure server with a certificate, but using the IP instead of the domain name. This threw a Failed to load resource: net::ERR_INSECURE_RESPONSE.
open up your console and hit the URL inside. it'll take you to the API page and then in the page accept the SSL certificate, go back to your app page and reload.
remember that SSL certificates should have been issued for your Dev environment before.
If you're developing, and you're developing with a Windows machine, simply add localhost as a Trusted Site.
And yes, per DarrylGriffiths' comment, although it may look like you're adding an Internet Explorer setting...
I believe those are Windows rather than IE settings. Although MS tend to assume that they're only IE (hence the alert next to "Enable Protected Mode" that it requries restarted IE)...
Try this code to watch for, and report, a possible net::ERR_INSECURE_RESPONSE
I was having this issue as well, using a self-signed certificate, which I have chosen not to save into the Chrome Settings. After accessing the https domain and accepting the certificate, the ajax call works fine. But once that acceptance has timed-out or before it has first been accepted, the jQuery.ajax() call fails silently: the timeout parameter does not seem help and the error() function never gets called.
As such, my code never receives a success() or error() call and therefore hangs. I believe this is a bug in jquery's handling of this error. My solution is to force the error() call after a specified timeout.
This code does assume a jquery ajax call of the form jQuery.ajax({url: required, success: optional, error: optional, others_ajax_params: optional}).
Note: You will likely want to change the function within the setTimeout to integrate best with your UI: rather than calling alert().
const MS_FOR_HTTPS_FAILURE = 5000;
$.orig_ajax = $.ajax;
$.ajax = function(params)
{
var complete = false;
var success = params.success;
var error = params.error;
params.success = function() {
if(!complete) {
complete = true;
if(success) success.apply(this,arguments);
}
}
params.error = function() {
if(!complete) {
complete = true;
if(error) error.apply(this,arguments);
}
}
setTimeout(function() {
if(!complete) {
complete = true;
alert("Please ensure your self-signed HTTPS certificate has been accepted. "
+ params.url);
if(params.error)
params.error( {},
"Connection failure",
"Timed out while waiting to connect to remote resource. " +
"Possibly could not authenticate HTTPS certificate." );
}
}, MS_FOR_HTTPS_FAILURE);
$.orig_ajax(params);
}
This problem is because of your https that means SSL certification. Try on Localhost.
I'm developing an app in FirefoxOS that use PushNotifications
I followed the instructions in:
https://wiki.mozilla.org/WebAPI/SimplePush
and
https://developer.mozilla.org/en-US/docs/WebAPI/Simple_Push
And All si OK, but just for the time I register the app, the moment I close the App and send a notification nothing happen, and never works again.
Why could this happen and how can I avoid it?
Without any code, I I would guess that it may have a problem with the manifest. Did you add
"messages": [
{ "push": "/index.html"},
{ "push-register": "/index.html"}
]
to it?