<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Naman kashyap</title>
    <description>The latest articles on DEV Community by Naman kashyap (@namankk).</description>
    <link>https://dev.to/namankk</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F1094746%2F7b6c95bb-f648-4076-81b5-b25649145628.jpeg</url>
      <title>DEV Community: Naman kashyap</title>
      <link>https://dev.to/namankk</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/namankk"/>
    <language>en</language>
    <item>
      <title>Securely Storing API Keys in Flutter</title>
      <dc:creator>Naman kashyap</dc:creator>
      <pubDate>Fri, 30 Jun 2023 13:29:45 +0000</pubDate>
      <link>https://dev.to/namankk/securely-storing-api-keys-in-flutter-3ko4</link>
      <guid>https://dev.to/namankk/securely-storing-api-keys-in-flutter-3ko4</guid>
      <description>&lt;p&gt;Protecting API keys is crucial to ensure the security of your Flutter applications. In this article, we will explore a practical approach for securely storing API keys by utilizing environment variables, obfuscation, and automation. By following these best practices, you can safeguard sensitive information and minimize the risk of unauthorized access or data breaches.&lt;/p&gt;

&lt;h2&gt;
  
  
  Step 1: Create a .env File and Add it to .gitignore
&lt;/h2&gt;

&lt;p&gt;To begin, create a .env file in the root directory of your Flutter project. This file will store your API keys in plaintext format. It's important to add the .env file to your project's .gitignore file. This prevents the file from being accidentally committed to version control and exposed to others.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fv36pp0q4inor1pgkb14p.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fv36pp0q4inor1pgkb14p.png" alt="flutter secret.env file"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;You can add your key in secret.env file&lt;/strong&gt;&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;

MY_KEY=a1b2c33d4e5f6g7h8i9jakblc


&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;
&lt;h2&gt;
  
  
  Step 2: Add the following packages in your pubspec.yaml
&lt;/h2&gt;

&lt;ol&gt;
&lt;li&gt;
&lt;a href="https://pub.dev/packages/envied" rel="noopener noreferrer"&gt;ENVied&lt;/a&gt; Package in dependancies. &lt;/li&gt;
&lt;li&gt;
&lt;a href="https://pub.dev/packages/envied_generator" rel="noopener noreferrer"&gt;envied_generator&lt;/a&gt; Package in dev_dependancies.&lt;/li&gt;
&lt;li&gt;
&lt;a href="https://pub.dev/packages/build_runner" rel="noopener noreferrer"&gt;build_runner&lt;/a&gt; Package in dev_dependancies.&lt;/li&gt;
&lt;/ol&gt;
&lt;h2&gt;
  
  
  Step 3: Create an env.dart File
&lt;/h2&gt;

&lt;p&gt;Create an env.dart file in your project, preferably in a dedicated config or utils directory. This file will define a class called Env, which will hold the API keys as properties. For example:&lt;/p&gt;
&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;

import 'package:envied/envied.dart';
part 'env.g.dart';

@Envied(path: '../note_keeper_flutter_app/secret.env')  //Path of your secret.env file
abstract class Env{
  @EnviedField(varName: 'MY_KEY',obfuscate: true)
  static const myApiKey=_Env.myApiKey;
}


&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;
&lt;h2&gt;
  
  
  Step 4: Generate the Code
&lt;/h2&gt;

&lt;p&gt;Run the code generator by executing the command. &lt;/p&gt;
&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;

flutter pub run build_runner build --delete-conflicting-outputs


&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;

&lt;p&gt;This generates a env.g.dart file that contains abfuscated value of your keys.&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;

// GENERATED CODE - DO NOT MODIFY BY HAND

part of 'env.dart';

// **************************************************************************
// EnviedGenerator
// **************************************************************************

class _Env {
  static const List&amp;lt;int&amp;gt; _enviedkeymyApiKey = [
    1381461286,
    2322593563,
    1978670197,
    2411908773,
    2066599044,
    2426385646,
    3978051006,
...];
 static const List&amp;lt;int&amp;gt; _envieddatamyApiKey = [
    1381461319,
    2322593578,
   ...];

  static final String myApiKey = String.fromCharCodes(
    List.generate(_envieddatamyApiKey.length, (i) =&amp;gt; i, growable: false)
        .map((i) =&amp;gt; _envieddatamyApiKey[i] ^ _enviedkeymyApiKey[i])
        .toList(growable: false),
  );


&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;
&lt;h2&gt;
  
  
  Step 5: Import env.dart and Access API Keys
&lt;/h2&gt;

&lt;p&gt;In the relevant files of your Flutter project where you need to access the API keys, import env.dart as follows:&lt;/p&gt;

&lt;p&gt;You can then access the API keys using the Env class, like this:&lt;/p&gt;
&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;

String apiKey = Env.myApiKey;


&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;

&lt;p&gt;Now your keys will be more protected inside your project.&lt;/p&gt;

</description>
      <category>flutter</category>
      <category>security</category>
      <category>dart</category>
      <category>envied</category>
    </item>
  </channel>
</rss>
