Registering user over an e-mail

JD 1

I have a legacy app that registers user (user first and second name, e-mail and password) with the server. Server accepts registration (creates the login entry in the database) and sends a verification e-mail to the user to verify that the user has requested the registration (http://localhost/account/verify-email?token=7F1A34629233B48AE101B35D16EBA76EDE34D65A626FA7980DFF3233F7A7F1BB340656B352274CCC&DOB=1961-03-24) When the user clicks (upon receiving an e-mail) on the link, it should get routed (route value is account/verify-email) to the the angular VerifyEmailComponent that displays the verification message and then displays login page. My problem is that when the user clicks on the link above it displays a 404 error (page not available). I don't even know where to start investigating the issue. Can somebody help me please?

Lex Li (Microsoft) 5,322 Reputation points Microsoft Employee

2024-02-25T15:28:57.74+00:00
A few things you might check:

What is the substatus of that 404 error? IIS log files or FRT can tell https://learn.microsoft.com/en-us/troubleshoot/developer/webapps/iis/health-diagnostic-performance/troubleshoot-failed-requests-using-tracing-in-iis-85

Does that URL work when you run this Angular web app on the development server like ng serve?

What's the content of web.config when you host this web app on IIS?
JD 1 Reputation point

2024-02-25T15:57:59.73+00:00

Sorry - wrong post
JD 1 Reputation point

2024-02-25T16:08:15.1533333+00:00
Status is 404.0 - so I guess substatus is 0 - is that right? Untitled.png IIS log file that I found u_ex240225.log does not contain anything significant

URL work on my development machine but it is not working on new machine (does not have to be run as ng serve)

My web.config web.xml
Lex Li (Microsoft) 5,322 Reputation points Microsoft Employee

2024-02-26T05:01:36.5866667+00:00

I think <action type="Rewrite" url="/scheduler/index.html"/> is the cause. You created a site on IIS and wanted http://localhost/account/verify-email to work, but any reason not pointing the IIS site to the folder containing its index page so that you can simply use /index.html in this rule?
JD 1 Reputation point

2024-02-26T08:27:27.5733333+00:00

In my legacy index.html I have <base href="/scheduler/"> - I think that this is what makes the index.html file relative to /scheduler/ in web.config (url="/scheduler/index.html). Am I right or am I completely off topic and don't understand something? The strange thing is that this configuration works on one laptop but does not work on another one. Should I change something in my config? I am open for anything for as long as it works.
Yurong Dai-MSFT 2,811 Reputation points Microsoft Vendor

2024-02-26T08:48:59.0433333+00:00
Hi @JD,

Based on the web.config file you provided, you are configuring a URL rewrite rule to force all requests to be redirected to the scheduler/index.html file. This is typically the configuration required for Angular applications when using HTML5 history routing mode. However, if your verification link http://localhost/account/verify-email?token=... is not routed correctly to your Angular application, it may be due to this rule.

Specifically, your server may be trying to find the file for /account/verify-email in the file system, when in fact this is a route controlled by Angular and not an actual file on the server.

You can try modifying your web.config file to exclude your validation links from being affected by the rewrite rules. Here is a possible modification:

<add input="{REQUEST_URI}" pattern="^/account/verify-email" negate="true"/>

Added a condition to the rule to exclude the verification link path /account/verify-email to ensure that this path is not affected by the rewrite rule. This way, when the user clicks on the verification link, the server will not try to redirect the request, but will instead send it to the Angular application, and Angular will handle the routing.

JD 1

Thanks for you help. I have created an effective web.config as below - I have not replaced any existing values (should I ?) - just added the item that you mentioned in your post to the end of the list of existing rules - but it did not work - I am still getting 404.0 error.

In Angular routing configuration I have :

const routes: Routes = [
    { path: '', component: HomeComponent, canActivate: [AuthGuard] },
    { path: 'account', loadChildren: accountModule },
     -----------------------------------------------------------------
    { path: 'profile', loadChildren: profileModule, canActivate: [AuthGuard] },
    { path: 'admin', loadChildren: adminModule, canActivate: [AuthGuard], data: { roles: [Role.Admin] } },
    { path: 'schedule', loadChildren: scheduleModule },
    { path: 'report', component: RaportForDateComponent },
    { path: 'floating', component: FloatingSchedulesComponent },

    // otherwise redirect to home
    { path: '**', redirectTo: '' }
];

const routes: Routes = [
    {
        path: '', component: LayoutComponent,
        children: [
            { path: 'login', component: LoginComponent },
            { path: 'register', component: RegisterComponent },
            { path: 'verify-email', component: VerifyEmailComponent },
             ----------------------------------------------
            { path: 'forgot-password', component: ForgotPasswordComponent },
            { path: 'reset-password', component: ResetPasswordComponent }
        ]
    }
];

<?xml version="1.0" encoding="UTF-8"?>`
`<configuration>`
`	<system.webServer>`
`		<rewrite>`
`			<rules>`
`				<rule name="Force Index.html" enabled="true" stopProcessing="true">`
`					<match url="(.*)"/>`
`					<conditions>`
`						<add input="{REQUEST_URI}" matchType="IsDirectory" negate="true"/>`
`						<add input="{REQUEST_URI}" matchType="IsFile" negate="true"/>`
`						<add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true"/>`
`						<add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true"/>`
`						<add input="{REQUEST_URI}" pattern="^/account/verify-email" negate="true"/>`
`					</conditions>`
`					<action type="Rewrite" url="/scheduler/index.html"/>`
`				</rule>`
`				`
`			</rules>`
`		</rewrite>`
`	</system.webServer>`
`</configuration>`

JD 1 Reputation point

2024-02-26T10:28:53.4766667+00:00

Sorry for the duplicate message
JD 1 Reputation point

2024-02-26T11:36:45.0433333+00:00

When you say

Based on the web.config file you provided, you are configuring a URL rewrite rule to force all requests to be redirected to the scheduler/index.html file

do you mean that all requests will be redirected to angular router (scheduler/index.html)? right?
Yurong Dai-MSFT 2,811 Reputation points Microsoft Vendor

2024-02-27T09:48:00.49+00:00

Yes, this means that when a request is made to the server, the URL rewrite rule will send the request to Scheduler/index.html regardless of the URL path. In the context of an Angular application, this typically serves as the entry point to the Angular Router. Angular's routing mechanism then takes over, interpreting the URL and navigating to the appropriate component based on the routes defined in the Angular application. Is this how you set it up?
JD 1 Reputation point

2024-02-27T12:45:18.8233333+00:00
Isn't the rule :

<add input="{REQUEST_URI}" pattern="^/account/verify-email" negate="true"/>

blocking the request /account/verify-email to my angular app as the negate="true"?
JD 1 Reputation point

2024-02-27T12:57:10.59+00:00

Sorry for the duplicate question
Deleted

This comment has been deleted due to a violation of our Code of Conduct. The comment was manually reported or identified through automated detection before action was taken. Please refer to our Code of Conduct for more information.

1 answer

Bruce (SqlWork.com) 61,731 Reputation points

2024-02-25T16:48:58.8533333+00:00

For the link to work, the server needs to know that /account/verify is not a real page request, but a request to load the angular hosting page instead that will use angular routing to access the component.

how this is accomplished will depend on the hosting infrastructure.
Please sign in to rate this answer.

1 person found this answer helpful.
JD 1 Reputation point

2024-02-25T18:24:35.2933333+00:00

What sort of infrastructure - could you please elaborate on this?
Sign in to comment

Share via

Registering user over an e-mail

1 answer