IIS configuration for using angular ui routing html5Mode - iis

Im using angular ui-routing but for the most encountered problem reason I want to ask something. Because of using '#' hashtag I prefered html5Mode property. But server side conf. is needed.(https://github.com/angular-ui/ui-router/wiki/Frequently-Asked-Questions#how-to-configure-your-server-to-work-with-html5mode)
I m using IIS and I put the :
<rewrite>
<rules>
<rule name="AngularJS Routes" stopProcessing="true">
<match url=".*" />
<conditions logicalGrouping="MatchAll">
<add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
<add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
<add input="{REQUEST_URI}" pattern="^/(api)" negate="true" />
</conditions>
<action type="Rewrite" url="/" />
</rule>
</rules>
</rewrite>
and install one tool which is mentioned another topic on stackoverflow
(How do I configure IIS for URL Rewriting an AngularJS application in HTML5 mode?). But now I m getting : HTTP Error 403.18 - Forbidden
The specified request cannot be processed in the application pool that is configured for this resource on the Web server.I m really spend my most of time for hashtag problem :( Please help me . What is the missing?

<match url=(.*)>
..
..
..
<action type=“Rewrite” url=“/{R:0}”>
Change these two lines and try as the rewrite should be backward resource compatible

Related

Hidden redirect IIS - web.config

I have an Windows Server hosted (IIS), in the root dir (head dir with FTP) I have a directory /www/ with an Angular SPA built, so an index.html inside.
I want to say to the server:
"Ehi, when people go to https://example.com you must to show www/index.html but with https://example.com on the URL" (so not with https://example.com/www/) is this possible??
And i have to say also:
"Ehi server! The routes are not real directory! This is an SPA!!" becouse the routing navigation is OK but the refresh doesn't works.
I think i have to write something on web.config file, but what?
Thanks in advance!
UPDATE:
I'm using:
<system.webServer>
<rewrite>
<rules>
<rule name="AngularJS Routes" stopProcessing="true">
<match url=".*" />
<conditions logicalGrouping="MatchAll">
<add input="{REQUEST_FILENAME}" matchType="IsFile"
negate="true" />
<add input="{REQUEST_FILENAME}" matchType="IsDirectory"
negate="true" />
<add input="{REQUEST_URI}" pattern="^/(api)"
negate="true" />
</conditions>
<action type="Rewrite" url="/www/" />
</rule>
</rules>
</rewrite>
</system.webServer>
This works for refresh but for "hidden redirect"...

How can I write IIS Server URL rewrite for specific route of angular 6 application that return Server Error 404?

I have hosted my angular 6 application on IIS server and there is a specific pattern that gets 404 error and the pattern is as follows:
http://localhost:4200/confirmatin/Id/token
that is
http://sandbox.app.com/confirmation/186d01b9-6984-4674-8a7f-fab03f0bd6da/CfDJ8McKuDKimzdIr7t2WefOlD1ZXQAD9C5q1aFKlmTCvVgfSvb8WdUCkGVUl5kvPvB2OdB1M2M4Ef6DMxX0b0b6cYZy7hxA%2B%2FpSyBuQbLFn0Mqw1T8mYkm6T66JCYw%2Bzp3qm0NBGuPlzo1%2BmhMePzNHb%2B1bR8rQS%2Bj8irqemy%2Bg5YJBTgyt1Cfch43zC5eneBaNu%2FNi8U5IwUT6gJLjznw%2Flutja48Jfe5DOkhlIvLWrGPNzbwZzLozqq3%2FjJIqFA88%2BQ%3D%3D
The token may contains any special characters such as /+-= etc.
If I removed the special character in the querystring, the pointer is passed to next phase with invalid token.
<system.webServer>
<rewrite>
<rules>
<rule name="angular routes" stopProcessing="true">
<match url=".*" />
<conditions logicalGrouping="MatchAll">
<add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
<add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
</conditions>
<action type="Rewrite" url="/index.html" appendQueryString="true"/>
</rule>
</rules>
</rewrite>
</system.webServer>
The angular route has following path set on routing-module.ts:
{path:'confirmation/:id/:token', component:ConfirmationComponent}
Could you please suggest what I am missing here?

IIS Rewrite rule for serverURL/Home/Index/2 URL type

I've implemented Angular 2 app with the routing, its working fine with the URL like serverURL/Home/Index its properly navigating to appropriate component without any errors.
But when I try entering serverURL/Home/Index/2 its giving me the following error
I've written below snippet in the web.config for Rewriting in IIS
<system.webServer>
<rewrite>
<rules>
<rule name="AngularJS" stopProcessing="true">
<match url=".*" />
<conditions logicalGrouping="MatchAll">
<add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
<add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
</conditions>
<action type="Rewrite" url="src/" />
</rule>
</rules>
</rewrite>
</system.webServer>
Even I've written { path: "Index/:id", component: IndexComponent }, in the routing file
Please help in this, thanks in advance.

Angular2 - page refresh 404ing when hosted in Azure

I am working on an Angular2 app. It uses "#angular/common": "2.0.0-rc.4" and "#angular/router": "3.0.0-beta.2".
My problem is that when I use the browser refresh on some of the pages I see an error saying...
"The resource you are looking for has been removed, had its name changed, or is temporarily unavailable."
This also happens if I hit the url directly.
An example url is...
https://tilecasev2.azurewebsites.net/profile/therichmond
However if you view pages via the homepage they work ok but only until refreshed (https://tilecasev2.azurewebsites.net).
I have the below in my index.html head...
<base href="/">
Why does this happen and how can I fix it?
HashLocationStrategy avoids the issue by including a # in all of your angular routes but doesn't really fix it.
To make angular routes without hashes work in azure the same way they do in your local development environment, you just need to configure IIS to rewrite all requests as root. This lets angular handle the routing.
To do this, add a Web.config file to your site's root folder with the following contents:
<configuration>
<system.webServer>
<rewrite>
<rules>
<rule name="Main Rule" stopProcessing="true">
<match url=".*" />
<conditions logicalGrouping="MatchAll">
<add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
<add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
</conditions>
<action type="Rewrite" url="/" />
</rule>
</rules>
</rewrite>
</system.webServer>
</configuration>
If you deploying in same app service plan both angular and API project then this the solution.
<configuration>
<system.webServer>
<rewrite>
<rules>
<rule name="Angular" stopProcessing="true">
<match url=".*" />
<conditions logicalGrouping="MatchAll">
<add input="{REQUEST_URI}" pattern="^/api" negate="true" />
<add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
<add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
</conditions>
<action type="Rewrite" url="/" />
</rule>
</rules>
</rewrite>
</system.webServer></configuration>
for more details refer this link https://less0.github.io/azure-angular-II/
As Gunter pointed out HashLocationStrategy needed to be setup.
I followed the steps in the Angular2 docs and it all works now...
https://angular.io/docs/ts/latest/api/common/index/HashLocationStrategy-class.html

Rewrite URL encoded URL in path

My site currently handles a URL encoded URL as one of the URI segments:
https://report-uri.io/home/pkp_analyse/https%3A%2F%2Fscotthelme.co.uk
I'm trying to replicate this functionality in an Azure Web App that's running IIS/8. I already have one rewrite rule for my MVC:
<rule name="CodeIgniter rewrite" stopProcessing="false">
<match url="^(.*)$" />
<conditions>
<add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
<add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
</conditions>
<action type="Rewrite" url="index.php/{R:1}" appendQueryString="false" />
</rule>
When I try to access the URL above I get a 500 error that states the following config file is not available:
D:\home\site\wwwroot\home\pkp_analyse\https:\web.config
What would be the correct way to handle the rewrite for this?

Resources