I currently work on these projects:
- 💾 nuxt-edgedb-module
- 🧑🎨 Pinceau
- 👨🔬 sfc-composer
- 🤹 @vueuse/motion
- 🎺 @vueuse/sound
- 🕹 @vueuse/gesture
Follow me on: 𝕏 • GitHub • YouTube • Twitch
If you like my work, consider looking at my sponsors page! 💌
💽 Nuxt 3 integration for EdgeDB
I currently work on these projects:
Follow me on: 𝕏 • GitHub • YouTube • Twitch
If you like my work, consider looking at my sponsors page! 💌
When the auth/identity
handler is invoked with an invalid token, it'll throw an error when trying to fetch the current user. This sends the application in an infinite loop trying to get the identity.
This happened when the access token cookie had been set by another EdgeDB instance running on the same host (localhost:3000). But it would also occur with sessions of the same EdgeDb instance if the auth_signing_key
was changed, since that would also cause a JWT signature mismatch.
In order to deal with this gracefully, we need to catch the error when trying to fetch the current user and delete the token cookie.
I'm currently preparing a fix and will submit a PR.
Nuxt 3.8.1 fails to resolve a plugin when auth is enabled. It's trying to resolve node_modules/nuxt-edgedb-module/dist/runtime/plugin/edgedb-auth.ts
, but since this is the build output, it's supposed to be edgedb-auth.mjs
.
Demo repo with minimal setup here
nuxt.config.ts
export default defineNuxtConfig({
devtools: { enabled: true },
modules: ['nuxt-edgedb-module'],
edgeDb: {
auth: true,
},
})
Currently the authenticated User isn't exposed by the API directly but has to be retrieved separately using ext::auth::Identity
. EdgeDB doesn't have the notion of a User, it knows only identities and a User is just another type that happens to be associated with an Identity.
There is a lot of flexibility in this approach as the User type can be defined by the application and carry any additional information. However, it is more intuitive and practical to have the User as the primary object exposed by auth. Most applications will want to associate a User with other types (like author of a Post).
Currently the User is created as a side-effect when the Identity is retrieved:
nuxt-edgedb/src/runtime/api/auth/identity.ts
Lines 15 to 24 in 37ac5c4
That doesn't feel right, especially if you want to collect other data (like name) as part of the signup process. It's more intuitive to create the User in the signup handler instead of merely a side-effect in the identity handler. The email and password fields can be used to create the identity and all other fields are assigned to the User.
It might be good to allow for customizing the User type etc. but for now, I'd just require that if auth is enabled, there has to be a type named User
which has to have at least an identity field.
Just an idea so far. Let me know what you think!
We could supply a defineEdgeDbHandler
function that could be used to wrap query builder methods:
// /server/api/blogpost.ts
const q = useEdgeDbQueryBuilder()
export default defineEdgeDbHandler(
q.BlogPost,
{
// /api/blogpost GET
select: async (blogPost, req) => {
// blogPost would be the data returned from the query build upon operation
// return of this function would be alterable if that function is defined
// if the function return is undefined, then the `blogPost` will be returned
// if the function returns something, then it will replace original return type
// the `select` as it is `GET` would support query parameters from `q.select()` via query parameters
}
// /api/blogpost POST
create: async (blogPost, req) => {
// the `create`, `update`, `delete` would support passing properties and links via JSON body
},
// /api/blogpost PATCH
update: async (blogPost, req) => {
...
},
// /api/blogpost DELETE
delete: async (blogPost, req) => {
...
}
}
)
I guess it would also automatically support auth as req
would automatically be passed to client
used in the background.
WDYT @juni0r ?
The generateQueryBuilder
method runs @edgedb/generate edgeql-js
but if the generated folder doesn't exist will prompt the user to add it to .gitignore
. Since by default generation is quiet, server startup gets stuck at this point. It will work subsequently as soon as the folder has been created.
To fix this, the command needs to be invoked with yes n
, like so: yes n | @edgedb/generate edgeql-js [...]
to dismiss the prompt. I think this should be easy with execa, similar to this example.
I'd also suggest that even in quiet mode, there should be one line per generator to give some status information, which isn't exactly verbose but still gives useful feedback. Like so:
Generating EdgeDb queries.
Generating EdgeDb query builder.
...
The quiet option could become 'verbose' and show the full output of the generators.
I think we could easily supply a useEdgeDbPaginatedQuery
composable that would make it easy to play with orderBy
, offset
and limit
parameters from the Query Builder.
When using auth api handlers (such as login) fails due to server modules not being auto-imported. Reproduction repo.
[nuxt] [request error] [unhandled] [500] useEdgeDbPKCE is not defined
at <anonymous> (./node_modules/nuxt-edgedb-module/dist/runtime/api/auth/login.mjs:3:16)
at Object.handler (./node_modules/h3/dist/index.mjs:1851:28)
at Object.handler (./node_modules/h3/dist/index.mjs:1675:31)
at async Server.toNodeHandle (./node_modules/h3/dist/index.mjs:1885:7)
nuxt-edgedb/src/runtime/api/auth/login.ts
Lines 2 to 6 in b8338ed
The modules in src/runtime/server
should be auto-imported since the module adds them to Nitro's import paths, but apparently something goes wrong. I'd love to investigate further but I'm not too familiar with Nuxt 3 modules yet. I suspect it's to do with the import folder containing .mjs
files instead of .ts
.
The logout function provided by useEdgeDbIdentity
doesn't end the client session. The session is based on the edgedb-auth-token
cookie which is set as HTTP-only by the server and can therefore not be set/deleted by Javascript.
nuxt-edgedb/src/runtime/plugin/edgedb-auth.ts
Lines 22 to 24 in d18d1ed
The only way to remove the cookie is to call a server logout route.
Will submit a PR with a fix.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.