Adding a hash prefix at the config phase if it's missing

Question

I am now integrating phantom in my Angularjs-based web application.

This fine article says that I should call the $locationProvider.hashPrefix() method to set the prefix to '!' from SEO reasons(allow crawlers to intercept the _escaped_fragment component of the URL).

The problem is that I haven't though of the earlier, and some of my URLs look as following: #/home.

I though perhaps there is a way that I can implant this '!' char into the begging of the URL programmatically(in case it is not already there) at the config function of the APP, instead having to edit a lot of markup manually.

Answer 1

I've had similar problem and manually (search/replace) went through all the links and fixed them.

The other problem I had was the external sites were using the old format i.e. http://plinkplink.net/#/event/3 instead of the new format http://plinkplink.net/#!/event/3

The fix I did for that is not strictly speaking angularjs idiomatic but it does the job. I've added this script to the header of my page. It simply redirects pages with # to pages with #!:

    <script>
        var loc = window.location.href
        if (loc.indexOf("#") != -1 &&  loc.indexOf("#!") == -1 ){
            window.location.href = loc.replace("#", "#!");
        }
    </script>

I hope it helps.

Answer 2

Are you linking to the # value? ie - <a href="#/my/page"> If so, you shouldn't be. You should be linking to the url without the # prefix and I believe it'll solve your issue.