Secure storage for credentials in Flutter - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to import the Flutter secure storage package.

Flutter

import '[1]';

Drag options to blanks, or click blank then click option'

Apackage:flutter/material.dart

Bpackage:flutter_secure_storage/flutter_secure_storage.dart

Cpackage:flutter/widgets.dart

Dpackage:flutter_secure_storage/flutter_secure_storage.dartx

Attempts:

3 left

💡 Hint

Common Mistakes

Importing material.dart instead of flutter_secure_storage.

Adding extra characters at the end of the import path.

The correct import for Flutter secure storage is package:flutter_secure_storage/flutter_secure_storage.dart.

2fill in blank

medium

Complete the code to create an instance of FlutterSecureStorage.

Flutter

final storage = [1]();

Drag options to blanks, or click blank then click option'

AFlutterStorage

BSecureStorage

CSecureFlutterStorage

DFlutterSecureStorage

Attempts:

3 left

💡 Hint

Common Mistakes

Using incorrect class names like SecureStorage or FlutterStorage.

The class to create a secure storage instance is FlutterSecureStorage.

3fill in blank

hard

Fix the error in the code to write a value securely.

Flutter

await storage.write(key: 'token', value: [1]);

Drag options to blanks, or click blank then click option'

A'12345'

B12345

Ctoken

Dtoken123

Attempts:

3 left

💡 Hint

Common Mistakes

Passing a number without quotes causes an error.

Passing a variable name instead of a string literal.

The value must be a string, so it should be enclosed in quotes like '12345'.

4fill in blank

hard

Fill both blanks to read a stored value asynchronously.

Flutter

String? token = await storage.[1](key: [2]);

Drag options to blanks, or click blank then click option'

Aread

B'token'

C'password'

Dwrite

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'write' instead of 'read' to get a value.

Using wrong key names.

Use read method with the key 'token' to get the stored value.

5fill in blank

hard

Fill all three blanks to delete a stored credential securely.

Flutter

await storage.[1](key: [2]); // Delete the [3]

Drag options to blanks, or click blank then click option'

Adelete

B'password'

Ctoken

D'token'

Attempts:

3 left

💡 Hint

Common Mistakes

Using 'write' or 'read' instead of 'delete'.

Using wrong key strings or missing quotes.

Use delete method with the key 'token' to remove the stored token.

Practice

1. What is the main purpose of using FlutterSecureStorage in a Flutter app?

easy

A. To improve app performance by caching data

B. To securely store sensitive data like passwords on the device

C. To create UI animations

D. To manage app navigation between screens

Solution

1. Step 1: Understand the role of secure storage

   Secure storage is designed to keep sensitive information safe on the device, such as passwords or tokens.

2. Step 2: Identify what FlutterSecureStorage does

   This package provides a way to write, read, and delete data securely, protecting it from unauthorized access.

3. Final Answer:

   To securely store sensitive data like passwords on the device -> Option B

4. Quick Check:

   Secure storage = safe data storage [OK]

Hint: Secure storage is for sensitive info, not UI or navigation [OK]

Common Mistakes:

• Confusing secure storage with caching
• Thinking it manages UI or navigation
• Assuming it speeds up app performance

2. Which of the following is the correct way to write a value using FlutterSecureStorage?

easy

A. storage.writeValue('token', 'abc123');

B. storage.write('token', 'abc123');

C. await storage.write(key: 'token', value: 'abc123');

D. await storage.save(key: 'token', value: 'abc123');

Solution

1. Step 1: Recall the method signature for writing data

   The correct method is write with named parameters key and value, and it returns a Future, so it should be awaited.

2. Step 2: Check each option for syntax correctness

   await storage.write(key: 'token', value: 'abc123'); uses await storage.write(key: 'token', value: 'abc123'); which is correct. Others either miss await, use wrong method names, or wrong parameter style.

3. Final Answer:

   await storage.write(key: 'token', value: 'abc123'); -> Option C

4. Quick Check:

   Write method with await and named params = await storage.write(key: 'token', value: 'abc123'); [OK]

Hint: Use await and named parameters key and value [OK]

Common Mistakes:

• Omitting await for async calls
• Using wrong method names like save or writeValue
• Passing parameters without names

3. Given this code snippet, what will be printed?

final storage = FlutterSecureStorage();
await storage.write(key: 'user', value: 'Alice');
String? name = await storage.read(key: 'user');
print(name);

medium

A. Alice

B. Error: key not found

C. FlutterSecureStorage instance

D. null

Solution

1. Step 1: Analyze the write operation

   The code writes the value 'Alice' with the key 'user' into secure storage.

2. Step 2: Analyze the read operation and print

   Reading the key 'user' returns the stored value 'Alice', which is then printed.

3. Final Answer:

   Alice -> Option A

4. Quick Check:

   Write then read same key returns stored value [OK]

Hint: Read returns stored value if key exists [OK]

Common Mistakes:

• Assuming read returns null without checking
• Confusing instance print with value print
• Expecting error if key was just written

4. What is wrong with this code snippet?

final storage = FlutterSecureStorage();
storage.write(key: 'pass', value: '1234');
String pass = storage.read(key: 'pass');
print(pass);

medium

A. Wrong method name for writing

B. Cannot print a String variable

C. Key 'pass' is invalid

D. Missing await for async calls

Solution

1. Step 1: Identify async methods usage

   Both write and read are asynchronous and return Futures, so they must be awaited.

2. Step 2: Check variable assignment and print

   Assigning String pass = storage.read(...) without await causes a type mismatch and print will show Future instance, not the value.

3. Final Answer:

   Missing await for async calls -> Option D

4. Quick Check:

   Async methods need await to get actual values [OK]

Hint: Always await async storage methods [OK]

Common Mistakes:

• Not awaiting async calls
• Assigning Future to String directly
• Ignoring async nature of storage methods

5. You want to securely store a user's credentials and then delete them when they log out. Which sequence of FlutterSecureStorage calls is correct?

hard

A. await storage.write(key: 'user', value: 'Bob'); await storage.delete(key: 'user');

B. storage.write(key: 'user', value: 'Bob'); storage.remove(key: 'user');

C. await storage.save(key: 'user', value: 'Bob'); await storage.deleteValue(key: 'user');

D. storage.set(key: 'user', value: 'Bob'); storage.delete(key: 'user');

Solution

1. Step 1: Identify correct method names and async usage

   The correct methods are write to store and delete to remove data. Both return Futures and must be awaited.

2. Step 2: Check each option for correctness

   await storage.write(key: 'user', value: 'Bob'); await storage.delete(key: 'user'); uses correct method names and awaits both calls. Other options use wrong method names or omit await.

3. Final Answer:

   await storage.write(key: 'user', value: 'Bob'); await storage.delete(key: 'user'); -> Option A

4. Quick Check:

   Use write and delete with await for secure storage [OK]

Hint: Use write and delete methods with await [OK]

Common Mistakes:

• Using wrong method names like save or remove
• Not awaiting async calls
• Mixing synchronous and async calls