While i am running ionic facebook firebase app on browser i got error as
HomePage.html:8 ERROR TypeError: Object(...) is not a function
at Facebook.login (index.js:27)
at HomePage.webpackJsonp.230.HomePage.loginWithFacebook (home.ts:20)
at Object.eval [as handleEvent] (HomePage.html:8)
at handleEvent (core.js:13589)
at callWithDebugContext (core.js:15098)
at Object.debugHandleEvent [as handleEvent] (core.js:14685)
at dispatchEvent (core.js:10004)
at core.js:10629
at HTMLButtonElement.<anonymous> (platform-browser.js:2628)
at t.invokeTask (polyfills.js:3)
my home.ts file is
loginWithFacebook(): Promise<any> {
return this.facebook.login(['email'])
.then( response => {
const facebookCredential = firebase.auth.FacebookAuthProvider
.credential(response.authResponse.accessToken);
firebase.auth().signInWithCredential(facebookCredential)
.then( success => {
alert("Firebase success: " + JSON.stringify(success));
});
}).catch((error) => { console.log(error) });
}
my home.html file is
<ion-content padding>
<button ion-button (click)="loginWithFacebook()">Login With Facebook</button>
</ion-content>
I am really stuck here....
Related
Hi I'm newbie of coding and tried making todo app.
but encountered an error during building in vercel..
It works fine in dev environment.
Using Next13,typscript,prisma,postgreSQL,railway,tailwind
error code
SyntaxError: Unexpected token T in JSON at position 0
at JSON.parse (<anonymous>)
at Response.json (node:internal/deps/undici/undici:6160:23)
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
at async Home (/vercel/path0/.next/server/app/page.js:478:18)
Error occurred prerendering page "/". Read more: https://nextjs.org/docs/messages/prerender-error
SyntaxError: Unexpected token T in JSON at position 0
at JSON.parse (<anonymous>)
at Response.json (node:internal/deps/undici/undici:6160:23)
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
at async Home (/vercel/path0/.next/server/app/page.js:478:18)
info - Generating static pages (3/3)
> Build error occurred
Error: Export encountered errors on following paths:
/page: /
at /vercel/path0/node_modules/next/dist/export/index.js:415:19
at async Span.traceAsyncFn (/vercel/path0/node_modules/next/dist/trace/trace.js:79:20)
at async /vercel/path0/node_modules/next/dist/build/index.js:1400:21
at async Span.traceAsyncFn (/vercel/path0/node_modules/next/dist/trace/trace.js:79:20)
at async /vercel/path0/node_modules/next/dist/build/index.js:1259:17
at async Span.traceAsyncFn (/vercel/path0/node_modules/next/dist/trace/trace.js:79:20)
at async Object.build [as default] (/vercel/path0/node_modules/next/dist/build/index.js:66:29)
Error: Command "npm run build" exited with 1
page.tsx
import PostForm from "../components/PostForm";
import Tasks from "../components/Tasks";
async function getPosts() {
const res = await fetch(`${process.env.BASE_URL}/api/getPosts`);
if (!res.ok) {
console.log(res);
}
return res.json();
}
export default async function Home() {
const data: {
id: number;
title: string;
content: string;
timestamp: string;
}[] = await getPosts();
return (
<div>
<PostForm />
<div className="sm:flex sm:justify-center sm:items-baseline sm:flex-wrap max-w-7xl mx-auto mt-7">
{data.reverse().map((post) => (
<Tasks
title={post.title}
content={post.content}
id={post.id}
timestamp={post.timestamp}
/>
))}{" "}
</div>
</div>
);
}
package-json
{
"name": "testapp-next13-tailwind-prisma-postgresql-typescript",
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start",
"lint": "next lint"
},
"dependencies": {
"#next/font": "13.1.6",
"#prisma/client": "^4.9.0",
"#types/react": "18.0.27",
"#types/react-dom": "18.0.10",
"next": "13.1.6",
"react": "18.2.0",
"react-dom": "18.2.0"
},
"devDependencies": {
"#types/node": "^18.11.19",
"autoprefixer": "^10.4.13",
"postcss": "^8.4.21",
"prisma": "^4.9.0",
"tailwindcss": "^3.2.4",
"ts-node": "^10.9.1",
"typescript": "^4.9.5"
}
}
You can see repository here
https://github.com/satoshi02198/Task-maker
I'd appriciate any help.Thanks in advance.
change code in page.tsx to client component with using useEffect for fetching data instead of server side rendering.(you can see that umcoment code in the repository in page.tsx but that code also can't deploy)
I also checked Enviroment variable setting in vercel BASE_URL set to https://task-maker-3.vercel.app (that vercel try to deploy to) and DATABASE_URL for PostgreSQL
I edited page.tsx to this syntaxError seems resolve but new error come
async function getPosts() {
const res = await fetch(`${process.env.BASE_URL}/api/getPosts`);
if (!res.ok) {
console.log(res.json());
}
return res.text();
}
export default async function Home() {
const data = await getPosts();
const jsonData = JSON.parse(data);
console.log(jsonData);
return (
<div>
<PostForm />
<div className="sm:flex sm:justify-center sm:items-baseline sm:flex-wrap max-w-7xl mx-auto mt-7">
{jsonData
.reverse()
.map(
(post: {
title: string;
content: string;
id: number;
timestamp: string;
}) => (
<Tasks
title={post.title}
content={post.content}
id={post.id}
timestamp={post.timestamp}
/>
)
)}{" "}
</div>
</div>
);
}
and Vercel new error
TypeError: The body has already been consumed.
at consumeBody (node:internal/deps/undici/undici:6072:19)
at consumeBody.next (<anonymous>)
at Response.text (node:internal/deps/undici/undici:6146:28)
at getPosts (/vercel/path0/.next/server/app/page.js:457:16)
at process.processTicksAndRejections (
node:internal/process/task_queues:95:5)
at async Home (/vercel/path0/.next/server/app/page.js:460:18)
Error occurred prerendering page "/". Read more:
https://nextjs.org/docs/messages/prerender-error
TypeError: The body has already been consumed.
at consumeBody (node:internal/deps/undici/undici:6072:19)
at consumeBody.next (<anonymous>)
at Response.text (node:internal/deps/undici/undici:6146:28)
at getPosts (/vercel/path0/.next/server/app/page.js:457:16)
at process.processTicksAndRejections
(node:internal/process/task_queues:95:5)
at async Home (/vercel/path0/.next/server/app/page.js:460:18)
info - Generating static pages (3/3)
> Build error occurred
Error: Export encountered errors on following paths:
/page: /
at /vercel/path0/node_modules/next/dist/export/index.js:415:19
at process.processTicksAndRejections
(node:internal/process/task_queues:95:5)
at async Span.traceAsyncFn
(/vercel/path0/node_modules/next/dist/trace/trace.js:79:20)
at async /vercel/path0/node_modules/next/dist/build/index.js:1400:21
at async Span.traceAsyncFn
(/vercel/path0/node_modules/next/dist/trace/trace.js:79:20)
at async /vercel/path0/node_modules/next/dist/build/index.js:1259:17
at async Span.traceAsyncFn
(/vercel/path0/node_modules/next/dist/trace/trace.js:79:20)
at async Object.build [as default]
(/vercel/path0/node_modules/next/dist/build/index.js:66:29)
Error: Command "npm run build" exited with 1
It is because the data or error returned by fetch is not a valid JSON object.
So instead of:
res.json()
do:
res.text()
And then you can do JSON.parse after you do an error check.
once I try to call signInWithPhoneNumber() on flutter web, I get an error:
TypeError: Cannot read properties of undefined (reading 'settings')
at new RecaptchaVerifier (https://www.gstatic.com/firebasejs/9.9.0/firebase-auth.js:8390:43)
at RecaptchaVerifier.new (http://localhost:60687/packages/firebase_auth_web/src/interop/auth.dart.lib.js:863:233)
at new firebase_auth_web_recaptcha_verifier_factory.RecaptchaVerifierFactoryWeb.new (http://localhost:60687/packages/firebase_auth_web/src/firebase_auth_web_recaptcha_verifier_factory.dart.lib.js:175:49)
at firebase_auth_web_recaptcha_verifier_factory.RecaptchaVerifierFactoryWeb.__.delegateFor (http://localhost:60687/packages/firebase_auth_web/src/firebase_auth_web_recaptcha_verifier_factory.dart.lib.js:87:14)
at RecaptchaVerifier.new (http://localhost:60687/packages/firebase_auth/firebase_auth.dart.lib.js:643:94)
at auth_service.AuthService.new.signInUp (http://localhost:60687/packages/qew_app/page_models/welcome_page_model.dart.lib.js:12180:98)
at signInUp.next (<anonymous>)
at runBody (http://localhost:60687/dart_sdk.js:40660:34)
at Object._async [as async] (http://localhost:60687/dart_sdk.js:40691:7)
at auth_service.AuthService.new.signInUp (http://localhost:60687/packages/qew_app/page_models/welcome_page_model.dart.lib.js:12179:20)
at logister_page_model.LogisterPageModel.new.logister (http://localhost:60687/packages/qew_app/page_models/welcome_page_model.dart.lib.js:9060:65)
at logister.next (<anonymous>)
at runBody (http://localhost:60687/dart_sdk.js:40660:34)
at Object._async [as async] (http://localhost:60687/dart_sdk.js:40691:7)
at logister_page_model.LogisterPageModel.new.logister (http://localhost:60687/packages/qew_app/page_models/welcome_page_model.dart.lib.js:9055:20)
at logister_widgets.PhoneNumberCard.new.<anonymous> (http://localhost:60687/packages/qew_app/page_models/welcome_page_model.dart.lib.js:9318:23)
at logister_widgets._PhoneNumberCardState.new.formSubmit (http://localhost:60687/packages/qew_app/ui/views/pages/logister/logister_widgets.dart.lib.js:1543:12)
at http://localhost:60687/packages/qew_app/ui/views/pages/logister/logister_widgets.dart.lib.js:1547:1021
at [_finalizeEditing] (http://localhost:60687/packages/flutter/src/widgets/title.dart.lib.js:36779:9)
at editable_text.EditableTextState.new.performAction (http://localhost:60687/packages/flutter/src/widgets/title.dart.lib.js:36652:39)
at text_input.TextInput.__._handleTextInputInvocation (http://localhost:60687/packages/flutter/src/services/text_formatter.dart.lib.js:2373:66)
at _handleTextInputInvocation.next (<anonymous>)
at runBody (http://localhost:60687/dart_sdk.js:40660:34)
at Object._async [as async] (http://localhost:60687/dart_sdk.js:40691:7)
at [_handleTextInputInvocation] (http://localhost:60687/packages/flutter/src/services/text_formatter.dart.lib.js:2288:20)
at OptionalMethodChannel._handleAsMethodCall (http://localhost:60687/packages/flutter/src/services/restoration.dart.lib.js:1599:57)
at _handleAsMethodCall.next (<anonymous>)
at runBody (http://localhost:60687/dart_sdk.js:40660:34)
at Object._async [as async] (http://localhost:60687/dart_sdk.js:40691:7)
at [_handleAsMethodCall] (http://localhost:60687/packages/flutter/src/services/restoration.dart.lib.js:1596:20)
at http://localhost:60687/packages/flutter/src/services/restoration.dart.lib.js:1593:126
at http://localhost:60687/packages/flutter/src/services/restoration.dart.lib.js:6148:31
at Generator.next (<anonymous>)
at runBody (http://localhost:60687/dart_sdk.js:40660:34)
at Object._async [as async] (http://localhost:60687/dart_sdk.js:40691:7)
at http://localhost:60687/packages/flutter/src/services/restoration.dart.lib.js:6145:82
at Object.invoke2 (http://localhost:60687/dart_sdk.js:191758:7)
at ui._ChannelCallbackRecord.new.invoke (http://localhost:60687/dart_sdk.js:133047:15)
at ui._Channel.new.push (http://localhost:60687/dart_sdk.js:133118:54)
at ui.ChannelBuffers.new.push (http://localhost:60687/dart_sdk.js:133209:19)
at _engine.EnginePlatformDispatcher.__.invokeOnPlatformMessage (http://localhost:60687/dart_sdk.js:171990:27)
at _engine.TextEditingChannel.new.performAction (http://localhost:60687/dart_sdk.js:186458:49)
at http://localhost:60687/dart_sdk.js:186537:24
at _engine.GloballyPositionedTextEditingStrategy.new.maybeSendAction (http://localhost:60687/dart_sdk.js:178127:40)
at Object._checkAndCall (http://localhost:60687/dart_sdk.js:5279:16)
at Object.dcall (http://localhost:60687/dart_sdk.js:5284:17)
at HTMLInputElement.<anonymous> (http://localhost:60687/dart_sdk.js:109003:100)
I'm doing the most basic initialization:
await Firebase.initializeApp(
options: DefaultFirebaseOptions.currentPlatform,
);
which is generated using flutterfire, and on index.html:
<script type="module" src="https://www.gstatic.com/firebasejs/9.6.10/firebase-auth.js"></script>
<script type="module" src="https://www.gstatic.com/firebasejs/9.6.10/firebase-firestore.js"></script>
<script type="module" src="https://www.gstatic.com/firebasejs/9.6.10/firebase-functions.js"></script>
<script type="module">
// Import the functions you need from the SDKs you need
import { initializeApp } from "https://www.gstatic.com/firebasejs/9.6.10/firebase-app.js";
import { getAnalytics } from "https://www.gstatic.com/firebasejs/9.6.10/firebase-analytics.js";
// TODO: Add SDKs for Firebase products that you want to use
// https://firebase.google.com/docs/web/setup#available-libraries
// Your web app's Firebase configuration
// For Firebase JS SDK v7.20.0 and later, measurementId is optional
const firebaseConfig = {
apiKey: "secret",
authDomain: "secret",
projectId: "secret",
storageBucket: "secret",
messagingSenderId: "secret",
appId: "secret",
measurementId: "secret"
};
// Initialize Firebase
const app = initializeApp(firebaseConfig);
const analytics = getAnalytics(app);
}
I tried to change the versions to newer ones(even though I'm using older ones deliberately) and a lot of different configuration, and nothing worked:
js example
as you can see in the loaded js module, the authExtern is unidentified.
git issues addressing the subject:
https://github.com/firebase/flutterfire/issues/9123
https://github.com/firebase/flutterfire/issues/9124
if someone can think on how to bypass this error, it would be very helpful.
router.post('/addtodo', (req, res, next) => {
let todo = new Todos({
text: req.body.text,
date: new Date(),
});
Todos.addTodo(todo, (err, todos, next) => {
if(err) throw err;
res.json(todos);
});
});
I am trying to save a document in the Todo schema using the above method
Schema and methods are as follows
const todoSchema = mongoose.Schema({
text: {
type: String
},
date: {
type: Date,
default: Date.now
}
});
const Todos = module.exports = mongoose.model('todos', todoSchema);
//Retrieve documents
module.exports.getTodos = (callback) => {
Todos.find(callback);
};
//Add document
module.exports.addTodo = (todo, callback) => {
Todos.create(todo, callback);
};
But when I try to POST a json object using postman it shows this error.
<body>
<pre>TypeError: Cannot read property 'text' of undefined
<br> at router.post (C:\Users\shahaji.shinde\Desktop\practice\todo-mean\router\todoroute.js:18:24)
<br> at Layer.handle [as handle_request] (C:\Users\shahaji.shinde\Desktop\practice\todo-mean\node_modules\express\lib\router\layer.js:95:5)
<br> at next (C:\Users\shahaji.shinde\Desktop\practice\todo-mean\node_modules\express\lib\router\route.js:137:13)
<br> at Route.dispatch (C:\Users\shahaji.shinde\Desktop\practice\todo-mean\node_modules\express\lib\router\route.js:112:3)
<br> at Layer.handle [as handle_request] (C:\Users\shahaji.shinde\Desktop\practice\todo-mean\node_modules\express\lib\router\layer.js:95:5)
<br> at C:\Users\shahaji.shinde\Desktop\practice\todo-mean\node_modules\express\lib\router\index.js:281:22
<br> at Function.process_params (C:\Users\shahaji.shinde\Desktop\practice\todo-mean\node_modules\express\lib\router\index.js:335:12)
<br> at next (C:\Users\shahaji.shinde\Desktop\practice\todo-mean\node_modules\express\lib\router\index.js:275:10)
<br> at Function.handle (C:\Users\shahaji.shinde\Desktop\practice\todo-mean\node_modules\express\lib\router\index.js:174:3)
<br> at router (C:\Users\shahaji.shinde\Desktop\practice\todo-mean\node_modules\express\lib\router\index.js:47:12)
<br> at Layer.handle [as handle_request] (C:\Users\shahaji.shinde\Desktop\practice\todo-mean\node_modules\express\lib\router\layer.js:95:5)
<br> at trim_prefix (C:\Users\shahaji.shinde\Desktop\practice\todo-mean\node_modules\express\lib\router\index.js:317:13)
<br> at C:\Users\shahaji.shinde\Desktop\practice\todo-mean\node_modules\express\lib\router\index.js:284:7
<br> at Function.process_params (C:\Users\shahaji.shinde\Desktop\practice\todo-mean\node_modules\express\lib\router\index.js:335:12)
<br> at next (C:\Users\shahaji.shinde\Desktop\practice\todo-mean\node_modules\express\lib\router\index.js:275:10)
<br> at expressInit (C:\Users\shahaji.shinde\Desktop\practice\todo-mean\node_modules\express\lib\middleware\init.js:40:5)
</pre>
</body>
The error is in the first code snippet- line number 3.
Two possible causes come to my mind with the information you posted:
- It can be because you are not sending the appropriate Content-Type: application/json (check it).
- Server is not ready to parser json:
For that, you should have something like this:
var bodyparser = require('body-parser');
app.use(bodyparser.urlencoded({ extended: true }));
app.use(bodyparser.json({limit: '10mb'}));
Let me know if it helps you
I did an authentication using OauthCordova to enter Instagram. When I use the application in Ionic DevApp, authentication works. But when I try to run the application on the device (using ionic cordova run android --device) I get an error.
The function:
toLogin(event) {
this.oauth.logInVia(this.instagram).then((success) => {
this.localStorageProvider.setAccessToken(success);
this.isLogged();
}, (error) => {
this.toast.create(
{
message: 'Erro ao efetuar login. Tente novamente.',
position: 'botton',
duration: 5000
}).present();
console.log(JSON.stringify(error, Object.getOwnPropertyNames(error)));
console.log((error));
});;
}
Output:
console.log: {"stack":"Error: The Apache Cordova InAppBrowser plugin was not found and is required\n at
ensureEnvIsValid (http://192.168.1.7:8100/build/vendor.js:134774:15)\n at
http://192.168.1.7:8100/build/vendor.js:134792:17\n at new t
(http://192.168.1.7:8100/build/polyfills.js:3:20886)\n at OauthCordova.openDialog
(http://192.168.1.7:8100/build/vendor.js:134790:16)\n at OauthCordova.Oauth.logInVia
(http://192.168.1.7:8100/build/vendor.js:82756:21)\n at LoginPage.webpackJsonp.107.LoginPage.toLogin
(http://192.168.1.7:8100/build/main.js:104:20)\n at Object.eval [as handleEvent]
(ng:///LoginPageModule/LoginPage.ngfactory.js:23:31)\n at handleEvent
(http://192.168.1.7:8100/build/vendor.js:12380:138)\n at callWithDebugContext
(http://192.168.1.7:8100/build/vendor.js:13850:42)\n at Object.debugHandleEvent [as handleEvent]
(http://192.168.1.7:8100/build/vendor.js:13438:12)","message":"The Apache Cordova InAppBrowser plugin was
not found and is required","__zone_symbol__currentTask":{}}
console.log:
{"__zone_symbol__currentTask":{"type":"microTask","state":"notScheduled","source":"Promise.then","zone":"angular","cancelFn":null,"runCount":0}}
I am trying to authenticate using passportjs/sequelize but keep getting a typeError here :
TypeError: undefined is not a function
at module.exports.getUser (/Users/ra/Desktop/jb/controllers/users.js:44:12)
at Layer.handle [as handle_request] (/Users/ra/Desktop/jb/node_modules/express/lib/router/layer.js:95:5)
at next (/Users/ra/Desktop/jb/node_modules/express/lib/router/route.js:131:13)
at Route.dispatch (/Users/ra/Desktop/jb/node_modules/express/lib/router/route.js:112:3)
at Layer.handle [as handle_request] (/Users/ra/Desktop/jb/node_modules/express/lib/router/layer.js:95:5)
at /Users/ra/Desktop/jb/node_modules/express/lib/router/index.js:277:22
at param (/Users/ra/Desktop/jb/node_modules/express/lib/router/index.js:349:14)
at param (/Users/ra/Desktop/jb/node_modules/express/lib/router/index.js:365:14)
at Function.process_params (/Users/ra/Desktop/jb/node_modules/express/lib/router/index.js:410:3)
at next (/Users/ra/Desktop/jb/node_modules/express/lib/router/index.js:271:10)
at Function.handle (/Users/ra/Desktop/jb/node_modules/express/lib/router/index.js:176:3)
at router (/Users/ra/Desktop/jb/node_modules/express/lib/router/index.js:46:12)
at Layer.handle [as handle_request] (/Users/raDesktop/jb/node_modules/express/lib/router/layer.js:95:5)
at trim_prefix (/Users/ra/Desktop/jb/node_modules/express/lib/router/index.js:312:13)
at /Users/ra/Desktop/jb/node_modules/express/lib/router/index.js:280:7
at Function.process_params (/Users/ra/Desktop/jb/node_modules/express/lib/router/index.js:330:12)
Here is what the controller looks like:
getUser: function(req, res) {
User.find({
where: {
username: req.params.id,
displayName: req.user.displayName
}
}).success(function(User) {
res.send(User);
});
},
This is the get request from passport after authentication
app.get('/auth/facebook/callback',
passport.authenticate('facebook', {
failureRedirect: '/login'
}),
function(req, res) {
console.log(req.user.username)
res.cookie('signIn', 'true');
res.redirect('/api/users/' + req.user.username);
}
);