How to access secrets when using flutter web with github actions

I have a flutter web app and for accessing the database I have hardcoded an APIKey in a secrets.dart file, And this works perfectly fine. I have added this file to .gitignore in order to prevent it from pushing it to version control. But when it comes to deploying the app using GitHub actions The script fails because it doesn't detect the secrets file.

I did look at the docs on Encrypted secrets from Github which basically allows storing the secrets.But it seems like those secrets are only accessible in the yml file.

I would like to know how can I use this secret in my app so that my script runs successfully and deploys the app. Here is my folder structure

lib/
  services/
     database.dart /// this file uses the APIkey from secrets.dart
  secrets.dart /// contains the APIkey

One way to solve this issue I can think of is to use a .env file but I am not much familiar with How to add the secret keys in .env file through the CI script. I believe that would also solve my problem.

Heres my CI script

# This file was auto-generated by the Firebase CLI
# https://github.com/firebase/firebase-tools

name: Deploy to Firebase Hosting on merge
"on":
  push:
    branches:
      - master
jobs:
  build_and_deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - uses: actions/setup-java@v1
        with:
          java-version: "12.x"
      - uses: subosito/flutter-action@v1
        with:
          channel: "master"
      - run: flutter pub get
      - run: flutter pub run build_runner build --delete-conflicting-outputs
      - run: flutter build web --release
      - uses: FirebaseExtended/action-hosting-deploy@v0
        with:
          repoToken: "${{ secrets.GITHUB_TOKEN }}"
          firebaseServiceAccount: "${{ secrets.FIREBASE_SERVICE_ACCOUNT_VOCABHUB_34C7F }}"
          channelId: live
          projectId: vocabhub-34c7f
        env:
          FIREBASE_CLI_PREVIEWS: hostingchannels

You can use your secrets.dart file while being ignored in the source control.

Here are the steps

1. In your local machine, encode the content of your secrets.dart using the base64 command:

     base64 lib/path/to/secrets.dart
   

2. Copy and paste the output into your GitHub secrets, name it $SECRETS_FILE_CONTENT or whatever you want.
3. Add this CI step into your yaml script just before the flutter pub get step.

     # other stuff ...
     - run: echo $SECRETS_FILE_CONTENT | base64 -d > lib/path/to/secrets.dart
       env:
         SECRETS_FILE_CONTENT: ${{ secrets.SECRETS_FILE_CONTENT }}
     - run: flutter pub get
     - run: flutter pub run build_runner build --delete-conflicting-outputs
     - run: flutter build web --release
     # other stuff ...
   

To add the secret in the GitHub user interface, follow these steps:

Your secret should appear in the lower "repository secrets" half of the UI, it should NOT appear in the "Environment secrets" as those do not work with a simple ${{ secrets.name_of_variable }}.

To provide more context, here's what the "actions" file, e.g. .github/workflows/ci.yml in your repository, should look like:

name: CI

on:
  push:
    branches: [ main, dev ]
  pull_request:
    branches: [ main ]

  # Allows to run this workflow manually from the Actions tab
  workflow_dispatch:
  
jobs:
  build:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v2
      - name: Decode base64 secrets
        run: echo $SECRETS_FILE_CONTENTS | base64 -d > lib/path/to/secrets.dart
        env:
          SECRETS_FILE_CONTENTS: ${{ secrets.SECRETS_FILE_CONTENTS }}
      # … put your steps here
        run: flutter pub get

Edit

This is also the same process when hiding google-services.json when people work with firebase. Or with signing keys (key.jks or key.keystore).