with the previous Phonegap version, I used to open google maps from the app simply opening with an href an url, like this https://www.google.com/maps/dir/?api=1&origin=43.9815648,7.5328161&destination=41.802425,12.6021389
But I noticed, with Phonegap 7, that when I tap on the href element, nothing happens. Why?
How can I fix this and open google maps with a given itinerary?
The pages you can load, scripts you can load, etc, are now controlled by CSP (Content Security Policy), rather than just the old WhiteList mechanism in the config.xml. So, if you want to access pages you have to setup your Content Security Policy appropriately. To use Google maps you at least need to add google.com to the default src, gstatic.com to data. These may not be enough, and if you they aren't probably the only option is looking at the errors in the developer console, see here how to get Chrome Developers console on Android, and here to see it on iOS. I always find a bunch of trial and error is required to CSP set just right.
<meta http-equiv="Content-Security-Policy" content="default-src 'self' google.com data: gap: https://ssl.gstatic.com; style-src 'self' 'unsafe-inline' google.com; media-src *">
That said, you probably don't want Google Maps taking control of your application (or maybe you do?) so other recommendations to use the In App Browser plugin would recommended. It's only adding one plugin and using some javascript to open the window:
cordova.InAppBrowser.open('https://www.google.com/maps/dir/?api=1&origin=43.9815648,7.5328161&destination=41.802425,12.6021389', '_blank', 'location=yes');
You can't redirect your Cordova/PhoneGap view to a page hosted somewhere else (as opposed on your phone) for security reasons, so you have two options:
Use a Cordova/PhoneGap plugin for Google maps such as:
https://www.npmjs.com/package/cordova-plugin-googlemaps
Use the Cordova/PhoneGap in-app browser plugin to launch your map
in a full-screen browser window within your app:
https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-inappbrowser/
Option #1 would be the preferred option.
If you want to launch the Google Maps app (as opposed to embed Google Maps in your app i.e. cordova-plugin-googlemaps), you can use the phonegap-launch-navigator plugin.
Related
We receive mp3 voicemails in Gmail. Starting today, all computers using Google Chrome can't play mp3s found in Gmail. This doesn't affect other sites that host mp3s.
Upon further inspection, the console reports:
Refused to load media from 'https://mail.google.com/mail/u/...' because it violates the following Content Security Policy directive: "media-src https://*.googlevideo.com/videoplayback/".
Is Gmail not following its new CSP policies? Is any work around other than simply downloading and playing the files?
With the Content Security Policy directive media-src https://*.googlevideo.com/videoplayback/, media files from sources different to https://*.googlevideo.com/videoplayback/ can't be played in the <video>/<audio> tags embedded into page.
Even you load media by ajax and create <audio> tag with blob:-Url, it will be blocked by above CSP.
It's not a browser dependant, that's how CSP is work.
With the current CSP restrictions, mediafiles can be played only in the isolated browsing contexts like <iframe>/<object>/<embed>.
I don't know is GMail made it intentionally or occasionally, but only browser extensions using nested browsing contexts can play media in such conditions.
In the end, I created a Chrome Extension with XMLHTTPRequest to get around CSP and to play the mp3 without a direct download.
I released a Chrome Extension called GPlayer. Waiting on Google to approve. I believe the future link is https://chrome.google.com/webstore/detail/obdmmgdlafadeehmbmcmoggnaokehnaj
Github link - https://github.com/TriStarGod/GPlayer
I have a desktop Chrome App that acts as a dashboard, and simply embeds 4 sites in webviews. Unfortunately Chrome Apps are deprecated so I'm wondering what I can use instead.
I was looking into Progressive Web Apps but it necessitates iframes, which don't work as the sites supply X-Frame-Options: DENY (not under my control unfortunately).
What is the best way of displaying 4 3rd party sites in a window, with minimal chrome (as in UI clutter)?
I made a chrome extension that loads an iframe on the gmail url. So far so good!
When I install the extension it loads the I framed with no problems but here comes the problem. If I refresh or access gmail again it doesn't work anymore with the following error, and no other errors.
Refused to frame 'https://...........com/' because it violates the
following Content Security Policy directive: "frame-src 'self'
https://clients4.google.com/insights/consumersurveys/
https://calendar.google.com/accounts/ https://ogs.google.com
https://onegoogle-autopush.sandbox.google.com
https://accounts.google.com/ https://apis.google.com/u/
https://apis.google.com/_/streamwidgets/
https://clients6.google.com/static/
https://content.googleapis.com/static/
https://mail-attachment.googleusercontent.com/
https://www.google.com/calendar/ https://calendar.google.com/calendar/
https://docs.google.com/ https://drive.google.com
https://.googleusercontent.com/docs/securesc/
https://feedback.googleusercontent.com/resources/
https://www.google.com/tools/feedback/
https://support.google.com/inapp/
https://.googleusercontent.com/gadgets/ifr
https://hangouts.google.com/ https://talkgadget.google.com/
https://.talkgadget.google.com/
https://www-gm-opensocial.googleusercontent.com/gadgets/
https://plus.google.com/ https://wallet.google.com/gmail/
https://www.youtube.com/embed/
https://clients5.google.com/pagead/drt/dn/
https://clients5.google.com/ads/measurement/jn/
https://www.gstatic.com/mail/ww/ https://www.gstatic.com/mail/intl/
https://clients5.google.com/webstore/wall/
https://ci3.googleusercontent.com/ https://workspace.google.com/u/
https://workspace.google.com/marketplace/appfinder
https://gsuite.google.com/u/
https://gsuite.google.com/marketplace/appfinder
https://www.gstatic.com/mail/promo/ https://notifications.google.com/
https://tracedepot-pa.clients6.google.com/static/
https://staging-taskassist-pa-googleapis.sandbox.google.com
https://taskassist-pa.clients6.google.com
https://.prod.amp4mail.googleusercontent.com/
https://.client-channel.google.com/client-channel/client
https://clients4.google.com/invalidation/lcs/client
https://tasks.google.com/embed/ https://keep.google.com/companion
https://addons.gsuite.google.com
https://contacts.google.com/widget/hovercard/v/2
https://gsuite.google.com
https://.googleusercontent.com/confidential-mail/attachments/".
Now. You are wondering if I put the CSP in my header. The answer is yes. I have header("Content-Security-Policy: frame-src 'self' https://*.google.com;"); in my php and the header si loaded. But the question I can't answer is: Is Chrome seeing errors after the page refresh and why?
In theory if there is a problem in the CSP it should block the iframe from the first moment, and not after a while.
Do you know anything about this?
Refused to frame 'https://...........com/' because it violates the
following Content Security Policy directive: "frame-src 'self' ... Google's domains here ...
It's not your CSP, but some of Google's iframe publish its own. Because commonly Google does not allow to embed own into third-party.
Most interesting part: 'https://...........com/' is hidden (is here your domain or not?).
Is Chrome seeing errors after the page refresh and why?
Google's services based on a lot of it own iframes, wich inter each other based on Cookie.
For example, you can embed https://gmail.com into iframe, but if you are logged into account (have auth Cookies), Gmail does auto redirect you to https://mail.google.com/mail/u/0/ page which does not allow iframing (because of X-Frame-Options deny).
Behavior of iframes of Google could be very complicated, so a exact answer "Why" is not possible without detail researches.
Anyway embed of Google services (not officially intended for embedding) into iframe is not a good idea. Google does not allow that because of security.
I have integrated Google MAP api into our application using Javascript but unfortunately it does not work in https mode until I click "Show all content" button displays in the bottom of IE. There is no problem with http mode. Please let me know how can I fix it.
are you including the Google MAP script in a protocol agnostic way or just using an http link? if you want to server both, the script pointing to google maps should be
<script src="//maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
so that either http or https is used.
If you check the 'Enable Protected Mode' box under Internet Options > Security > Local Intranet this seems to have the effect of allowing the map to display in IE 8 and 9 for users on a corporate network.
This of course seems counter-intuitive, especially given the explanation in this link
but it has solved the problem for my users on many occasions. Not ideal, but worth a shot if you can recreate the problem and see if this is the fix.
I would like to add the possibility to a simple Chrome web app, to use the Chrome Omnibox. The app should just be an icon on the start-page of chrome and add Omnibox functionality.
Adding the attribute "omnibox": { "keyword" : "x" } to my manifest.json brings up the message
Feature 'omnibox' is not accessible. Not allowed for specified package type (theme, app, etc.).
Is it possible to enable this functionality or can I develop an extension which behaves exactly like an Chrome web app, so I could use the omnibox inside that extension?
Thanks for your advise.
If you're making a Hosted App, you are very limited in what you can access. I believe a Hosted App can only perform actions that a normal HTML5 web page could (with a few narrow exceptions, like long-running background pages). If you want to include omnibox functionality, you'll have to make it a Packaged App -- but it could be a Packaged App that opens your web page like your current app and includes omnibox support, since the functionality of Packaged Apps is a superset of Hosted Apps functionality.