Introducing the New Appwrite Anonymous Login
Tags: webdev, flutter, javascript, firebase
Published: 2021-06-04 12:44:50

It is important to consider the user experience when someone first comes to your application. The registration process can often prove to be a hurdle for users to use an application, especially if parts of the application are bound to an authentication process and hidden behind a login screen. Moreover, in today's world, the issue of privacy and data protection is a delicate one, especially because of new data privacy regulation, like [GDPR](https://www.smashingmagazine.com/2018/02/gdpr-for-web-developers/) and [CPRA](https://www.forbes.com/sites/forbestechcouncil/2020/11/17/cpra-could-bring-stricter-data-privacy-enforcement-heres-how-to-prepare/).

Appwrite 0.8 introduces **Anonymous Login** as an authentication method, which allows users to create an account without providing personal information such as an email address, username or password.

# Why do we need anonymous users?

This feature is especially useful if you want to provide an easy authentication process for an [underage audience](https://www.websitepolicies.com/blog/coppa-guide), mobile apps or use cases where you don't want to store personal information to ensure users anonymity for sensitive subjects like politics or religion.

With Appwrite you can offer your users the option to create an anonymous account, as well as the possibility to convert it into a full-fledged account with an e-mail address and password or linking to an OAuth2 service provider at a later stage.

# Setup
Enough talking, let's learn how we can add Anonymous Authentication to a Web and a Flutter Application using our [Web SDK](https://appwrite.io/docs/getting-started-for-web) and [Flutter SDK](https://appwrite.io/docs/getting-started-for-flutter). The same can be done with other client SDKs we might release in the future.

### Web
The first step is to add our Web SDK to our project with NPM like this:

```bash
npm install appwrite --save
```

If you're using a bundler (like [Rollup](https://rollupjs.org/) or [webpack](https://webpack.js.org/)), you can import the Appwrite module when you need it:

```javascript
import { Appwrite } from "appwrite";
```

To install with a CDN (content delivery network) add the following scripts to the bottom of your tag, but before you use any Appwrite services:

```html
<script src="https://cdn.jsdelivr.net/npm/appwrite"></script>
```

The next step is to initialize your SDK code with your project ID which can be found in your project settings page:

```js
// Init your Web SDK
const appwrite = new Appwrite();

appwrite
    .setEndpoint('http://localhost/v1') // Your Appwrite Endpoint
    .setProject('455x34dfkj') // Your Appwrite Project ID
;
```

### Flutter
The first step is to add our Flutter SDK to our project.

Add `appwrite: ^0.6.0` or the latest version in your project's `pubspec.yaml` file under dependencies.

```yml
dependencies:
    appwrite: ^0.6.0
```
Then run following command to download the dependencies or upon saving your IDE might automatically run this command.

```bash
flutter pub get
```

Next step is to initialize your SDK code with your project ID which can be found in your project settings page:

```dart
import 'package:appwrite/appwrite.dart';
final client = Client();

client
    .setEndpoint('http://localhost/v1') // Your Appwrite Endpoint
    .setProject('455x34dfkj') // Your Appwrite Project ID
;
```

# Create an Anonymous User

Once your SDK is setup, access the Account service and call the [`createAnonymousSession()`](https://appwrite.io/docs/client/account?sdk=web#accountCreateAnonymousSession) method. 

### Web

```js
// Create an anonymous user and login
appwrite.account.createAnonymousSession()
    .then(response => {
        console.log(response); // Success
    }, error => {
        console.log(error); // Failure
    });
```

### Flutter

```dart
// Create an anonymous user and login
final account = Account(client);
try {
    final res = await account.createAnonymousSession();
    print(res);
} on AppwriteException catch(e) {
    print(e.message);
}
```

If the [`createAnonymousSession()`](https://appwrite.io/docs/client/account?sdk=web#accountCreateAnonymousSession) method completes without error, the request will create an anonymous user and automatically logs in the user, setting up the cookie for following requests. Now the user is authenticated and is allowed to access his or her private data and settings.

# Convert to Permanent User

When an anonymous user signs up, you might want to allow them to continue their work with a permanent account. This will also allow the user to recover his account in the future and switch between devices. 

With Appwrite there is 2 ways of doing so.

## E-Mail

By [updating the email address](https://appwrite.io/docs/client/account#accountUpdateEmail) of an anonymous account, we can pass an email address and a password to the `account.updateEmail` method.

### Web

```js
let promise = appwrite.account.updateEmail('email@example.com', 'secret');

promise.then(function (response) {
    console.log(response); // Success
}, function (error) {
    console.log(error); // Failure
});
```

### Flutter

```dart
try {
    final res = await account.updateEmail(email: 'email@example.com', password:'secret');
    print(res);
} on AppwriteException catch(e) {
    print(e.message);
}
```

This will convert the anonymous user to a permanent account with **email@example.com** as email and **secret** as his or her password.

## OAuth2

By calling the [`account.createOAuth2Session`](https://appwrite.io/docs/client/account#accountCreateOAuth2Session) method from an anonymous account, the user will be automatically converted.

### Web

```js
appwrite.account.createOAuth2Session('google', 'https://localhost/success', 'https://localhost/failure');
```

### Flutter

```dart
account.createOAuth2Session(provider: 'google');
```

# Conclusion

Both options offer users to transfer all their information to an account and use them on other devices.

If you need help or encounter any difficulties setting up Anonymous Login with Appwrite, please [join our Discord](https://appwrite.io/discord).

## References

- [Appwrite Discord](https://appwrite.io/discord)
- [Appwrite Documentation](https://appwrite.io/docs)
- [Appwrite Homepage](https://appwrite.io)

Photo by <a href="https://unsplash.com/@jdent?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Jason Dent</a> on <a href="https://unsplash.com/s/photos/privacy?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText">Unsplash</a>