I follow this tutorial with Vue, Appwrite https://appwrite.io/docs/tutorials/vue/step-1
src/appwrite/index.js
import { Client, Databases, Account } from "appwrite";
const client = new Client();
client
.setEndpoint("https://cloud.appwrite.io/v1")
.setProject("PROJECT-ID"); // Replace with your project ID
export const account = new Account(client);
export const databases = new Databases(client);
src/store/user.js
import { ID } from 'appwrite';
import { account } from "@/appwrite";
import { reactive } from "vue";
export const user = reactive({
current: null,
async init() {
try {
this.current = await account.get();
} catch (e) {
this.current = null;
}
},
async register(email, password) {
await account.create(ID.unique(), email, password);
await this.login(email, password);
},
async login(email, password) {
await account.createEmailSession(email, password);
window.location.href = "/";
},
async logout() {
await account.deleteSession("current");
this.current = null;
},
});
src/pages/auth/Login.vue
<script setup>
import { user } from "@/store/users";
import { ref } from "vue";
const email = ref("");
const password = ref("");
</script>
<template>
<section>
<h1>Login or register</h1>
<form>
<input type="email" placeholder="Email" v-model="email" />
<input type="password" placeholder="Password" v-model="password" />
<div>
<button type="button" @click="user.login(email, password)">
Login
</button>
<button type="button" @click="user.register(email, password)">
Register
</button>
</div>
</form>
</section>
</template>
Register function is OK. New user is created in Appwrite Console/Auth.
But when clicking to Login button, it throws an error
Uncaught (in promise) TypeError: account.createEmailSession is not a function
I cannot find a proper answer anywhere. Can someone explain it?
I'm following the tutorial now as well, but I'm using Vite and React instead. This error was solved on my end by using
createEmailPasswordSession()instead. Not sure if that would work for a Vue app.