Integración de Salesforce, Node.js y React: Una Guía Paso a Paso

En este artículo, te guiaré paso a paso para conectar un backend construido con Node.js a Salesforce usando OAuth 2.0, e integrarlo con un frontend, en este caso, React. Esta solución utiliza una Connected App en Salesforce y los paquetes sf-jwt-token y jsforce en el backend. Explicaré cómo hacerlo en tu máquina local y en un entorno de prueba utilizando Ngrok. 1. Configuración en Salesforce Para habilitar una comunicación segura entre Salesforce y nuestra aplicación, primero necesitamos configurar una Connected App en la interfaz de usuario (UI) de Salesforce. Así que, antes de empezar a programar, necesitamos configurar Salesforce para permitir la integración con nuestra aplicación. Pasos en la UI de Salesforce: Crear una Connected App: Ve a Configuración → Gestor de aplicaciones → Crear una Connected App. Habilita el acceso a la API seleccionando Enable OAuth Settings. En Selected OAuth Scopes, selecciona: Refresh token API Full access. Configurar las políticas de OAuth: Dentro de la nueva aplicación, navega a Manage → Edit Policies y configura: Permitted Users: Admin approved users are pre-authorized. También necesitamos asignar el perfil que queremos usar en Manage Profiles. Consumer Key y Secret: En la sección API (Enable OAuth Settings), haz clic en Manage Consumer Details y guarda el Consumer Key (Consumer_Id) y el Consumer Secret (Consumer_Secret). Estos valores se usarán más adelante en el archivo .env para la configuración del backend. Restablecer tu token de seguridad: Restablece tu token de seguridad, si es necesario, navegando a tus configuraciones personales en Salesforce. Este token también se agregará a las variables de entorno (explicado más abajo). 2. Configurar el servidor en Node.js A continuación, configuraremos un backend en Express y las herramientas necesarias para interactuar con Salesforce. Puedes usar este repositorio ya preparado para este propósito: Backend Node Instalar dependencias: npm install express jsforce sf-jwt-token Nota: Escribo este artículo en diciembre de 2024, y creo que hay dos características interesantes recientes de Node.js que deberías conocer: Si usas Node.js v21.7.0 (abril de 2024) o posterior: Ya no necesitas dotenv para las variables de entorno, puedes usar process.loadEnvFile() al inicio de tu aplicación. Después de esto, tendrás tu archivo .env como de costumbre en la raíz del proyecto, y podrás llamar tus variables desde cualquier parte del código usando process.env.TU_VARIABLE. Web Developer. Además, desde Node.js v22 (Soporte a Largo Plazo desde octubre de 2024), puedes usar node --watch en lugar del paquete nodemon para reinicios automáticos del servidor. Logrocket. Así que, dos paquetes menos para instalar. Variables de entorno: Crea un archivo .env y define lo siguiente: CONSUMER_ID=tu_consumer_id SF_USERNAME=tu_usuario_de_salesforce LOGIN_URL=https://login.salesforce.com OR https://test.salesforce.com ¿Probando localmente? Usa Ngrok Ngrok se utiliza para exponer tu servidor local a internet, permitiendo que Salesforce envíe callbacks a tu aplicación durante el proceso de autenticación (necesario principalmente en la primera llamada): Instala y ejecuta Ngrok. Ejecuta tu servidor. Apunta Ngrok al puerto donde se ejecuta tu backend escribiendo ngrok.exe http en tu terminal. Copia la URL generada por Ngrok y configúrala como Callback URL en tu Connected App en la sección API (Enable OAuth Settings). 3. Clave privada y certificado Genera una clave privada y un certificado con el siguiente comando en la terminal: $ openssl req -nodes -new -x509 -keyout private.pem -out server.cert Subir la firma digital a Salesforce Ahora que los dos archivos están en tu proyecto, habilita la opción Use digital signatures en tu Connected App y sube el certificado generado en: Setup → Certificates and Key Management. Ahora, ejecuta la ruta del token en tu navegador: http://localhost:3000/token Si todo salió bien, obtendrás tu access_token. { "access_token": "", "scope": "api full", "instance_url": "", "id": "", "token_type": "Bearer" } En esta solución, opté por solicitar un nuevo token de Salesforce para cada llamada a la API. Salesforce puede devolver el mismo token o emitir uno nuevo, ya que los tokens se actualizan periódicamente. 4. Usando JSforce Con el token, puedes comenzar a interactuar con Salesforce desde tu servidor Node.js. Aquí hay un ejemplo simple: const jsforce = require('jsforce'); const conn = new jsforce.Connection({ instanceUrl: 'https://tu-instancia.salesforce.com', accessToken: 'tu_access_token', }); conn.query('SELECT Id, Name FROM Account', (err, result) => { if (err) return console.error(err); console.log('Cuentas:', result.records); }); 5. Integración con React Finalmente, usa React para crear

Jan 20, 2025 - 12:13
Integración de Salesforce, Node.js y React: Una Guía Paso a Paso

En este artículo, te guiaré paso a paso para conectar un backend construido con Node.js a Salesforce usando OAuth 2.0, e integrarlo con un frontend, en este caso, React.

Esta solución utiliza una Connected App en Salesforce y los paquetes sf-jwt-token y jsforce en el backend.

Explicaré cómo hacerlo en tu máquina local y en un entorno de prueba utilizando Ngrok.

1. Configuración en Salesforce

Para habilitar una comunicación segura entre Salesforce y nuestra aplicación, primero necesitamos configurar una Connected App en la interfaz de usuario (UI) de Salesforce.

