CODEWITHSUNDEEP
javascriptnode.jselectronauth0
Lawrence
Lawrence

Reputation: 347

Electron Auth0Lock "Origin file:// not allowed"

Trying to get auth0 working with my electron app. When I follow the default tutorial and try to authenticate with Username-Password-Authentication, the lock fails with a 403 error and responds with "Origin file:// is not allowed".

I've also added "file://*" to the Allowed Origins (CORS) section of my client settings in the auth0 dashboard.

Auth0 Lock with console errors

Origin file:// is not allowed

EDIT:

Lock setup in electron

var lock = new Auth0Lock(
   'McQ0ls5GmkJRC1slHwNQ0585MJknnK0L', 
   'lpsd.auth0.com', {
    auth: {
            redirect: false,
            sso: false
    }
});

document.getElementById('pill_login').addEventListener('click', function (e) {
    e.preventDefault();
    lock.show();
})

Upvotes: 4

Views: 1034

Answers (1)

Lawrence
Lawrence

Reputation: 347

I was able to get Auth0 to work by using an internal express server in my electron app to handle serving pages.

First I created a basic express app in a separate folder in my project called http, here will be the express server code and html files to serve. 

const path = require('path');

const express = require('express');
const app = express();

app.use(express.static(process.env.P_DIR)); // Serve static files from the Parent Directory (Passed when child proccess is spawned).

app.use((req, res, next) => {
    res.setHeader('Access-Control-Allow-Origin', 'http://localhost:<PORT>'); // Set this header to allow redirection from localhost to auth0
    next();
})


// Default page to serve electron app
app.get('/index', (req, res) => {
    res.sendFile(__dirname + '/index.html');
})

// Callback for Auth0
app.get('/auth/callback', (req, res) => {
    res.redirect('/index'); 
})

// Listen on some port
app.listen(&lt;SOME_PORT&gt;, (err) => {
    if (err) console.log(err);
    console.log('HTTP Server running on ...');
});

Then in the Electron main process, I spawn the express server as a child process 

const {spawn} = require('child_process');

const http = spawn('node', ['./dist/http/page-server.js'], {
    env: {
        P_DIR: __dirname // Pass the current dir to the child process as an env variable, this is for serving static files in the project
    }
});

// Log standard output
http.stdout.on('data', (data) => {
    console.log(data.toString());
})

// Log errors
http.stderr.on('data', (data) => {
    console.log(data.toString());
})

Now the auth0 lock authenticates as expected.

Upvotes: 5

Related Questions