bairav

bairav

Phoenix with firebase authentication

we are trying to use firebase authentication with phoenix framework, but we failed to pass the session cookie to the browser, using Guardian library.

login page:

  <form id="login">
      <label>Email</label>
      <input type="text" name="email">

      <label>Password</label>
      <input type="password" name="password">

      <button type="submit">Log in</button>
  </form>

<script>
  window.addEventListener("DOMContentLoaded", () => {
      // For Firebase JS SDK v7.20.0 and later, measurementId is optional
      // Initialize Firebase
      firebase.initializeApp(firebaseConfig);
      firebase.auth().setPersistence(firebase.auth.Auth.Persistence.NONE);

      document
          .getElementById("login")
          .addEventListener("submit", (event) => {
              event.preventDefault();
              const email = event.target.email.value;
              const password = event.target.password.value;

              firebase
                  .auth()
                  .signInWithEmailAndPassword(email, password)
                  .then(({ user }) => {
                      console.log(user)
                      return user.getIdToken().then((idToken) => {
                          return fetch("/api/sessionlogin", {
                              method: "POST",
                              headers: {
                                  Accept: "application/json",
                                  "Content-Type": "application/json",
                                  "CSRF-Token": Cookies.get("XSRF-TOKEN")                        
                              },
                              body: JSON.stringify({ idToken }),
                          });
                      });
                  })
                  .then(() => {
                    return firebase.auth().signOut();
                  })
                  .then(() => {
                    window.location.assign("/dashboard");
                      
                  });
              return false;
          });
  });
</script>

controller:

  def session_login(conn, %{"idToken" => token}) do
    {:ok, claims} = ExFirebaseAuth.Token.verify_token(token)
    conn    
    |> Guardian.Plug.sign_in(claims)
    |> json(%{state: "success"})    
  end

pipeline:

defmodule FB.Auth.Pipeline do
  use Guardian.Plug.Pipeline,
    otp_app: :fb,
    error_handler: FB.Auth.ErrorHandler,
    module: FB.Auth.Guardian

  plug Guardian.Plug.VerifySession, claims: %{"typ" => "access"}
  plug Guardian.Plug.VerifyHeader, claims: %{"typ" => "access"}
  plug Guardian.Plug.LoadResource, allow_blank: true
end	

router:

  pipeline :browser do
    plug :accepts, ["html"]
    plug :fetch_session
    plug :fetch_flash
    plug :protect_from_forgery
    plug :put_secure_browser_headers
  end

  pipeline :api do
    plug :accepts, ["json"]
  end
  
  pipeline :auth do
    plug FB.Auth.Pipeline
  end
  
  
    scope "/", FBWeb do
    pipe_through [:browser]

		get "/", PageController, :index
		post "/logout", PageController, :logout
    end
	
	scope "/", FBWeb do
    pipe_through [:browser, :auth]

		get "/dashboard", PageController, :dashboard
    end
	
	scope "/api", FBWeb do
    pipe_through [:api]
     post "/sessionlogin", PageController, :session_login
    end
	

Where Next?

Popular in Questions Top

qwerescape
Is there a way to get the call stack or stack trace at any point in the code? Not from exceptions, but an expression that returns how the...
New
mgjohns61585
Could someone help me? I’m making my first elixir program, number guessing game. I can’t figure out how to convert the user’s guess from ...
New
shahryarjb
Hello, I have map which I want to convert it to string like this: the map: %{last_name: "tavakkoli", name: "shahryar"} the string I ne...
New
stefanchrobot
What’s the safe way to decode a JSON string into a struct? I want to avoid calling String.to_atom. Jason.decode can give me a map with st...
New
hariharasudhan94
lets say i have a sample like a = 20; b = 10; if (a &gt; b) do {:ok, "a"} end if (a &lt; b) do {:ok, b} end if (a == b) do {:ok, "equa...
New
fayddelight
I tried installing elixir 1.11.2 erlang 23.3.4 via asdf in my zsh shell. Enabled the versions locally and globally. When I list them ...
New
bsollish-terakeet
Credo is smart enough to check for (something like) this: assert length(the_list) == 0 with this response: Checking if an enum is empt...
New
romenigld
I am trying to run a deploy with docker and I successfully runned with this command: docker build -t romenigld/blog-prod . but when I t...
New
nsuchy
Hi. I’ve noticed that Windows Powershell has it’s own IEX command and you cannot access Elixir’s IEX due to the conflict. This isn’t a cr...
New
hariharasudhan94
I would like to know what is the best IDE for elixir development?
New

Other popular topics Top

Darmani72
If I have a post route which an argument: post /my_post_route/:my_param1, MyController.my_post_handler How would get the post params ...
New
senggen
Erlang/OTP 25 [erts-13.2.2] [source] [64-bit] [smp:8:8] [ds:8:8:10] [async-threads:1] 15:22:35.803 [error] gen_event {lager_file_backend...
New
jononomo
I am trying to figure out how Mix knows whether the environment is test, dev, or prod – where is this set? Thanks.
New
aesmail
Hello guys, I have finally made it. I created an admin interface for a framework. It’s been on my todo list for years and with the curre...
New
saif
Hello everyone, Long time lurker first time poster here. I’ve recently begun working on Elixir full-time again! :raised_hands: It’s been...
New
rms.mrcs
Hi, I need to transform a list of numbers into a map where the keys are the indexes and the values are the original values of the list. ...
New
romenigld
I am trying to run a deploy with docker and I successfully runned with this command: docker build -t romenigld/blog-prod . but when I t...
New
joaquinalcerro
Hi there, I am working with Ecto-Postgresql and I need to call all of the records from a specific table but the table has 40,000 records...
New
WestKeys
Currently suffering from paralysis by [HTTP client] analysis. This is rather unusual in Elixirland as there tends to be consensus on the ...
New
sergio
Kind of like when jquery came out, it was super necessary. Existing drag and drop libraries have a bunch of baggage to support old browse...
New

We're in Beta

About us Mission Statement