Error about Prisma in Remix's Jokes App tutorial - reactjs

In Remix's Jokes App tutorial, I got an error in the process of getting a user in session.server.ts.
I think the error is about Prisma, but I don't know how to solve it.
url: https://remix.run/docs/en/v1/tutorials/jokes#authentication
TypeError: Cannot read properties of undefined (reading 'findUnique')
at login (/usr/src/app/remix-jokes/build/index.js:700:30)
at action2 (/usr/src/app/remix-jokes/build/index.js:751:26)
at runMicrotasks (<anonymous>)
at processTicksAndRejections (node:internal/process/task_queues:96:5)
at async Object.callRouteAction (/usr/src/app/remix-jokes/node_modules/#remix-run/server-runtime/data.js:36:14)
at async renderDocumentRequest (/usr/src/app/remix-jokes/node_modules/#remix-run/server-runtime/server.js:216:24)
at async requestHandler (/usr/src/app/remix-jokes/node_modules/#remix-run/server-runtime/server.js:55:20)
at async /usr/src/app/remix-jokes/node_modules/#remix-run/express/server.js:45:22
It seems to occur in the findUnique call in the following code.
export async function login({
username,
password
}: LoginForm) {
const user = await db.user.findUnique({
where: { username }
});
if (!user) return null;
const isCorrectPassword = await bcrypt.compare(
password,
user.passwordHash
);
if (!isCorrectPassword) return null;
return user;
}

I restarted the Docker container and that solved the problem.
Thank you.

Related

How can I solve a "fetch failed" when I reload a +page.svelte that depends on data from a +page.js

I get an fetch-failed error when I reload a +page.svelte (or load it via window.location.replace()) that depends on data from a +page.js.
In my current "solution" I use invalidate() in the onMount-function of the +error.svelte to load the data.
I'm looking for a better/correct approach to handle the loading.
error-message
fetch failed
TypeError: fetch failed
at Object.processResponse (C:xxx\node_modules\undici\lib\fetch\index.js:199:23)
at C:xxx\node_modules\undici\lib\fetch\index.js:928:38
at node:internal/process/task_queues:141:7
at AsyncResource.runInAsyncScope (node:async_hooks:202:9)
at AsyncResource.runMicrotask (node:internal/process/task_queues:138:8)
at runMicrotasks (<anonymous>)
at processTicksAndRejections (node:internal/process/task_queues:96:5)
+page.js
export const ssr = false; //1 module can't handle SSR
export const load = async ({ fetch }) => {
const response = await fetch(`https://localhost:5001/api/xxx`);
const obj= await response.json();
return {obj}
+error.svelte
onMount(async () => {
await invalidate();
});

FetchError: request failed

I have a bug, i'm trying to make his tutorial for twitter clone in nextjs+tailwindcss+typescript
https://www.youtube.com/watch?v=rCselwxbUgA&t=1357s&ab_channel=SonnySangha
1:42:05 / 3:17:52
I did exactly the same but i feel like my IDE or my nextJS version is making things different
import { Tweet } from "../typings"
export const fetchTweets = async () => {
const res = await fetch(`${process.env.NEXT_PUBLIC_BASE_URL}/api/getTweets/`)
const data = await res.json();
const tweets: Tweet[] = data.tweets;
return tweets
}
FetchError: request to https://localhost:3000/api/getTweets/ failed,
reason: write EPROTO 140020696905664:error:1408F10B:SSL
routines:ssl3_get_record:wrong version
number:../deps/openssl/openssl/ssl/record/ssl3_record.c:332:
This error happened while generating the page. Any console logs >will be displayed in the terminal window.
import { Tweet } from "../typings"
export const fetchTweets = async () => {
if(global.window) {
const res = await
fetch(`${process.env.NEXT_PUBLIC_BASE_URL}/api/getTweets/`)
const data = await res.json();
const tweets: Tweet[] = data.tweets;
return tweets
}
}
Server Error Error: Error serializing .tweets returned from
getServerSideProps in "/". Reason: undefined cannot be serialized
as JSON. Please use null or omit this value.
If someone can help me <3 thanks
FIXED :
.env.local
i writed
NEXT_PUBLIC_BASE_URL=https://localhost:3000/
change https:// by http:// and yarn run dev again
NEXT_PUBLIC_BASE_URL=http://localhost:3000/

An error occurred when I get a data from firestore in React app

I'm developing a task management app with Firebase and React.
Current Code
export const login = (type, email, password) => dispatch => {
dispatch({type: "LOGIN"});
switch (type) {
case "EMAIL": {
// Logging in using Firebase Auth. It goes successfully.
firebase.auth().signInWithEmailAndPassword(email, password).then(result => {
const db = firebase.firestore();
const uid = result.user.uid
// Getting user name from Firestore. The fllowing error occurs here.
let name;
db.collection("users").get().then(querySnapshot => {
querySnapshot.forEach(doc => {
name = doc.name;
dispatch({type: "LOGIN_SUCCEEDED", uid: uid, name: name,});
dispatch(push("/"))
});
}).catch(err => {
dispatch({type: "LOGIN_REJECTED", error: err});
});
}).catch(err => {
dispatch({type: "LOGIN_REJECTED", error: err.message});
});
break;
}
default: {}
}
Only the code of the relevant part here.
Other codes are in Github.
Auth(Firebase)
Firestore
The error occured
[2020-06-07T03:54:57.645Z] #firebase/firestore: Firestore (7.15.0): Could not reach Cloud Firestore backend. Connection failed 1 times. Most recent error: FirebaseError: [code=unknown]: Fetching auth token failed: getToken aborted due to token change.
This typically indicates that your device does not have a healthy Internet connection at the moment. The client will operate in offline mode until it is able to successfully connect to the backend. index.js:1
I tried this to solve the error:
Check the network => It is healthy. I can see any pages on the internet and even connect to firebase auth in same program.
Use older virsion Firebase => nothing changed.
This is caused because the user is already logged, do something like this and will work:
if (!firebase.auth().currentUser) {
await firebase.auth().signInWithEmailAndPassword(email, password);
}
Obs: To use await, you will need a async function
Hope it help :)

Fetch data in InitialProps

the website it's make with Reactjs, Nextjs and Prismic for manage the data on back end
I try to put the content of my article in the getInitialProps in my file, i recover the parameter for found the good article by the slug of article, in development i have no problem but when i want to deploy the application i have an error
Blog.getInitialProps = async ({ query: { uid }, pathname }) => {
const page = await Prismic.getApi(process.env.PRISMIC_API_ENDPOINT, {
accessToken: process.env.PRISMIC_ACCESS_TOKEN
}).then(function(api) {
return api.getByUID('blog', uid)
});
return {
page,
uid,
pathname
}
};
Actually, when i launch npm run deploy i have this error :
Unable to encode undefined of type undefined
at q (/Applications/MAMP/htdocs/cotenature-com/node_modules/prismic-javascript/dist/prismic-javascript.min.js:1:10587)
at Object.at (/Applications/MAMP/htdocs/cotenature-com/node_modules/prismic-javascript/dist/prismic-javascript.min.js:1:11859)
at t.getByUID (/Applications/MAMP/htdocs/cotenature-com/node_modules/prismic-javascript/dist/prismic-javascript.min.js:1:3961)
at /Applications/MAMP/htdocs/cotenature-com/.next/server/static/rZDgTUBaVKx0J4_TTzYMp/pages/blog/[uid].js:693:26
at process._tickCallback (internal/process/next_tick.js:68:7)
Thanks,

Firebase Jest auth/network-request-failed' error

I'm trying to do Firebase testing Using Jest. This is my test case.
test('Test Firebase Connection', done => {
let history = [];
function callback(history) {
expect(history[0]).toBe('/dashboard');
done();
}
firebaseDAO.init('myEmail', 'mypassword', history);
setTimeout(callback, 4000,history);
});
export const init = (username, passwordPassed, history) => {
let historyData = history;
const email = username;
const password = passwordPassed;
const auth = firebase.auth();
const promise = auth.signInWithEmailAndPassword(email, password);
promise.catch(e => console.log(e));
promise.then(() => {historyData.push('/dashboard');});
};
When I run the test with Idea-Webstorm-Jest Plugin it Works. (Test passes.)
But when I try with npm Test command. Firebase gives me following Error.
{code: 'auth/network-request-failed',
message: 'A network error (such as timeout, interrupted connection or unreachable host) has occurred.' }
So why it is fails when npm Test command runs? Anyone can help me? thanks in advance.
I had that problem too, i looked for google and i found that my input or button in html was in type:"submit" which made the page refresh, it's better to do type"button"

Resources