Registry / auth-security / react-facebook-auth

react-facebook-auth

library1.4.0jsnpmunverified

The `react-facebook-auth` package provides a React component designed for client-side Facebook authentication, enabling developers to obtain an authentication token for subsequent backend validation. The current stable version, 1.4.0, was released several years ago. The project appears to be unmaintained, with its last update occurring over six years ago, and its peer dependencies (`react` `^15.0.0 || ^16.0.0`) are significantly outdated. This component primarily functions as a wrapper around the Facebook SDK for JavaScript, handling its initialization and the callback mechanisms for successful authentication or failures. While it offered a straightforward way to integrate Facebook login into React applications at the time of its release, its age renders it largely unsuitable for modern React development environments or current Facebook Graph API versions. Its lack of maintenance also poses significant security and compatibility risks.

auth-security web-framework

npm install react-facebook-auth

github ↗package ↗

INSTALL

IMPORT

SIG · REACT-FACEBOOK-AUT

react-facebook-auth

auth-securityjavascriptv1.4.0

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–226 runs

build_error

glibc

node 18–226 runs

build_error

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

FacebookAuth

✓ import FacebookAuth from 'react-facebook-auth';

✗ import { FacebookAuth } from 'react-facebook-auth';

The `FacebookAuth` component is exported as the default export of the package. Destructured imports will not work.

FacebookAuth (CommonJS)

✓ const FacebookAuth = require('react-facebook-auth');

✗ import FacebookAuth from 'react-facebook-auth';

While CommonJS `require` might work in some transpiled environments, modern React applications primarily use ESM `import`. This package's age means it might have been built with CJS in mind, but direct ESM import is preferred.

This quickstart demonstrates how to integrate the `FacebookAuth` component, provide a custom button for the login trigger, and handle the authentication response, including placeholder for backend integration. It highlights the use of `appId`, `callback`, and `component` props.

import React from 'react'; import ReactDOM from 'react-dom'; import FacebookAuth from 'react-facebook-auth'; const MyFacebookButton = ({ onClick }) => ( <button onClick={onClick}> Login with facebook </button> ); const authenticate = (response) => { console.log('Facebook Auth Response:', response); // In a real application, you would send this token to your backend // for validation and user session management. // Example: fetch('/api/auth/facebook', { method: 'POST', body: JSON.stringify(response) }); }; const App = () => ( <div> <h1>Facebook Auth Example</h1> <p>This component provides a customizable button that triggers the Facebook login flow.</p> <FacebookAuth appId={process.env.REACT_APP_FACEBOOK_APP_ID ?? 'YOUR_FACEBOOK_APP_ID'} callback={authenticate} component={MyFacebookButton} scope="public_profile,email" fields="name,email,picture" /> <p>Make sure to replace 'YOUR_FACEBOOK_APP_ID' with your actual Facebook App ID.</p> <p>This package is deprecated and likely incompatible with modern Facebook API versions and React.</p> </div> ); ReactDOM.render( <App />, document.getElementById('root'), );

Debug

Known issues

breakingThis package explicitly declares peer dependencies for React versions `^15.0.0 || ^16.0.0`. It is fundamentally incompatible with React 17 and later versions, including the current React 18 and React 19, due to breaking changes in React's core and deprecated lifecycle methods.

fix

Do not use this package with React versions 17 or higher. Consider modern alternatives like `@greatsumini/react-facebook-login` or `react-facebook` that support current React versions.

affects: >=1.0.0

breakingThe package defaults to Facebook SDK version `2.8` via its `version` prop. Facebook deprecated older Graph API versions, typically maintaining them for a limited period (e.g., 90 days or 2 years for core APIs). Version 2.8 is extremely old and will not function with current Facebook applications or Graph API requirements, leading to authentication failures or API errors.

fix

This package does not support recent Facebook Graph API versions. Attempting to override the `version` prop might not resolve underlying compatibility issues. Migrate to a actively maintained Facebook login library that uses recent Graph API versions.

affects: >=1.0.0

gotchaThe package is unmaintained, with its last commit over six years ago. This means no security patches, bug fixes, or updates for compatibility with evolving web standards or Facebook API changes. Using unmaintained software, especially for authentication, introduces significant security vulnerabilities (e.g., potential for supply chain attacks, unpatched vulnerabilities) and reliability issues.

fix

Immediately cease using this package in production environments. Migrate to a well-maintained, actively developed Facebook authentication library (e.g., `react-facebook-login` by keppelen or `@greatsumini/react-facebook-login`, or `react-facebook`).

affects: >=1.0.0

gotchaFacebook's platform policies and developer requirements frequently change. An unmaintained library will not adhere to current policies (e.g., data handling, required permissions, app review processes), potentially leading to app suspension or rejection from the Facebook platform.

fix

Refer to the latest Facebook Developer documentation for app creation and policy compliance. Actively maintained libraries will typically incorporate these changes. Using this package will likely lead to policy violations.

affects: >=1.0.0

gotchaThe package does not ship with TypeScript types. While it can be used in TypeScript projects with declaration files (`@types/react-facebook-auth`), the lack of first-party types increases the chance of type-related errors and reduces developer experience.

fix

Install community types if available (`npm install --save-dev @types/react-facebook-auth`). However, given the package's abandonment, these types are unlikely to be maintained either. Modern alternatives often come with built-in TypeScript support.

affects: >=1.0.0

Errors

Common errors & fixes

Error: Invalid App Id: The provided 'appId' is invalid. It must be a number or a numeric string representing the Facebook app ID.

The `appId` prop is either missing, empty, or contains non-numeric characters for your Facebook application.

fix

Ensure the `appId` prop is correctly set with your numerical Facebook Application ID as a string, obtained from the Facebook Developer Dashboard (e.g., `appId="1234567890"`).

TypeError: Cannot read properties of undefined (reading 'login') (or similar errors related to FB.login is not a function)

The Facebook JavaScript SDK has not loaded successfully or initialized before the component attempts to call its methods, or the SDK version configured is too old and incompatible.

fix

Verify that `appId` is correct and that there are no network issues blocking the Facebook SDK from loading. Given the age of this package, this error is highly likely due to incompatibility with current Facebook SDK versions, which often deprecate older APIs. No simple fix within this package is available; migration is necessary.

Uncaught Error: The 'component' prop must be a React component.

The component provided to the `component` prop is not a valid React functional component or class component.

fix

Ensure the value passed to the `component` prop is a valid React component function or class (e.g., `component={MyFacebookButton}` where `MyFacebookButton` is a function or class that returns JSX), and that it correctly receives an `onClick` prop.

Failed to authenticate, status: unknown (or similar errors indicating authentication failure)

Facebook login process failed, often due to incorrect app configuration on the Facebook Developer side (e.g., incorrect redirect URIs, disabled login for the platform) or due to Facebook's stricter security policies (e.g., requiring HTTPS for redirects, not localhost).

fix

Check your Facebook App settings on developers.facebook.com to ensure 'Facebook Login' is enabled for the 'Web' platform, the 'Valid OAuth Redirect URIs' are correctly configured for your application's domain (including `http://localhost` for development), and that your development environment is running over HTTPS if required. However, the package's deprecated status means this could also be a fundamental incompatibility.

Upgrade

Version history

1.4.0latest on npm

Audit

Dependencies

reactrequiredRequired as a peer dependency for the core functionality of the React component.

Agent activity

10 hits · last 30 days

node

OpenAI (training)

Resources

githubhttps://github.com/ionutmilica/react-facebook-auth ↗

packagehttps://www.npmjs.com/package/react-facebook-auth ↗