Angular Url not working after removing # in new tab or after reload - angularjs

I am working in angular project. I am using angular ui routing. link is http://keraiz.com. I need to remove # from url. so I enable html5 mode by
$locationProvider.html5Mode(true);
The I define base href by <base href = '/' />
then I write rewite rules in .htassess file -
RewriteEngine On
RewriteBase /
RewriteCond %{REQUEST_URI} !^(/index\.php|/img|/js|/css|/robots\.txt|/favicon\.ico)
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ./index.html [L]
Now on same tab it is working fine. but If I reload link or open line in new tab it jump on 404 page. so how can I resolve this issue. I don't want to go 404 page. like if there is request of keraiz.com/about then i want to go about page

Related

React router not working in full refresh the page in apache server

I have created a new application in my local environment. After completed my application, I was trying to run the build files in apache server. Everything is working fine as expected. After navigating the menu, If I click the refresh button the page is goes not found.
I am using browser router for this and I don't to use hash router.
Could you please help anyone to resolve this problem.
Thanks in advance
This is my env file
PUBLIC_URL=/crud
This is my Htaccess file
RewriteEngine On
RewriteBase /
RewriteRule ^index\.html$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.html [L]

Reloading agnularjs app htaccess issue

I'm trying to set .htaccess file so after reload it will first load index.html and then change route so my routing will notice it.
I added
$locationProvider.html5Mode(true);
to angularjs .config
and my htaccess is:
RewriteEngine On
Options FollowSymLinks
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ /#/$1 [L]
the bahoviour is that my spa when I load index.html is working correctly but then when I navigate to some route and press refresh it say:
Cannot GET /mailbox
What's wrong with my htaccess file? It's in root directory of project.
I'm running my project by live-server.

how to hide id from the url of the angularjs website

my current URL is:http://xyz.services/50/home.
i want to change this URL to http://xyz.services/.
can anyone help me how to do this.50 is the id of the page.
the whole content of the page come from the database.
below is my .htaccess
RewriteEngine on
#RewriteRule /(.*)/(.*)/$ pages.html?menu_id=$1&page_title=$2
#RewriteRule /(.*)/(.*)/$ page.php?category=$1&product=$2
# Don't rewrite files or directories
RewriteCond %{REQUEST_FILENAME} -f [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^ - [L]
# Rewrite everything else to index.html to allow html5 state links
RewriteRule ^ index.html [L]
Have a look at How can i hide the full url of my website?
This is not angular specific, but more of a configuration on the server you are deploying to.

HTaccess combined with AngularJS

I've coded a brand new website as a side project and I'd like it to get indexed by Google and co.
The website has been made with AngularJS and optimised for SEO (at least, I tried to).
So far, Google has indexed each page in a terrible way:
www.mywebsite.com/#!/post/title-of-this-post/
While the page has been declared in a sitemap.xml:
<url>
<loc>http://mywebsite.com/post/title-of-this-post</loc>
<lastmod>2015-08-04T00:00:00+00:00</lastmod>
<changefreq>daily</changefreq>
</url>
The Website is using HTML5 routes to remove the #! symbols.
When I try to reach the indexed page, it goes to the home one. I need to remove the trailing slash.
So far, I've been able to create the following HtAccess file:
DirectoryIndex index.html
RewriteEngine On
RewriteBase /
# BEGIN Seo crawler
RewriteCond %{QUERY_STRING} ^_escaped_fragment_=(.*)$
RewriteRule ^$ /crawler.php$1 [QSA,L]
# END Seo crawler
# BEGIN sitemap and rss
RewriteRule ^sitemap.xml$ sitemap.php [L]
RewriteRule ^rss.xml$ rssfeed.php [L]
# END sitemap and rss
# BEGIN Remove trailing slash from URLs
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_URI} (.*)$
RewriteRule (.+)/$ http://%{HTTP_HOST}/$1 [R=301,L]
# END Remove trailing slash from URLs
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_URI} !index
RewriteRule (.*) index.html [L]
But this doesn't work.
Typing http://mywebsite.com/post/title-of-this-post/ will correctly redirect to http://mywebsite.com/post/title-of-this-post (Trailing slash is removed).
Typing www.mywebsite.com/#!/post/title-of-this-post/ will sadly redirect to www.mywebsite.com/home.
Typing www.mywebsite.com/#!/post/title-of-this-post (Without the trailing slash) will correctly redirect to http://mywebsite.com/post/title-of-this-post.
Is there a way to achieve that ?
I'm using Route UI on my AngularJS Project.
Finally, I've managed to fix it on my own:
Just add this piece of code to your AngularJS source:
app.config(function ($urlMatcherFactoryProvider) {
$urlMatcherFactoryProvider.caseInsensitive(true);
$urlMatcherFactoryProvider.strictMode(false);
});

AngularJS multilevel routing reload issue

I am working on AngularJs with HTML5 mode enabled for SEO friendly URLs, its working fine with the in app navigation but on reload.
Have written below .htaccess but still facing the same issues for nested navigation
RewriteEngine On
RewriteBase /akv/
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_URI} !index
RewriteCond %{REQUEST_URI} !.*\.(css|js|html|png|jpeg|gif|)
RewriteRule (.*) index.html [L]
Its working fine for fist level navigation like base/Blog or base/Portfolio but base/Blog/MyBlogTitle/type/post/id/1
Is there is any way to fix it.
Thanks in advanced.
Problem is that you're using relative URLs in your css/image/js paths. Relative URLs are resolved as browser adds them to the current path thus giving you 404 when using pretty URLs.
To fix this problem you can add this in your page's HTML <head> section:
<base href="/kv/" />
so that every relative URL is resolved from that URL and not the current page's URL.

Resources