I am trying to remove hash (#) from my url for this I did following steps
Config file
$locationProvider.html5Mode(true)
index file
<base href="/" />
.htaccess file
# 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]
After did all that my single routes like localhost/login is working but nested ui-routes are not like localhost/home/contact.
Another this if I direct hit localhost its show blank page.
All working fine with #.
Related
To clean my URL from the additional #!, I followed these steps:
$locationProvider.html5Mode(true);
<base href="/">
And then I changed my hrefs to be like this /home
The links worked with me, but the problem is when I write the url manually or reload the page.
It returns an error: Cannot GET /home.
According to many posts I saw on this site, I added many different .htaccess files, and this was the latest one:
RewriteEngine On
# If an existing asset or directory is requested go to it as it is
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -f [OR]
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -d
RewriteRule ^ - [L]
# If the requested pattern is file and file doesn't exist, send 404
RewriteCond %{REQUEST_URI} ^(\/[a-z_\-\s0-9\.]+)+\.[a-zA-Z]{2,4}$
RewriteRule ^ - [L,R=404]
# otherwise use history router
RewriteRule ^ /index.html
But none of them worked.
version => 1.6.10
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.
I have a project with angularjs for front end and slim for backend api. Therefore I want to map any api/(...) to server/index.php, and map anything else to index.html. However I can't get them work together with .htaccess. api/(...) will direct to index.html instead of index.php.
This is the htaccess I'm using:
RewriteEngine on
RewriteBase /
RewriteRule ^api/ server/index.php [L]
RewriteCond %{REQUEST_FILENAME} -f
RewriteCond %{REQUEST_FILENAME} !\.private/
RewriteRule \.(jpg|png|js|css|html)$ - [L]
RewriteRule ^.* index.html [L]
This is the file structure I have now (with some files omitted):
root/
index.html
server/
index.php
.htaccess
I tried to add some random characters in .htaccess file, and got a 500 error, so the .htaccess file works. I also tried to remove the last line for index.html rule, and the api works after commenting out.
Please help me with this problem, thanks!
I finally figured out why from the best answer in this link -> view
The problem is that [L] command will not terminate the rewriting process totally, it will match from the beginning again. So in the first iteration, api/ will be changed to server/index.php. Then in the next iteration, server/index.php will be matched to index.html.
Apache will terminate rewriting process when the pattern and substitute are the same. So the way to work around it is to add termination rules. I update my htaccess, and now it works.
RewriteEngine on
# Final rule for assets
RewriteCond %{REQUEST_FILENAME} -f
RewriteCond %{REQUEST_FILENAME} !\.private/
RewriteRule \.(php|jpg|png|js|css|html)$ - [L]
# Final rule for back end index
RewriteRule ^server/index\.php$ - [L]
# Redirect to back end index
RewriteRule ^api$ server/index.php [L]
RewriteRule ^api/.* server/index.php [L]
# Final rule for front end index
RewriteRule ^index\.html$ - [L]
# Redirect to front end index
RewriteRule ^.* index.html [L]
I know that the question got answered but it might help those people who want to host their React (front end) and Laravel (backend) on cpanel of GoDady.
Assuming that you people know the basics of cpanel, first go to the public_html and to your folder where your domain or subdomain is located.
you need to upload the application to the public html but remember when you are building react static files (npm run build) you need to define the domain name or the sub folder name with the key homepage in you package.json
or if you want to add the static files in sub folder then it is must to do
"homepage": "http://ghulam.covidbaml.com/yourSubFolderNameHere",
so, I am assuming my folders structure on the cpanel (public_html)
public_html/Static React build Files
public_html/ server (the server folder is also located in same place which contained laravel files)
Now we can write .htaccess which is really imported assuming godady linux hosting.
htaccessFile below:
Options -MultiViews
RewriteEngine on
# Rule to start the laravel api on work
RewriteRule ^server/public/index\.php$ - [L]
# Redirect to index.php
RewriteRule ^api$ server/public/index.php [L]
RewriteRule ^api/.* server/public/index.php [L]
# now I am redirecting the React index file (index.html)
RewriteCond %{REQUEST_FILENAME} !-f
RewriteRule ^ index.html [QSA,L]
note:
RewriteRule ^ index.html [QSA,L]
The above command is for the purpose of react routing that it doesn't give 404 error while you refresh the page.
Hi I want to use html5 mode. My file structure is as the following:
mypage.de/mysub
I can only mess around in mysub.
So far, I added into my index.html:
<base href="/mysub/">
And created a new (and the only one) .htaccess in /mysub/
RewriteEngine on
# 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]
If I use an url:
mypage.de/mysub/#/site1 it is transformed into mypage.de/mysub/site1 and loaded
But if I use the transformed url directly, e.g.: mypage.de/mysub/site1 I get a 404
The server is an apache:
I looked into that tutorial:
https://github.com/angular-ui/ui-router/wiki/Frequently-Asked-Questions#how-to-configure-your-server-to-work-with-html5mode
But I'm not sure what server-name is & if /path/to/app is
/
or
/mysub/
Also it throws my already an internal server error when I just leave the virtual host & the part within the directory tags.
because the .htaccess is within the directory. I tried diff. varaitions but nothing worked here so I just used the part within Directory as mentioned here:
AngularJS: can't get html5 mode urls with ui-route $state
Try this
<IfModule mod_rewrite.c>
Options +FollowSymlinks
RewriteEngine On
RewriteBase /mysub/
# 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]
</IfModule>
When I access my page from the index and start browsing everything works fine, but when I am on a route other than / for example in /details/123 and I refresh the page(I have URL rewriting configured) the route is not properly set.
It means, when I check the location path when browsing normally from the index and I am on /details/123 the location path is /details/123 as expected but when I refresh the page and I am still on /details/123 the location path changes to /123 causing ngView to display the wrong view.
I am using html5 mode and Angular v.1.1.5
UPDATE: I created a simple example here to illustrate the problem.
I don't have any special setup, I don't think is a server issue. I have the same problem with a different app in python where the redirection is done inside the application.
The .htaccess:
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*) /index.php
</IfModule>
This may be related to a nasty issue that showed up during Angular 1.1.5 and is a bug in the core library. A solution that has worked for many is to add the following tag to your index.html head.
If your application is running at the root of your domain.
<head>
...
<base href="/"></base>
...
</head>
Or if your application is running in a subdirectory, specify that subdirectory (e.g. 'myapp'):
<head>
...
<base href="/myapp/"></base>
...
</head>
Additionally, you may also try a new set of rewrite rules. This configuration has worked for many ui-router users.
<IfModule mod_rewrite.c>
RewriteEngine on
# 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]
</IfModule>