Unable to load chat, error: "Your credentials are incorrect. Make sure your Project ID, Username, and Password are correct".

[Lilian-Chinelo]

import React, { useState, useEffect} from "react"; import { useHistory } from "react-router-dom"; import { ChatEngine } from "react-chat-engine"; import { auth } from "../firebase";

import { useAuth } from "../contexts/AuthContext"; import axios from "axios";

const Chats = () => { const history = useHistory(); const { user } = useAuth(); const [loading, setLoading] = useState(true);

const handleLogout = async () => {
    await auth.signOut();

    history.push("/");
}

const getFile = async (url) => {
    const response = await fetch(url);
    const data = await response.blob();

    return new File ([data], "userPhoto.jpg", {type: "image/jpeg"})
}

useEffect(() => {
    if(!user){
        history.push("/");

        return;
    }

    axios.get( "https://api.chatengine.io/users/me", {

        headers: {
            "project-id": "95b93670-00f1-4b58-a48f-61c8bc85e99b",
            "user-name": user.email,
            "user-secret": user.uid,
        }
    })
    .then(() => {
        setLoading(false);

    })
    .catch(() => {
        let formdata = new FormData();
        formdata.append("email", user.email);
        formdata.append("username", user.displayName);
        formdata.append("secret", user.uid);

        getFile(user.photoURL)
            .then((avatar) => {
                formdata.append("avatar", avatar, avatar.name);

                axios.post('https://api.chatengine.io/users',
                    formdata,
                    {headers: { 'Private-Key': 'xxxxxxxxxxxxxxxxxxxxxxxxx'}}
                )
                .then(() => setLoading(false))
                .catch((error) => console.log(error))
            })
    })

}, [user, history]);

if (!user || loading) return "Loading . . .";
return (
    <div className="chats-page">
        <div className="nav-bar">
            <div className="logo-tab">
                Unichat
            </div>

            <div onClick={handleLogout} className="logout-tab">
                Logout
            </div>

        </div>

        <ChatEngine 
            height="calc(100vh - 66px)"
            projectID='95b93670-00f1-4b58-a48f-61c8bc85e99b'
            userName={user.email}
            userSecret={user.uid}
        />

    </div>
);

}

export default Chats;

[Lilian-Chinelo]

Note: I had to remove my private key from the above post and replaced it with x's.

I have double-checked my credentials and they all appear correct so I am not sure what I have missed.

[AdyLim98]

Hi ,Im also faced the same issue .Did you solve this problem already? Anybody can help also? Thanks

[Lilian-Chinelo]

Hello,

Yes, I completed the project few weeks ago, my completed project is available on my GitHub repo with the name: Unichat. You can check it out to compare with yours.

Lilian

On Sun, 24 Oct 2021 at 05:18, Lim JiaBao @.***> wrote:

Hi ,Im also faced the same issue .Did you solve this problem already? Anybody can help also? Thanks

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/chatengine-io/react-chat-engine/issues/101#issuecomment-950257496, or unsubscribe https://github.com/notifications/unsubscribe-auth/ARTAG4GSDRWAKMRS7C7XKBDUIOCJRANCNFSM5EWKFJAQ .

[AdyLim98]

Thanks a lot😊😊

[Hamzanaeem00]

Hello ,

@Lilian-Chinelo I'm also facing the same problem how did you solved? what was the issue? i saw your code in repo but it is same as my code and i don't understand what's the issue?

[STFUsubhuu]

Just Change : formdata.append("username", user.displayName); to formdata.append("username", user.email);

fixed :)

[Hamzanaeem00]

Just Change : formdata.append("username", user.displayName); to formdata.append("username", user.email);

fixed :)

didn't work for me :(