i tried sending the credentials and this error appears.
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://www.googleapis.com/identitytoolkit/v3/relyingparty/signupNewUser?key=*******. (Reason: CORS request did not succeed).
(function () {
var config = {
apiKey: "*******",
authDomain: "*******",
databaseURL: "*******",
projectId: "*******",
storageBucket: "*******",
messagingSenderId: "*******"
};
firebase.initializeApp(config);
const email = document.getElementById('email');
const password = document.getElementById('password');
const btnSignUp = document.getElementById('btnSignUp');
btnSignUp.addEventListener('click', e => {
const mail = email.value;
const pass = password.value;
firebase.auth().createUserWithEmailAndPassword(mail, pass).catch(function(error) {
var errorCode = error.code;
var errorMessage = error.message;
if (errorCode == 'auth/weak-password') {
alert('The password is too weak.');
} else {
alert(errorMessage);
}
console.log(error);
});
});
}());
How do I solve the CORS request blocked?
Your firebase imports are wrong, use this:
<!-- Firebase App is always required and must be first -->
<script src="https://www.gstatic.com/firebasejs/5.1.0/firebase-app.js"></script>
<!-- Add additional services that you want to use -->
<script src="https://www.gstatic.com/firebasejs/5.1.0/firebase-auth.js"></script>
Related
I am trying to login as an authenticated user anonymously. Here is my code:
import { initializeApp } from 'https://www.gstatic.com/firebasejs/9.14.0/firebase-app.js';
import { getAuth, onAuthStateChanged } from "https://www.gstatic.com/firebasejs/9.14.0/firebase-auth.js";
const firebaseConfig = {
apiKey: "key_here",
authDomain: "project.firebaseapp.com",
projectId: "project",
storageBucket: "project.appspot.com",
messagingSenderId: "id_here",
databaseURL: "https://project-default-rtdb.firebaseio.com",
appId: "app_id_here"
};
const app = initializeApp(firebaseConfig);
const auth = getAuth();
document.getElementById("login").addEventListener("click",function(event){
event.preventDefault();
onAuthStateChanged(auth, (user) => {
if(user){
//user can successfully login
}
else{
console.log("Something went wrong");
}
}, (error) => console.error(error)) //Nothing prints here
}
I was able to successfully log in 'til yesterday. But since this morning I keep getting the error Something went wrong in my console.
I didn't change anything in the code, nor in my firebase credentials. Where am I going wrong?
It was so silly of me to not read the documentation page carefully, I had forgotten to execute the signInAnonymously() method before checking for the user's data, the complete code is as follows:
import { initializeApp } from 'https://www.gstatic.com/firebasejs/9.14.0/firebase-app.js';
import { getAuth, onAuthStateChanged, signInAnonymously } from "https://www.gstatic.com/firebasejs/9.14.0/firebase-auth.js";
const firebaseConfig = {
apiKey: "key_here",
authDomain: "project.firebaseapp.com",
projectId: "project",
storageBucket: "project.appspot.com",
messagingSenderId: "id_here",
databaseURL: "https://project-default-rtdb.firebaseio.com",
appId: "app_id_here"
};
const app = initializeApp(firebaseConfig);
const auth = getAuth();
document.getElementById("login").addEventListener("click",function(event){
event.preventDefault();
signInAnonymously(auth)
.then(() => {
onAuthStateChanged(auth, (user) => {
if(user){
//user can successfully login
}
else{
console.log("Something went wrong");
}
});
})
.catch((error) => {
const errorCode = error.code;
const errorMessage = error.message;
console.log(errorCode+": "+errorMessage);
});
});
i wanted to create a login with facebook button, so i created this code:
import { getAuth, signOut,
onAuthStateChanged, FacebookAuthProvider, signInWithPopup } from "https://www.gstatic.com/firebasejs/9.0.2/firebase-auth.js";
const firebaseConfig = {
apiKey: "AIzaSyC3GLIN5TBmCDoTfy0dEOgOdvVvqNw-ric",
authDomain: "auth-project-38aaa.firebaseapp.com",
projectId: "auth-project-38aaa",
storageBucket: "auth-project-38aaa.appspot.com",
messagingSenderId: "431888894254",
appId: "1:431888894254:web:71bb9b250fbb8a21edd2bf",
measurementId: "G-6BBPCJ3814"
};
const app = initializeApp(firebaseConfig);
const auth = getAuth(app);
// login with facebook
const facebookProvider = new FacebookAuthProvider();
const signInWithFacebook = document.querySelector('#facebook-icon');
signInWithFacebook.addEventListener('click', (e) => {
e.preventDefault();
signInWithPopup(auth, facebookProvider).then((result) => {
const user = result.user;
const credential = FacebookAuthProvider.credentialFromResult(result);
const accessToken = credential.accessToken;
})
.catch((error) => {
const errorCode = error.code;
const errorMessage = error.message;
const email = error.email;
const credential = FacebookAuthProvider.credentialFromError(error);
});
});
when i try to login with facebook it gives me this error message:
Facebook has detected that firebase sign in isn't using a secure connection to transfer information.
can you help to solve this problem, please?
For these tests you must run them with an SSL connection, if you are testing on localhost you are probably not using SSL.
I have made a web app which includes a form with two fields and what I want to happen is when I click the button, my data should be written to Firebase. So I made an onclick function which writes to Firebase, the function is called but it doesn't write to Firebase. I get this error message:
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at
https://firebasestorage.googleapis.com/v0/b/storymap-da000.appspot.com/o?name=11-2-2018-0-6-27.
(Reason: CORS request did not succeed).[Learn More]
My vanilla JavaScript code:
var config = {
apiKey: "XXX",
authDomain: "XXX",
databaseURL: "XXX",
projectId: "XXX",
storageBucket: "XXX",
messagingSenderId: "XXX"
};
firebase.initializeApp(config);
window.addEventListener('load', function() {
const fileButton = document.getElementById("fileButton");
const up = document.getElementById("up")
});
fileButton.addEventListener('change', function(e){
var file = e.target.files[0];
var storageRef = firebase.storage().ref(image_name);
storageRef.put(file)
});
up.onclick=function(){
var lat = new URL(location.href).searchParams.get("lat")
var lng = new URL(location.href).searchParams.get("lng")
var title = document.getElementById("title").value
var story = document.getElementById("story").value
var database = firebase.firestore()
database.collection("Stories").add({
title:title,
story:story,
lat: lat,
lng:lng,
url:image_name});}
Any ideas?
i think you need to register your domain in your firebase app
var config = {
apiKey: "A**********************kBs",
authDomain: "the**********.firebaseapp.com",
databaseURL: "https://***********.firebaseio.com",
projectId: "the-o***********nette",
storageBucket: "the***********.appspot.com",
messagingSenderId: "6***********6"
};
firebase.initializeApp(config);
$("#register").click(
function() {
var email=$("#regEmail").val();
var password=$("#regPass").val();
var fname=$("#regfName").val();
var lname=$("#reglName").val();
firebase.auth().createUserWithEmailAndPassword(email, password)
.catch(function(error) {
// Handle Errors here.
var errorCode = error.code;
var errorMessage = error.message;
alert(errorMessage)
});
alert( "you have successfully registered");
// Get a reference to the database service
var database = firebase.database();
var userId = firebase.auth().currentUser;
firebase.database().ref('users/' + userId).set({
fname: fname,
lname: lname,
email: email,
})
.catch(function(error) {
var errormsg=error.message;
console.log(errormsg);
});
}
);
The createuserwithemailandpassword is working properly. But I am not able to add anything into the database. No error log is reported. The var is mentioned in the HTML file. Let me know if anything else is needed. thanks!
You are passing the full user object instead of the uid. Please try this:
var userId = firebase.auth().currentUser.uid;
firebase.database().ref('users/' + userId).set();
Helle all,
I want to start my web site with Firebase but I think I miss something. For my test I have juste one page.
var config = {
apiKey: "xxxxxxxxxxxxxxxxxxx",
authDomain: "xxxxxxxxx.firebaseapp.com",
databaseURL: "https://xxxxxxx.firebaseio.com",
projectId: "xxxxxx",
storageBucket: "xxxxxx.appspot.com",
messagingSenderId: "xxxxxxxxxxxx"
};
firebase.initializeApp(config);
firebase.auth().createUserWithEmailAndPassword(email, password).catch(function(error) {
var errorCode = error.code;
var errorMessage = error.message;
if (errorCode == 'auth/weak-password') {
alert('The password is too weak.');
} else {
alert(errorMessage);
}
console.log(error);
});
I have an error
Failed to load https://www.googleapis.com/identitytoolkit/v3/relyingparty/signupNewUser?key=AIzaSyCxa9cGDUAuR03RuCgPeyvNzsYVJ8xwXVU: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'xxxxxxxxxxxxxxxxxxxxxxx' is therefore not allowed access. The response had HTTP status code 404.
Do you have an idea ?
Ps : I am on an online IDE, codeanywhere
Thanks