I have an app that authenticates against Azure AD using next-auth 4.
It works fine and I can authenticate.
When I try to configure a custom base path http://localhost:3000/myapp for the app and call signIn() I get a 404 error telling me that http://localhost:3000/api/auth/error is not found.
I have configured all the paths like described below.
What confuses me:
If I use the standard path I notice that [...nextauth.js] gets executed
If I use a custom path, [...nextauth.js] is not even executed
A similar scenario in next.auth 3 worked just fine.
Comparing to next-auth 3 it looks like next-auth 4 does not honor NEXTAUTH_URL.
What can I do?
.env.local
AZURE_CLIENT_ID= ....
AZURE_CLIENT_SECRET=...
AZURE_TENANT_ID=...
JWT_SECRET=...
NEXTAUTH_URL=http://localhost:3000/myapp/api/auth
NEXTAUTH_URL_INTERNAL=http://localhost:3000/mypp/api/auth
NEXT_AUTH_DEBUG=true
APP_BASE_PATH=/myapp
next.config.js:
const basePath = process.env.APP_BASE_PATH;
module.exports = {
reactStrictMode: true,
basePath: `${basePath}`,
};
[...nextauth.js]`
export default NextAuth({
providers: [
AzureADProvider({
clientId: process.env.AZURE_CLIENT_ID,
clientSecret: process.env.AZURE_CLIENT_SECRET,
scope: "offline_access User.Read",
tenantId: process.env.AZURE_TENANT_ID,
}),
],
....
debug: process.env.NEXT_AUTH_DEBUG,
secret: process.env.JWT_SECRET,
});
Did you've tried that solution ?
Try to edit your _app.tsx and define your base path using the props basePath on your , as in that example.
Related
I'm using the T3-app (nextjs, tRPC, etc), and I don't know if these env variable errors just happened, or if I haven't noticed them before. However, I have all of the environment variables set in the .env file and have the following configuration set in the schema.mjs file:
export const serverSchema = z.object({
DATABASE_URL: z.string().url(),
NODE_ENV: z.enum(["development", "test", "production"]),
NEXTAUTH_SECRET: z.string(),
NEXTAUTH_URL: z.preprocess(
// This makes Vercel deployments not fail if you don't set NEXTAUTH_URL
// Since NextAuth automatically uses the VERCEL_URL if present.
(str) => process.env.VERCEL_URL ?? str,
// VERCEL_URL doesnt include `https` so it cant be validated as a URL
process.env.VERCEL ? z.string() : z.string().url(),
),
GOOGLE_CLIENT_ID: z.string(),
GOOGLE_CLIENT_SECRET: z.string(),
STRIPE_SECRET_KEY: z.string(),
});
export const serverEnv = {
DATABASE_URL: process.env.DATABASE_URL,
NODE_ENV: process.env.NODE_ENV,
NEXTAUTH_SECRET: process.env.NEXTAUTH_SECRET,
GOOGLE_CLIENT_ID: process.env.GOOGLE_CLIENT_ID,
GOOGLE_CLIENT_SECRET: process.env.GOOGLE_CLIENT_SECRET,
NEXTAUTH_URL: process.env.NEXTAUTH_URL,
STRIPE_SECRET_KEY: process.env.STRIPE_SECRET_KEY,
};
However, the process.env object is undefined. The only one that has a value is NODE_ENV but it isn't any different than the rest of the env variables.
I'm pretty lost on why this is happening. I've looked up this problem, but nothing is coming up. Am I doing something incorrectly?
For whatever reason I am getting "Invalid Client id" error when testing the authentication flow I set up with next-auth. Here are the steps to reproduce the error:
Setup credentials (Client id /client secret) via google.
Setup environment variables in my ".env.local" file.
error:
Error 400: invalid_request
Missing required parameter: client_id
/api/[next-auth].js file
import NextAuth from "next-auth";
import Providers from "next-auth/providers";
export default NextAuth({
// https://next-auth.js.org/configuration/providers
providers: [
Providers.Email({
server: process.env.EMAIL_SERVER,
from: process.env.EMAIL_FROM,
}),
Providers.Google({
clientId: process.env.GOOGLE_ID,
clientSecret: process.env.GOOGLE_SECRET,
}),
],
});
.env.local file:
NEXT_PUBLIC_GOOGLE_ID=MY_GOOGLE_ID
GOOGLE_SECRET=MY_GOOGLE_SECRET
Figured it out. Here is the answer:
This line:
NEXT_PUBLIC_GOOGLE_ID=MY_GOOGLE_ID
GOOGLE_SECRET=MY_GOOGLE_SECRET
Should look like this:
GOOGLE_ID=MY_GOOGLE_ID
GOOGLE_SECRET=MY_GOOGLE_SECRET
Basically, Don't prepend the "NEXT_PUBLIC_"
I am using a Cloud Function to generate a password-reset-link through the admin sdk.
I need to handle the action link in my website and not my mobile app.
my action code settings looks like :
ActionCodeSettings codeSettings = ActionCodeSettings(
url: "https://example.com/links/reset",
handleCodeInApp: false,
dynamicLinkDomain: "https://example.com/links"
);
and i have also tried :
ActionCodeSettings codeSettings = ActionCodeSettings(
url: "https://example.com/links/reset",
handleCodeInApp: false,
);
Both gives me the following error :
FirebaseAuthError: The provided dynamic link domain is not configured or authorized for the current project.
I am simply using the : admin.auth().generatePasswordResetLink(data.email, actionCodeSettings) method in an onCall https request to my function.
I have of course setup dynamic links for my project and my project is hosted fine with Firebase Hosting.
I have also added this to my firebase.json file :
"rewrites": [ {
"source": "/links/**",
"dynamicLinks": true
} ]
As stated in the documentation.
What i am doing wrong ?
If i generate the ActionCodeSettings from flutter it doesn't work.
However, if in my NodeJS code I implement :
const actionCodeSettings = {
url: "https://example.com/links",
handleCodeInApp: false
};
It's working.
In the logs i could see that the param dynamicLinkDomain was set to null and passed even if i was not using it.
I am working in an Ember.js app and currently trying to connect to firebase (is not my default adapter, the default is a Rest adapter). I followed the instructions given in https://github.com/firebase/emberfire but when I try to read data from the database I get:
Error while processing route: my.routingFile firebase.app is not a function getApp
In brief, this is my routing file:
import AuthenticatedRouteMixin from 'ember-simple-auth/mixins/authenticated-route-mixin';
import RouteMixin from 'ember-cli-pagination/remote/route-mixin';
import Ember from 'ember';
import RealtimeRouteMixin from 'emberfire/mixins/realtime-route';
export default Ember.Route.extend(AuthenticatedRouteMixin,RouteMixin, RealtimeRouteMixin, {
firebaseApp: Ember.inject.service(),
model(params) {
return this.store.findAll('myModel');
},
setupController(){
this._super(...arguments);
},
actions:{
}
});
And, my adapter is defined as follows:
import RealtimeDatabaseAdapter from 'emberfire/adapters/realtime-database';
export default RealtimeDatabaseAdapter.extend({
databaseURL: 'https://my-url.firebaseio.com/'
});
My ember-cli version is: 3.0.2
Then, what am I missing?
I'm surprised that it's not working. Your code looks fine to me. Did you define the environment variables for Firebase in config/environment.js?
I am wondering if it's possible to have separate configurations for GitHub/OAuth for development and production. I'm assuming this is baked it, but I can't find it.
I have a custom configuration that looks something like this:
Accounts.loginServiceConfiguration.insert({
service: "github",
clientId: "19c25aeb2a609872672d",
secret: "07136530fa20c3722caf6c2decc3776ca8729cf2"
});
It works like a dream locally, as the keys were set up for use with localhost. I tried specifying another for production (with no distinction between dev and production in the codebase, just another .insert()), like this:
Accounts.loginServiceConfiguration.insert({
service: "github",
clientId: "19c25aeb2a609872672d",
secret: "07136530fa20c3722caf6c2decc3776ca8729cf2"
});
Accounts.loginServiceConfiguration.insert({
service: "github",
clientId: "9f9e82b7ab0a1e1f3ec1",
secret: "12c1ab66f2c5d37c8c55390d09725c400e1bca84"
});
When I deployed to production, it looks like it's going with the first configuration (localhost).
On server startup (yes, this will be server code), clear all Accounts.loginServiceConfiguration entries. Then reinsert them according to use:
Meteor.startup(function(){
Accounts.loginServiceConfiguration.find({}).remove();
if (process.env.NODE_ENV === "development") {
// Insert all login configs for development
} else {
// Insert all login configs for production
}
}