1

I have built a simple web app using the LWR OSS(same as lwc-recipes-oss), I want to use the JSForce in this project to connect to Salesforce API. Because of the CORS policy, I am not able to fetch data from Salesforce as the browser is blocking it.

I know I need to use the jsforce-ajax-proxy npm package so that I can redirect the requests through the server. This is something we can do with a plain express server.

// Simple Express server setup to serve for local testing/dev API server
const compression = require('compression');
const helmet = require('helmet');
const express = require('express');
const jsforceAjaxProxy = require('jsforce-ajax-proxy');

const app = express();
app.use(helmet());
app.use(compression());
app.all('/proxy/?*', jsforceAjaxProxy({ enableCORS: true }));

const HOST = process.env.API_HOST || 'localhost';
const PORT = process.env.API_PORT || 3002;

app.get('/api/v1/endpoint', (req, res) => {
    res.json({ success: true });
});

app.listen(PORT, () =>
    console.log(
        `✅  API Server started: http://${HOST}:${PORT}/api/v1/endpoint`
    )
);

But I don't want two servers, is there any way I can do this in the LWR server code as mentioned below?

import { createServer } from 'lwr';

createServer()
    .listen(({ port, serverMode }) => {
        console.log(`App listening on port ${port} in ${serverMode} mode\n`);
    })
    .catch((err) => {
        console.error(err);
        process.exit(1);
    });

1 Answer 1

0

Posting the solution as suggested by @AdityaNaag, thanks to him for helping me out.

The LWR server has a method to get access to the internal express server, getInternalServer. With the help of that, I was able to add the proxy middleware.


import { createServer } from "lwr";
import jsforceAjaxProxy from "jsforce-ajax-proxy";

const PORT = parseInt(process.env.PORT || "3001", 10);
const SERVER_MODE =
    "development" === process.env.NODE_ENV ? "dev" : "prod-compat";

// Create the LWR App Server
const lwrServer = createServer({
    serverMode: SERVER_MODE,
    port: PORT,
});
// Get the internal express app
const expressApp = lwrServer.getInternalServer("express");

expressApp.all("/proxy/?*", jsforceAjaxProxy({ enableCORS: true }));
// Start the server
lwrServer
    .listen(({ port, serverMode }) => {
        console.log(`✅ App listening on port ${port} in ${serverMode} mode!`);
        console.log(`Url http://localhost:${port}`);
    })
    .catch((err) => {
        console.error(err);
        process.exit(1);
    });

2
  • Are you able to share how you got jsforce to work in your lwr components? I am getting the following error when trying to import jsforce in Uncaught (in promise) SyntaxError: The requested module '/1/module/esm/0/l/en-US/mi/jsforce%2Fv%2F1_11_0/latest/jsforce.js' does not provide an export named 'Connection' (at example_app.js:3:9)
    – ShreyasD
    Commented Nov 3, 2022 at 19:21
  • 1
    you need to add the JSForce files in the assets folder and then expose them from there. After that, you can access JSForce in the layout template. @ShreyasD Commented Nov 4, 2022 at 10:41

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .