Our great sponsors
-
-
SurveyJS
Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.
-
In this code snippet, we render three input fields: one for the old password, one for the new password, and one to confirm the new password. Each input field is associated with its respective state variable (oldPassword, newPassword, confirmNewPassword). The onChange event handlers update the corresponding state variables as the user types in the input fields. You can find the full code including the User Self-Deletion part in a single repo.
In the world of web and mobile app development, having a robust backend infrastructure is crucial for ensuring smooth and secure operations. Built on top of PostgreSQL, Supabase offers a complete backend platform with real-time capabilities, authentication, and database management. In this blog post, we'll explore how Supabase leverages the power and scalability of PostgreSQL to implement secure password verification and update functionality in your applications.
import { serve } from "https://deno.land/[email protected]/http/server.ts"; import { createClient } from "https://esm.sh/@supabase/supabase-js@2"; const corsHeaders = { "Access-Control-Allow-Origin": "*", "Access-Control-Allow-Headers": "authorization, x-client-info, apikey, content-type", }; serve(async (req) => { // Create a Supabase client with the necessary credentials if (req.method === 'OPTIONS') { return new Response('ok', { headers: corsHeaders }) } // Create a Supabase client with the necessary credentials const supabaseClient = createClient( Deno.env.get("SUPABASE_URL") ?? "", Deno.env.get("SUPABASE_ANON_KEY") ?? "", { global: { headers: { Authorization: req.headers.get("Authorization")! } }, auth: { autoRefreshToken: false, persistSession: false, detectSessionInUrl: false } } ); console.log("Supabase client created"); // Fetch the logged-in user from Supabase const { data: { user }, error: userError } = await supabaseClient.auth .getUser(); console.log("User fetched", user); if (userError) { console.error("User error", userError); return new Response(JSON.stringify({ error: userError.message }), { headers: { ...corsHeaders, "Content-Type": "application/json" }, status: 400, }); } // Extract the old and new passwords from the request const { oldPassword, newPassword } = await req.json(); console.log("Received old and new passwords", oldPassword, newPassword); // Verify the old password using the `verify_user_password` function const { data: isValidOldPassword, error: passwordError } = await supabaseClient.rpc("verify_user_password", { password: oldPassword }); console.log("Old password verified", isValidOldPassword); if (passwordError || !isValidOldPassword) { console.error("Invalid old password", passwordError); return new Response(JSON.stringify({ error: "Invalid old password" }), { headers: { ...corsHeaders, "Content-Type": "application/json" }, status: 400, }); } try { // Fetch the user's profile data const { data: profiles, error: profileError } = await supabaseClient.from( "profiles", ).select("id, avatar_url"); console.log("Profile data fetched", profiles); if (profileError) throw profileError; const user_id = profiles[0].id; console.log("User id", user_id); // Update the user's password using the Supabase Admin API const supabaseAdmin = createClient( Deno.env.get("SUPABASE_URL") ?? "", Deno.env.get("SUPABASE_SERVICE_ROLE_KEY") ?? "", { auth: { autoRefreshToken: false, persistSession: false, detectSessionInUrl: false } } ); console.log("Admin client created"); // Return a success response to the client const { error: updateError } = await supabaseAdmin .auth.admin.updateUserById( user_id, { password: newPassword }, ); console.log("Password updated"); if (updateError) { console.error("Update error", updateError); return new Response(JSON.stringify({ error: updateError.message }), { status: 400, }); } } catch (error) { console.error("Caught error", error); return new Response(JSON.stringify({ error: error }), { headers: { ...corsHeaders, "Content-Type": "application/json" }, status: 400, }); } console.log("Password update successful"); // Return a success response to the client return new Response( JSON.stringify({ message: "Password updated successfully" }), { headers: { ...corsHeaders, "Content-Type": "application/json" }, status: 200, }, ); });