Skip to content

Commit

Permalink
update doc + add localhost in confirmation links if url is not set
Browse files Browse the repository at this point in the history 
Signed-off-by: Pierre No毛l <petersg83@gmail.com>
  • Loading branch information
@petersg83
petersg83 committed Jul 17, 2020
1 parent cd710d3 commit 9fc601e
Show file tree
Hide file tree
Showing 5 changed files with 70 additions and 60 deletions.
30 changes: 15 additions & 15 deletions docs/v3.x/concepts/configurations.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -168,21 +168,21 @@ module.exports = ({ env }) => ({

**Available options**

| Property | Description | Type | Default |
| ------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ------------- | ----------- |
| `host` | Host name | string | `localhost` |
| `port` | Port on which the server should be running. | integer | `1337` |
| `emitErrors` | Enable errors to be emitted to `koa` when they happen in order to attach custom logic or use error reporting services. | boolean | `false` |
| `url` | Url of the server. Enable proxy support such as Apache or Nginx, example: `https://mywebsite.com/api`. The url can be relative, if so, it is used with `http://${host}:${port}` as the base url. | string | `''` |
| `cron` | Cron configuration (powered by [`node-schedule`](https://github.com/node-schedule/node-schedule)) | Object | |
| `cron.enabled` | Enable or disable CRON tasks to schedule jobs at specific dates. | boolean | `false` |
| `admin` | Admin panel configuration | Object | |
| `admin.url` | Url of your admin panel. Default value: `/admin`. Note: If the url is relative, it will be concatenated with `url`. | string | `/admin` |
| `admin.autoOpen` | Enable or disabled administration opening on start. | boolean | `true` |
| `admin.watchIgnoreFiles` | Add custom files that should not be watched during development. See more [here](https://github.com/paulmillr/chokidar#path-filtering) (property `ignored`). | Array(string) | `[]` |
| `admin.host` | Use a different host for the admin panel. Only used along with `strapi develop --watch-admin` | string | `localhost` |
| `admin.port` | Use a different port for the admin panel. Only used along with `strapi develop --watch-admin` | string | `8000` |
| `admin.serveAdminPanel` | If false, the admin panel won't be served. Note: the `index.html` will still be served, see [defaultIndex option](./middlewares#global-middlewares) | boolean | `true` |
| Property | Description | Type | Default |
| ------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------- | ----------- |
| `host` | Host name | string | `localhost` |
| `port` | Port on which the server should be running. | integer | `1337` |
| `emitErrors` | Enable errors to be emitted to `koa` when they happen in order to attach custom logic or use error reporting services. | boolean | `false` |
| `url` | Public url of the server. Required for many different features (ex: reset password, third login providers etc.). Also enables proxy support such as Apache or Nginx, example: `https://mywebsite.com/api`. The url can be relative, if so, it is used with `http://${host}:${port}` as the base url. | string | `''` |
| `cron` | Cron configuration (powered by [`node-schedule`](https://github.com/node-schedule/node-schedule)) | Object | |
| `cron.enabled` | Enable or disable CRON tasks to schedule jobs at specific dates. | boolean | `false` |
| `admin` | Admin panel configuration | Object | |
| `admin.url` | Url of your admin panel. Default value: `/admin`. Note: If the url is relative, it will be concatenated with `url`. | string | `/admin` |
| `admin.autoOpen` | Enable or disabled administration opening on start. | boolean | `true` |
| `admin.watchIgnoreFiles` | Add custom files that should not be watched during development. See more [here](https://github.com/paulmillr/chokidar#path-filtering) (property `ignored`). | Array(string) | `[]` |
| `admin.host` | Use a different host for the admin panel. Only used along with `strapi develop --watch-admin` | string | `localhost` |
| `admin.port` | Use a different port for the admin panel. Only used along with `strapi develop --watch-admin` | string | `8000` |
| `admin.serveAdminPanel` | If false, the admin panel won't be served. Note: the `index.html` will still be served, see [defaultIndex option](./middlewares#global-middlewares) | boolean | `true` |

## Functions

Expand Down
70 changes: 41 additions & 29 deletions docs/v3.x/plugins/users-permissions.md
View file
Original file line number Diff line number Diff line change
Expand Up @@ -484,88 +484,100 @@ Response payload:
}
```

### Forgotten password
### Forgotten & reset password

This action sends an email to a user with the link to your reset password page. This link contains a URL param `code` which is required to reset user password.
**Can only be used for users registered using the email provider.**

#### Usage
The flow was thought this way:

1. The user goes to your **forgotten password page**
2. The user enters his/her email address
3. Your forgotten password page sends a request to the backend to send an email with the reset password link to the user
4. The user receives the email, and clicks on the special link
5. The link redirects the user to your **reset password page**
6. The user enters his/her new password
7. The **reset password page** sends a request to the backend with the new password
8. If the request contains the code contained in the link at step 3., the password is updated
9. The user can log in with the new password

In the following section we will detail steps 3. and 7..

#### Forgotten password: ask for the reset password link

This action sends an email to a user with the link to your own reset password page.
The link will be enriched with the url param `code` that is needed for the [reset password](#reset-password) at step 7..

First, you must specify the url to your reset password page in the admin panel: **Roles & Permissions > Advanced Settings > Reset Password Page**.

- `email` is your user email.
Then, your **forgotten password page** has to make the following request to your backend.

```js
import axios from 'axios';

// Request API.
axios
.post('http://localhost:1337/auth/forgot-password', {
email: 'user@strapi.io',
email: 'user@strapi.io', // user's email
})
.then(response => {
// Handle success.
console.log('Your user received an email');
})
.catch(error => {
// Handle error.
console.log('An error occurred:', error.response);
});
```

This action will send the user an email that contains a URL with the needed code for the [reset password](#reset-password).
The URL must link to your reset password form in your frontend application.
#### Reset Password: send the new password

To configure it you will have to go in the Roles & Permissions settings and navigate to the Advanced Settings tab.
This action will update the user password.
Also works with the [GraphQL Plugin](./graphql.md), with the `resetPassword` mutation.

### Reset Password

This action will reset the user password.
Also works with the [GraphQL Plugin](./graphql.md), exposes `resetPassword` mutation.

#### Usage

- `code` is the url params received from the email link (see forgot password)
Your **reset password page** has to make the following request to your backend.

```js
import axios from 'axios';

// Request API.
axios
.post('http://localhost:1337/auth/reset-password', {
code: 'privateCode',
password: 'myNewPassword',
passwordConfirmation: 'myNewPassword',
code: 'privateCode', // code contained in the reset link of step 3.
password: 'userNewPassword',
passwordConfirmation: 'userNewPassword',
})
.then(response => {
// Handle success.
console.log("Your user's password has been reset.");
})
.catch(error => {
// Handle error.
console.log('An error occurred:', error.response);
});
```

Congrats, you're done!

### Email validation

This action sends an email to the user with the link to confirm the user.
:::tip NOTE
In production, make sure the `url` config property is set. Otherwise the validation link will redirect to `localhost`. More info on the config [here](../concepts/configurations.html#server).
:::

#### Usage
After having registered, if you have set **Enable email confirmation** to **ON**, the user will receive a confirmation link by email. The user has to click on it to validate his/her registration.

_Example of the confirmation link:_ `https://yourwebsite.fr/auth/email-confirmation?confirmation=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6MywiaWF0IjoxNTk0OTgxMTE3LCJleHAiOjE1OTc1NzMxMTd9.0WeB-mvuguMyr4eY8CypTZDkunR--vZYzZH6h6sChFg`

- email is the user email.
If needed, you can re-send the confirmation email by making the following request.

```js
import axios from 'axios';

// Request API.
axios
.post(`http://localhost:1337/auth/send-email-confirmation`, {
email: 'user@strapi.io',
email: 'user@strapi.io', // user's email
})
.then(response => {
// Handle success.
console.log('Your user received an email');
})
.catch(error => {
// Handle error.
console.error('An error occurred:', error.response);
});
```
Expand Down
20 changes: 8 additions & 12 deletions packages/strapi-plugin-users-permissions/admin/src/components/EditForm/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -64,8 +64,7 @@ function EditForm({ onChange, showLoaders, values }) {
id: 'users-permissions.EditForm.inputToggle.label.sign-up',
}}
inputDescription={{
id:
'users-permissions.EditForm.inputToggle.description.sign-up',
id: 'users-permissions.EditForm.inputToggle.description.sign-up',
}}
name="advanced.settings.allow_register"
onChange={onChange}
Expand All @@ -75,27 +74,24 @@ function EditForm({ onChange, showLoaders, values }) {
<div className="col-6"></div>
<Input
label={{
id:
'users-permissions.EditForm.inputToggle.label.email-reset-password',
id: 'users-permissions.EditForm.inputToggle.label.email-reset-password',
}}
inputDescription={{
id:
'users-permissions.EditForm.inputToggle.description.email-reset-password',
id: 'users-permissions.EditForm.inputToggle.description.email-reset-password',
}}
name="advanced.settings.email_reset_password"
onChange={onChange}
placeholder="ex: https://yourfrontend.com/reset-password"
type="text"
value={get(settings, 'email_reset_password')}
/>
<div className="col-6"></div>
<Input
label={{
id:
'users-permissions.EditForm.inputToggle.label.email-confirmation',
id: 'users-permissions.EditForm.inputToggle.label.email-confirmation',
}}
inputDescription={{
id:
'users-permissions.EditForm.inputToggle.description.email-confirmation',
id: 'users-permissions.EditForm.inputToggle.description.email-confirmation',
}}
name="advanced.settings.email_confirmation"
onChange={onChange}
Expand All @@ -105,8 +101,7 @@ function EditForm({ onChange, showLoaders, values }) {
<div className="col-6"></div>
<Input
label={{
id:
'users-permissions.EditForm.inputToggle.label.email-confirmation-redirection',
id: 'users-permissions.EditForm.inputToggle.label.email-confirmation-redirection',
}}
inputDescription={{
id:
Expand All @@ -115,6 +110,7 @@ function EditForm({ onChange, showLoaders, values }) {
name="advanced.settings.email_confirmation_redirection"
onChange={onChange}
type="text"
placeholder="ex: https://yourfrontend.com/confirmation/success"
value={get(settings, 'email_confirmation_redirection')}
/>
</div>
Expand Down
4 changes: 2 additions & 2 deletions packages/strapi-plugin-users-permissions/config/functions/bootstrap.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -156,8 +156,8 @@ module.exports = async () => {
unique_email: true,
allow_register: true,
email_confirmation: false,
email_confirmation_redirection: `${strapi.config.admin.url}/admin`,
email_reset_password: `${strapi.config.admin.url}/admin`,
email_reset_password: null,
email_confirmation_redirection: null,
default_role: 'authenticated',
};

Expand Down
6 changes: 4 additions & 2 deletions packages/strapi-plugin-users-permissions/controllers/Auth.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ const crypto = require('crypto');
const _ = require('lodash');
const grant = require('grant-koa');
const { sanitizeEntity } = require('strapi-utils');
const { getAbsoluteServerUrl } = require('strapi-utils');

const emailRegExp = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
const formatError = error => [
Expand Down Expand Up @@ -494,7 +495,7 @@ module.exports = {
settings.message = await strapi.plugins[
'users-permissions'
].services.userspermissions.template(settings.message, {
URL: `${strapi.config.server.url}/auth/email-confirmation`,
URL: `${getAbsoluteServerUrl(strapi.config)}/auth/email-confirmation`,
USER: _.omit(user.toJSON ? user.toJSON() : user, [
'password',
'resetPasswordToken',
Expand Down Expand Up @@ -639,11 +640,12 @@ module.exports = {
});

const userInfo = _.omit(user, ['password', 'resetPasswordToken', 'role', 'provider']);
console.log('getAbsoluteServerUrl(strapi.config)', getAbsoluteServerUrl(strapi.config));

settings.message = await strapi.plugins['users-permissions'].services.userspermissions.template(
settings.message,
{
URL: `${strapi.config.server.url}/auth/email-confirmation`,
URL: `${getAbsoluteServerUrl(strapi.config)}/auth/email-confirmation`, // ICICI
USER: userInfo,
CODE: jwt,
}
Expand Down

0 comments on commit 9fc601e

Please sign in to comment.