Así que, antes de empezar a programar, necesitamos configurar Salesforce para permitir la integración con nuestra aplicación.

Pasos en la UI de Salesforce:

  1. Crear una Connected App:

    • Ve a Configuración → Gestor de aplicaciones → Crear una Connected App.
    • Habilita el acceso a la API seleccionando Enable OAuth Settings.
    • En Selected OAuth Scopes, selecciona:
      • Refresh token
      • API
      • Full access.
  2. Configurar las políticas de OAuth:

    • Dentro de la nueva aplicación, navega a Manage → Edit Policies y configura:
      • Permitted Users: Admin approved users are pre-authorized.
    • También necesitamos asignar el perfil que queremos usar en Manage Profiles.
  3. Consumer Key y Secret:
    En la sección API (Enable OAuth Settings), haz clic en Manage Consumer Details y guarda el Consumer Key (Consumer_Id) y el Consumer Secret (Consumer_Secret).

    Estos valores se usarán más adelante en el archivo .env para la configuración del backend.

  4. Restablecer tu token de seguridad:
    Restablece tu token de seguridad, si es necesario, navegando a tus configuraciones personales en Salesforce.

    Este token también se agregará a las variables de entorno (explicado más abajo).

2. Configurar el servidor en Node.js

A continuación, configuraremos un backend en Express y las herramientas necesarias para interactuar con Salesforce.

Puedes usar este repositorio ya preparado para este propósito:

Backend Node

Instalar dependencias:

npm install express jsforce sf-jwt-token

Nota:

Escribo este artículo en diciembre de 2024, y creo que hay dos características interesantes recientes de Node.js que deberías conocer:

  • Si usas Node.js v21.7.0 (abril de 2024) o posterior: Ya no necesitas dotenv para las variables de entorno, puedes usar process.loadEnvFile() al inicio de tu aplicación. Después de esto, tendrás tu archivo .env como de costumbre en la raíz del proyecto, y podrás llamar tus variables desde cualquier parte del código usando process.env.TU_VARIABLE. Web Developer.
  • Además, desde Node.js v22 (Soporte a Largo Plazo desde octubre de 2024), puedes usar node --watch en lugar del paquete nodemon para reinicios automáticos del servidor. Logrocket.

Así que, dos paquetes menos para instalar.

Variables de entorno:

Crea un archivo .env y define lo siguiente:

CONSUMER_ID=tu_consumer_id
SF_USERNAME=tu_usuario_de_salesforce
LOGIN_URL=https://login.salesforce.com OR https://test.salesforce.com

¿Probando localmente? Usa Ngrok

Ngrok se utiliza para exponer tu servidor local a internet, permitiendo que Salesforce envíe callbacks a tu aplicación durante el proceso de autenticación (necesario principalmente en la primera llamada):

  1. Instala y ejecuta Ngrok.
  2. Ejecuta tu servidor.
  3. Apunta Ngrok al puerto donde se ejecuta tu backend escribiendo ngrok.exe http en tu terminal.
  4. Copia la URL generada por Ngrok y configúrala como Callback URL en tu Connected App en la sección API (Enable OAuth Settings).

3. Clave privada y certificado

Genera una clave privada y un certificado con el siguiente comando en la terminal:

$ openssl req  -nodes -new -x509  -keyout private.pem -out server.cert

Subir la firma digital a Salesforce

Ahora que los dos archivos están en tu proyecto, habilita la opción Use digital signatures en tu Connected App y sube el certificado generado en:

Setup → Certificates and Key Management.

Ahora, ejecuta la ruta del token en tu navegador:

http://localhost:3000/token

Si todo salió bien, obtendrás tu access_token.

{
  "access_token": "",
  "scope": "api full",
  "instance_url": "",
  "id": "",
  "token_type": "Bearer"
}

En esta solución, opté por solicitar un nuevo token de Salesforce para cada llamada a la API. Salesforce puede devolver el mismo token o emitir uno nuevo, ya que los tokens se actualizan periódicamente.

4. Usando JSforce

Con el token, puedes comenzar a interactuar con Salesforce desde tu servidor Node.js. Aquí hay un ejemplo simple:

const jsforce = require('jsforce');

const conn = new jsforce.Connection({
  instanceUrl: 'https://tu-instancia.salesforce.com',
  accessToken: 'tu_access_token',
});

conn.query('SELECT Id, Name FROM Account', (err, result) => {
  if (err) return console.error(err);
  console.log('Cuentas:', result.records);
});

5. Integración con React

Finalmente, usa React para crear un frontend que consuma datos del backend y los muestre de forma interactiva. Por ejemplo, podrías construir:

  • Un formulario para crear registros en Salesforce.
  • Una tabla para mostrar los datos de cuentas recuperados desde el backend.

En mi caso de uso, necesitaba una forma en que los empleados de una empresa pudieran registrar datos de desplazamiento y hacer registros en Salesforce, específicamente en Net Zero Cloud. Para este ejercicio, creé el objeto necesario y desarrollé la solución con un Developer Org gratuito.

También puedes usar este repositorio de frontend en React para este propósito:

Frontend React.

Conclusión

Integrar Salesforce, Node.js y React es una forma sencilla de experimentar con herramientas y hacer que todo funcione.

Espero que este artículo te ayude a empezar con tu propia solución de integración.

¿Tienes preguntas o ideas para mejorar este flujo de trabajo? Déjalas en los comentarios.