Google Maps can now pinpoint my location with street precision with the help of Firefox.
I understand this is a new feature of HTML 5 compatible browsers and that the location is fetched by using some sort of feature of the connected WiFi network (I hope I'm not making any silly assumptions).
What I intend to know is how this whole process exactly works:
Why only in HTML 5?
Why / how does Firefox ask me to share my location with Google Maps?
What is the normal precision one can count on?
How can I implement this feature in my websites?
Thanks in advance!
How does it work?
When you visit a location-aware website in Firefox, the browser will ask you if you want to share your location.
If you consent, Firefox gathers information about nearby wireless access points and your computer’s IP address, and will get an estimate of your location by sending this information to Google Location Services (the default geolocation service in Firefox). That location estimate is then shared with the requesting website. (Source)
How accurate are the locations?
Accuracy varies greatly from location to location. In some places, the geolocation service providers may be able to provide a location to within a few meters. However, in other areas it might be much more than that. All locations are to be considered estimates as there is no guarantee on the accuracy of the locations provided. (Source)
In my case, Firefox reports that I am about 10km away from my real location.
How do I use this feature in my website?
You would do something like this:
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function(position) {
alert(position.coords.latitude + ", " + position.coords.longitude);
// Use the latitude and location as you wish. You may set a marker
// on Google Maps, for example.
});
}
else {
alert("Geolocation services are not supported by your browser.");
}
You can see an online demo here: Firefox HTML 5 Geolocation Demo (Requires a geolocation-aware browser such as Firefox 3.1b3.)
HTML5 supplies an API which allows the web browser (and then hence the server-side of an web application) to query the location and related information such as speed (if relevant), in a standard, uniform, fashion.
The host and its web browser supply the "devices" which compute/estimate the geolocation per-se
For this API to be useful, requires that the underlying host and web browser
a) allow the sharing of such info (note the privacy issue) and
b) be somewhat equipped (either locally or by way of the network they are hooked-up to) to read or estimate the geolocation.
The techniques and devices involved in computing the actual location involves a combination of the following (not all apply of course), and is independent from the HTML 5 standard:
GPS device (lots of phones now have them)
Routing info at the level of the Cell phone network
IP address / ISP routing information
Wifi router info
Fixed data, manually input (for pcs which are at a fixed location)
...
Therefore...
- HTML5 alone cannot figure out geolocation: upgrading to newer web browser, in of itself, won't be sufficient to get geolocation features in your applications etc.
- Geolocation data can be shared outside of the HTML5 API, allowing GPS-ready or GeoLocation-ready phones expose the geolocation data within other APIs.
HTML5 Geolocation API uses certain features, such as Global Positioning System (GPS), Internet Protocol (IP) address of a device, nearest mobile phone towers, and input from a user, in the users’ device to retrieve the users’ location. The users’ location retrieved by using the Geolocation API is almost accurate depending upon the type of source used to retrieve the location.
There is a really good demo of HTML5 Geolocation here (http://html5demos.com/geo). Whenever a website tries to fetch your location by using one of the following mentioned APIs, the browser will ask me your permission before invoking the API to share your location.
The Geolocation API provides the following methods:
getCurrentPosition(successCallback, errorCallback, options)
Used to retrieve the current geographical location of a user.
watchPosition(successCallback, errorCallback, options)
The function returns a watchId and calls successCallback with the updated coordinates. It continues to return updated position as the user moves (like the GPS in a car).
clearWatch(watchId)
Stops the watchPosition() method based on the watchId provided.
Sample Code:
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(userPositionSuccess, userPositionError);
} else {
alert("Your browser does not support geolocation.");
}
function userPositionSuccess(position) {
alert("Latitude: " + position.coords.latitude + " Longitude: " + position.coords.longitude);
}
function userPositionError() {
alert("There was an error retrieving your location!");
}
Related
I want to know if users are using hola better internet to browse my site. Hola! is an extension that uses a peer to peer network so users can appear to be browsing from different countries. I am worried however that some bots are using this plugin as a proxy. From what I read it does not send the X-FORWARDED-FOR header, and does not seem to announce itself on the navigator.plugins - verified with panopticlick. This seems like a huge security issue, as this plugin has 42 million users..
I see people using it to see netflix from other countries, I guess they would love to stop it too.
How do I detect users who are using this plugin?
--EDIT--
Also, see this - luminati.io - what seems to be the worlds largest botnet for hire... i cant see how they wont piss off google like this. But this does look like a great security risk to any site on the web.
Looking at the source code of the plugin there is this:
function hola_ext_present(){
// Only <html> is present at document_start time, use it as a
// storage to communicate presence of extension to web page.
document.documentElement.setAttribute('hola_ext_present', 'true');
}
so basically something like:
document.documentElement.getAttribute('hola_ext_present');
will tell you if it is present or not.
I know this should be done on server side, but what I can think for now is doing it on the client side since hola when successfully loaded it creates an attribute on html tag named hola_ext_inject.
So using jquery :
$(function() {
var hola_inject = $('html').attr('hola_ext_inject');
if (typeof hola_inject !== typeof undefined && hola_inject !== false) {
console.log('plugin exist');
}
});
I am creating a firefox OS application, I want the user to be able to share a link through any application installed and eligible (facebook, twitter etc). I saw android has this kind of feature and firefox OS has it as well, as I saw it in one of it's built in applications. Went through Web API, didn't find a suitable match,
Any ideas how to do it?
This is the intended use of the Web Activity API . The idea is that applications register to handle activities like share. The Firefox OS Boiler Plate app has several examples of using Web Activities. In that example a user could share a url using code like:
var share = document.querySelector("#share");
if (share) {
share.onclick = function () {
new MozActivity({
name: "share",
data: {
number: 1,
url: "http://robertnyman.com"
}
});
};
}
Any app that handles the share activity will be shown allowing the user to pick the proper app to handle the share.
I am working with web-socket project. We are tracking the customers of the website and showing that information to our customers dashbaord.
For this we are using pubnub service. They have api to subscribe and her_now to get currenly active connections. But seems it is not working properly. It is not tracking as we expecting.
It is not sending events properly when customers have lot of traffic(>150 active). And even his cost is too high.
We are planning to move to some other technique to do this. Please suggest which one is the good option.
How about nodejs with socket.io. One thing i am thinking the scalability when our customers have lot of traffic.
Please suggest on this.
Thanks,
Govind.
Move to Socket.io (It,s support mobile and all browser) and performance is good
Problems with online visitor tracking:
Here is my answer,When user visit you website you emit some event using following code
Server side:
var io = require('socket.io');
io.sockets.on('connection', function (socket) {
//From user
socket.on('userEnterYourWebsite',function(data){
//Do some DB operation means retrive user related information from DB
//If emit some data to user
socket.emit('sendToUser',{name:'mmm',state:'tamilnadu'});
});
});
Client Side:
<script>
var socket=io.connect('http://ipaddress:8080');
var userIDorUniqueID='mmmmmmm';
socket.emit('userEnterYourWebsite',{uniqueID:userIDorUniqueID});
//From server
socket.on('sendToUser',function(data){
console.log(data.state);
});
</script>
Property Annouce Max
You just need to set the Presence Announce Max property on the Presence add-on higher. Contact support#pubnub.com to set it higher than 100.
Build vs. Buy
What will be the cost of scaling your DIY node/socket.io solution? See the following before considering the DIY route.
http://www.pubnub.com/blog/build-vs-buy-why-diy-isnt-always-better/
http://www.pubnub.com/customers/swaplingo/
http://www.pubnub.com/customers/tint/
How can you detect the url that I am browsing in chrome/safari/firefox via cocoa (desktop app)?
As a side but related note, are there any security restrictions when developing a desktop app that the user will be alerted and asked if they want to allow? e.g. if the app accesses their contact information etc.
Looking for a cocoa based solution, not javascript.
I would do this as an extension, and because you would like to target Chrome, Safari, and Firefox, I'd use a cross-browser extension framework like Crossrider.
So go to crossrider.com, set up an account and create a new extension. Then open the background.js file and paste in code like this:
appAPI.ready(function($) {
appAPI.message.addListener({channel: "notifyPageUrl"}, function(msg) {
//Do something, like send an xhr post somewhere
// notifying you of the pageUrl that the user visited.
// The url is contained within msg.pageUrl
});
var opts = { listen: true};
// Note: When defining the callback function, the first parameter is an object that
// contains the page URL, and the second parameter contains the data passed
// to the context of the callback function.
appAPI.webRequest.onBeforeNavigate.addListener(function(details, opaqueData) {
// Where:
// * details.pageUrl is the URL of the tab requesting the page
// * opaqueData is the data passed to the context of the callback function
if(opaqueData.listen){
appAPI.message.toBackground({
msg: details.pageUrl
}, {channel: "notifyPageUrl"});
}
}, opts ); // opts is the opaque parameter that is passed to the callback function
});
Then install the extension! In the example above, nothing is being done with the detected pageUrl that the user is visiting, but you can do whatever you like here - you could send a message to the user, you could restrict access utilizing the cancel or redirectTo return parameters, you could log it locally utilizing the crossrider appAPI.db API or you could send the notification elsewhere, cross-domain, to wherever you like utilizing an XHR request from the background directly.
Hope that helps!
And to answer the question on security issues desktop-side, just note that desktop applications will have the permissions of the user under which they run. So if you are thinking of providing a desktop app that your users will run locally, say something that will detect urls they access by tapping into the network stream using something like winpcap on windows or libpcap on *nix varieties, then just be aware of that - and also that libpcap and friends would have to have access to a network card that can be placed in promiscuous mode in the first place, by the user in question.
the pcap / installed desktop app solutions are pretty invasive - most folks don't want you listening in on literally everything and may actually violate some security policies depending on where your users work - their network administrators may not appreciate you "sniffing", whether that is the actual purpose or not. Security guys can get real spooky so-to-speak on these kinds of topics.
The extension via Crossrider is probably the easiest and least intrusive way of accomplishing your goal if I understand the goal correctly.
One last note, you can get the current tab urls for all tabs using Crossrider's tabs API:
// retrieves the array of tabs
appAPI.tabs.getAllTabs(function(allTabInfo) {
// Display the array
for (var i=0; i<allTabInfo.length; i++) {
console.log(
'tabId: ' + allTabInfo[i].tabId +
' tabUrl: ' + allTabInfo[i].tabUrl
);
}
});
For the tab API, refer to:
http://docs.crossrider.com/#!/api/appAPI.tabs
For the background navigation API:
http://docs.crossrider.com/#!/api/appAPI.webRequest.onBeforeNavigate
And for the messaging:
http://docs.crossrider.com/#!/api/appAPI.message
And for the appAPI.db stuff:
http://docs.crossrider.com/#!/api/appAPI.db
Have you looked into the Scripting Bridge? You could have an app that launches, say, an Applescript which verifies if any of the well known browser is opened and ask them which documents (URL) they are viewing.
Note: It doesn't necessarily need to be an applescript; you can access the Scripting Bridge through cocoa.
It would, however, require the browser to support it. I know Safari supports it but ignore if the others do.
Just as a quick note:
There are ways to do it via AppleScript, and you can easily wrap this code into NSAppleScript calls.
Here's gist with AppleScript commands for Safari and Chrome. Firefox seems to not support AE.
Well obviously this is what I had come across on google.
chrome.tabs.
getSelected
(null,
function
(tab) {
alert
(tab.url);
}) ;
in pure javascript we can use
alert(document.URL);
alert(window.location.href)
function to get current url
I know this is possible via a simple registry change to accomplish this as long as IE/firefox is being used. However, I am wondering if there is a reliable way to do so for other browsers,
I am specifically looking for a way to do this via an installer, so editing a preference inside a specific browser will not cut it.
Here is the best I can come up with:
IE: http://msdn.microsoft.com/en-us/library/aa767914(VS.85).aspx
FireFox: http://kb.mozillazine.org/Register_protocol
Chrome: Since every other browser in seems to support the same convention, I created a bug for chrome.
Opera: I can't find any documentation, but it appears to follow the same method as IE/Firefox (see above links)
Safari: Same thing as opera, it works, but I can't find any documentation on it
Yes. Here is how to do it with FireFox:
http://kb.mozillazine.org/Register_protocol
and Opera:
http://www.opera.com/support/kb/view/535/
If someone looks like a solution for an intranet web site (for all browsers, not only IE), that contains hyperlinks to a shared server folders (like in my case) this is a possible solution:
register protocol (URI scheme) via registry (this can be done for all corporative users i suppose). For example, "myfile:" scheme. (thanks to Greg Dean's answer)
The hyperlink href attribute will then should look like
<a href='myfile:\\mysharedserver\sharedfolder\' target='_self'>Shared server</a>
Write a console application that redirects argument to windows explorer (see step 1 for example of such application)
This is piece of mine test app:
const string prefix = "myfile:";
static string ProcessInput(string s)
{
// TODO Verify and validate the input
// string as appropriate for your application.
if (s.StartsWith(prefix))
s = s.Substring(prefix.Length);
s = System.Net.WebUtility.UrlDecode(s);
Process.Start("explorer", s);
return s;
}
I think this app can be easily installed by your admins for all intranet users :)
I couldn't set up scheme setting to open such links in explorer without this separate app.