We Keep Coding

Detect if page was opened from app

This applies both to Android and iOS. My web page may be sometimes opened by an app (you go to the app, and click a link there which opens the page).
I want to know if the page was accessed through an app or if the user got to it, let's say, by typing the address on the browser.
If accessed through an app, I don't need to know which app it was.
The only thing I know of is document.referrer, but it seems to return "" when the page has been opened by the app. Unfortunately using "" as an indicator is not possible, as other ways of getting to the page may also show "" (for example typing the address). The history object does not seem to contain the info I'm looking for either.
I am using a Zendesk Help Center, so I only have access to the javascript of the page in order to detect this. I can't make changes on the server-side of my page.
Alternatively, I may be able to talk to the people in charge of the app so that they include something when the app opens the browser which would allow me to access that info on the browser, but I am not sure what that could be. Any ideas?
Thank you!

It seems to me like your best bet would be to have specific links for your site that will let you know that the link came from the app.
Like so: http://www.yoursite.com/?openedFromApp
You will use those links inside the app that will be directing users to your website.
That way, if you were using PHP as your server-side language you'd be able to check if the openedFromApp URL parameter was set like so:
<?php
if(isset($_GET['openedFromApp'])) {
echo "The website was opened by an app";
}
else { echo "The website was opened normally"; }
?>
If you want to check if the openedFromApp URL parameter is set using Javascript you'd have to create your own function for accessing URL parameters as Javascript does not have a built-in way of accessing them.
But this link could help you access the URL parameters with Javascript: https://stackoverflow.com/questions/...

Remove hash from URL, load the page at hash-less URL, then add hash to URL without reloading the page

I'm working on a website that uses AJAX loading with some jQuery animations.
With JavaScript, I grab the href from a dynamically generated link to a PHP-based page, and then add that href to URL (after the inevitable #/) .
So far so good, except if a user bookmarks the page and tries to access it, that user will arrive to the home page, instead of the page he/she expected to access.
So, when a page is accessed directly, not by clicking on the internal link of the website, I want to remove #/ from the url, but keep everything after it, so that URL that was bookmarked like this:
http://www.mysite.com/#/somepage
gets rewritten as this:
http://www.mysite.com/somepage
THEN, after the proper page ( http://www.mysite.com/somepage ) finished loading, I want to stick #/ back into its former place in URL ( http://www.mysite.com/#/somepage ), without reloading the page (which, thanks to a clever snippet I'm using, will ensure that the rest of the navigation works the way it should.)
So:
Before page loads, check URL and if it has #/, remove it.
Load page located at hash-less url
Redisplay the url with #/, without reloading the page.
Is it even doable? If yes, I'd be grateful for a lesson.

What you are trying to do is doable but an utter PITA to maintain, and it will not be available on all browsers. That aside, the key resides in the history object relatively recently extended to add a new set of "tricks". Its full doc is available from MDN.
What you are after to do this is the replaceState command. Reads as follows:
Updates the most recent entry on the history stack to have the specified data, title, and, if provided, URL. The data is treated as opaque by the DOM; you may specify any JavaScript object that can be serialized. Note that Firefox currently ignores the title parameter; for more information, see manipulating the browser history.
This will allow you to replace your current page in the history of the browser, but not in the URL. The URL will be exactly as you have it - with the hash. No point changing it considering your solution.
However, you will have to make sure that your hashless page redirects to the hash-present page for clients with the history object, for consistency. That's the only requirement.

Before page loads, check URL and if it has #/, remove it.
Not possible. The fragment id is not sent to the server, so you can only access it with client side code and that requires the page to load (or at least to start loading).
Load page located at hash-less url
Redisplay the url with #/, without reloading the page
Use XMLHttpRequest to get the data, DOM to change the document to use it, and the history API to change the URL in the address bar.

As has been pointed out in one of the answers, you can't remove hash before your page loads.
However, once the page started loading, the manipulation described in the question is possible.
Here's one way to do it.
// Remove the hash and reload the page at url without hash
if (window.location.href.indexOf('/#/')>=0) {
window.location = window.location.href.replace(/\/#\//, '/');
}
Once the new page started loading, you can use history.pushState to update the URL display:
if ((window.location.href.indexOf('/#/')<1) && (location.pathname != "/")) {
history.pushState({}, "page x", location.protocol + '//' + location.host + '/#' + location.pathname);
}
You gotta keep in mind though that pushState is only available for browsers started with Gecko 2.0, so placing the hash back into the url will not work in older browsers, period.
This may lead to some unfortunate situations. For example, hypothetically, your url http://www.mywebsite.com/somepage gets indexed by a search engine. A user clicks on that link, accessing your website in an older browser that doesn't support pushState, and then clicks on some other link when browsing your AJAX-enabled website. That user is likely to arrive to
http://www.mysite.com/somepage/#/someotherpage
And then, as the user keeps clicking, it will only keep getting worse:
http://www.mysite.com/somepage/#/someotherpage/#/yetanotherpage/#/andsoon/#/andsoforth/
So what you probably need is something to make sure that your hashes don't keep propagating.
You can also wrap your hash removing / replacing code in a conditional:
if (history.pushState) {
// add hash
} else {
// provide some alternative
}
Finally, look into these two resources. You may not need the hash at all: History.js and jQuery Address.

How can I change URL without refreshing page like Google+?

When I was examining Google+, I'm surprized when I see usage of URLs. Google profile URLs change without refresing page. For example this is a photos tab URL: https://plus.google.com/104560124403688998123/photos When you click Videos tab, URL exactly goes to https://plus.google.com/104560124403688998123/videos without refreshing page. How Google coders success this?

Have a look at the history object https://developer.mozilla.org/en/DOM/Manipulating_the_browser_history
Especially history.pushState and history.replaceState
(Should mention that this only works in modern browsers, for old ones use hashes).

This is about HTML 5. take a look at "onpopstate event". For further information go to the link. http://spoiledmilk.dk/blog/html5-changing-the-browser-url-without-refreshing-page

You could try using a pushState.
You can change the URL to another URL within the same domain, but can not change the domain for security reasons.In Javascript, you can use.
window.history.pushState(“object or string”, “Title”, “/new-url”);
Object and string is your domain ex. www.google.co.in
title you can give whats you want.
and lastly you place new url ex. 'webhp?source=search_app'
ex. window.history.pushState(“www.google.co.in”, “Google”, “/webhp?source=search_app”);

You could try using a hash. This is not how google does it, but it doesn't force a refresh. In Javascript, you can use
parent.location.hash = "Text";
so that the URL will be http://yoursite.com/yourpage#text
Edit: This seems to be new to Google+. GMail uses a hash like
https://mail.google.com/mail/u/1/#inbox/130f48da33c5330

Change url via JavaScript (no hash-tag)

I'm wondering how does facebook change the url when I switch between pictures in a album? There is no hash-tag, just a real url.
Example:
The current url: facebook.com/photo.php?fbid=XXXXXX1 and if I click next, the url changes to facebook.com/photo.php?fbid=XXXXXX2
Does anybody know how to realize this with JavaScript?

Yes. Check out https://developer.mozilla.org/en/DOM/Manipulating_the_browser_history#Adding_and_modifying_history_entries
It pushes a new history state (an HTML5 thing) instead of using the hash key.

My first hunch would be:
document.location = facebook.com/photo.php?fbid=XXXXXX2;
With some way of preventing the default reload page action.

Summerizing all the answers,
we can say (I'm not a FB coder) that Facebook uses:
the HTML5 window.history.pushState / replaceState / popState methods on browser that support these methods (I think one is Chrome). In this way Facebook changes the real url (not just the part after the # character).
On other browsers, that do not support these new HTML5 methods (like IE6 / IE7 and IE8), Facebook simply changes the part of the url after the # character, by simply setting the the window.location.hash property.

On my tests, it only changes the hash tag:
E.g. the real URL is:
http://www.facebook.com/photo.php?fbid=x&set=z
and clicking next results in:
http://www.facebook.com/photo.php?fbid=x&set=z#!/photo.php?fbid=y&set=z&pid=pid&id=id
The part after the hash is setup for Google AJAX crawl. But for the purpose of the browser, it's just a hash (fragment identifier).

How to automatically replace `url` in browser address bar with JavaScript: from /en/services/ to /en/#services?

How to automatically replace url in browser address bar with JavaScript
from company.com/en/services/
to company.com/en/#services
?
Example: when I type in browser address bar url company.com/en/services/ and click 'Go', it will be automatically seen company.com/en/#services
Is there any way to replace real url /services/ with hash url /#services without browser refresh and no redirecting? Does jQuery has some solution for that?

You can't change the URL with Javascript for the current page. You can only change the hash like this (without causing a refresh):
window.location.hash = '#services';
So when you're at the page company.com/en/ and then click something, you could then set the window.location.hash. For example, it could be changed to company.com/en/#anything_you_set. The only other way is to do what Pekka suggested and reload the page.
If you want them to type the url and have it change to the hash, you're going to have to look up URL Rewriting (at least for ASP.NET and IIS). If you're on IIS7, you can use the URL Rewrite Module.
If you're on apache, you can read this URL rewrite tutorial.

You could do something like this:
$(document).ready(function() {
window.document.location.href = 'company.com/en/#services'
});

I'd go with:
<script>
document.replace("/en/#services");
</script>
<meta http-equiv="refresh" content="0;url=/en/#services" />
on /en/services/
Document.replace(url) will have the browser load the new page, and the old one won't be in the history, so when the user hits back, they won't get stuck in loop. The meta catches people without JS.
I don't think that you can't reliably do this with a server-side redirect, as many browsers (and the HTTP spec) consider the hash client-side only, and so it doesn't survive the redirect.

I found the solution in http://www.asual.com/jquery/address/.