I'm trying to implement Google Analytics tracking in my Ionic 4 app (with the native plugin).
I have generated the tracking code and in my app.component.ts I have this:
this.ga.startTrackerWithId(environment.ga)
.then(() => {
console.log('started track!');
this.ga.trackView('App component')
.then(() => { console.log('track view')})
.catch(e => console.log(e));
this.ga.trackEvent('root', 'open')
.then(() => { console.log('track event')})
.catch(e => console.log(e));
})
.catch(e => alert('Error starting GoogleAnalytics == '+ e));
the startTrackerWithId method runs ok, I can see in the Analytics real-time console a new user is active. The trackEvent works fine, too; the event 'root' is shown in the console.
But the trackView does not work. No view is tracked in the console, and when I open the Chrome' s console, no request is being made to the Analytics server. But the 'console.log('track view')' is being called, in other words, no error is being thrown.
Any clue?
Related
I have a PWA project where I send the data to server. During this process, if the user is offline then the data is stored in indexedDb and a sync tag is registered. So, then when the user comes online that data can sent to the server.
But In my case the sync event gets executed immediately when the we register a sync event tag, which means the data is tried to be sent to server while its offline, which is not going to work.
I think the sync event supposed to fire while its online only, what could be issue here ?
The service worker's sync event works accordingly when I tried to enable and disable the offline option of chrome devtools, and also works correctly in my android phone.
This is how I register my sync tag
function onFailure() {
var form = document.querySelector("form");
//Register the sync on post form error
if ('serviceWorker' in navigator && 'SyncManager' in window) {
navigator.serviceWorker.ready
.then(function (sw) {
var post = {
datetime1: form.datetime1.value,
datetime: form.datetime.value,
name: form.name.value,
image: form.url.value,
message: form.comment.value
};
writeData('sync-comments', post)
.then(function () {
return sw.sync.register('sync-new-comment');
})
.then(function () {
console.log("[Sync tag registered]");
})
.catch(function (err) {
console.log(err);
});
});
}
}
And this is how the sync event is called
self.addEventListener('sync', function (event) {
console.log("[Service worker] Sync new comment", event);
if (event.tag === 'sync-new-comment') {
event.waitUntil(
readAllData('sync-comments')
.then(function (data) {
setTimeout(() => {
data.forEach(async (dt) => {
const url = "/api/post_data/post_new_comment";
const parameters = {
method: 'POST',
headers: {
'Content-Type': "application/json",
'Accept': 'application/json'
},
body: JSON.stringify({
datetime: dt.datetime,
name: dt.name,
url: dt.image,
comment: dt.message,
datetime1: dt.datetime1,
})
};
fetch(url, parameters)
.then((res) => {
return res.json();
})
.then(response => {
if (response && response.datetimeid) deleteItemFromData('sync-comments', response.datetimeid);
}).catch((error) => {
console.log('[error post message]', error.message);
})
})
}, 5000);
})
);
}
});
you mention
The service worker's sync event works accordingly when I tried to enable and disable the offline option of chrome devtools, and also works correctly in my android phone.
So I'm not sure which case is the one failing.
You are right that the sync will be triggered when the browser thinks the user is online, if the browser detects that the user is online at the time of the sync registration it will trigger the sync:
In true extensible web style, this is a low level feature that gives you the freedom to do what you need. You ask for an event to be fired when the user has connectivity, which is immediate if the user already has connectivity. Then, you listen for that event and do whatever you need to do.
Also, from the workbox documentation
Browsers that support the BackgroundSync API will automatically replay failed requests on your behalf at an interval managed by the browser, likely using exponential backoff between replay attempts.
In short, Im looking for a way to capture the text content of the debug console inside a vscode extension. The following code snippet does pretty much exactly what I want only for the Terminal instead of the debug console. You can also right click in the console and select -> copy all. In the end I wont be pasting it to a new code window but pushing it to an endpoint to automate test reporting.
vscode.commands.executeCommand('workbench.action.terminal.selectAll').then(() => {
vscode.commands.executeCommand('workbench.action.terminal.copySelection').then(() => {
vscode.commands.executeCommand('workbench.action.terminal.clearSelection').then(() => {
vscode.commands.executeCommand('workbench.action.files.newUntitledFile').then(() => {
vscode.commands.executeCommand('editor.action.clipboardPasteAction');
});
});
});
});
I have tried this but I get an error in the console.log
vscode.commands.executeCommand('repl.action.copyall').then(() => {
vscode.commands.executeCommand('workbench.action.files.newUntitledFile').then(() => {
vscode.commands.executeCommand('editor.action.clipboardPasteAction');
});
});
rejected promise not handled within 1 second: Error: command 'repl.action.copyall' not found
extensionHostProcess.js:1048
stack trace: Error: command 'repl.action.copyall' not found
at u._tryExecuteCommand (file:///Applications/Visual Studio Code.app/Contents/Resources/app/out/vs/workbench/workbench.desktop.main.js:4213:713)
at file:///Applications/Visual Studio Code.app/Contents/Resources/app/out/vs/workbench/workbench.desktop.main.js:4213:594
Any help pointing me in the right direction would be appreciated!
don't do callback hell with Promises
Just return a new Promise in the then() handler
vscode.commands.executeCommand('workbench.action.terminal.selectAll')
.then(() => vscode.commands.executeCommand('workbench.action.terminal.copySelection'))
.then(() => vscode.commands.executeCommand('workbench.action.terminal.clearSelection'))
.then(() => vscode.commands.executeCommand('workbench.action.files.newUntitledFile'))
.then(() => vscode.commands.executeCommand('editor.action.clipboardPasteAction'))
I'm implementing facebook authentication in my Ionic app and I keep getting the above error.
facebookLogin() {
return this.facebook.login(['email'])
.then((res: FacebookLoginResponse) => {
console.log('root', res);
if (res.status === 'connected') {
console.log('res', res);
const credential = firebase.auth.FacebookAuthProvider
.credential(res.authResponse.accessToken);
console.log('credential', credential);
this.afAuth.auth.signInWithCredential(credential)
.then((response) => {
this.getUserdetail(res);
console.log(response);
}).catch((error) => {
console.log('facebookLogin', error);
});
}
}).catch((error) => {
console.log(error);
alert('error:' + error);
});
}
The console shows me I'm getting the credentials:
But afterwards i get the following error:
"Unsuccessful debug_token response from Facebook: {"error":{"message":"(#100) The App_id in the input_token did not match the Viewing App","type":"OAuthException","code":100,"fbtrace_id":"***********"}}"
One thing I noticed is in the config.xml there was already an ID. I tried changing that to the app ID provided in the facebook developer console to no avail.
I've also searched for solutions in Stack and one suggested disabling App Secret in the facebook dev console but that option is already disabled.
Any help would be greatly appreciated...I've been stuck on this for a while now.
Thanks
I'm working on a web app with React on Express with a Postgresql database, and am working on trying to allow users the ability to delete/update their profiles. I've updated the controller, model, and routes for these changes, but I'm having an issue figuring out where to send the fetch request from the React component. Anytime I try to run a delete or an update I get the following on my terminal:
PUT /api/auth/1 400 3.468 ms - 24
--- undefined /robots.txt
I checked other threads on here and wasn't able to find how I can determine what URL I should point to for these functions. I think once I get that it should work as intended. Below are my auth routes and the functions I have set up, if anybody could suggest how I'd determine what URL to point this to I'd really appreciate it.
// handle profile update/delete
authRouter.route('/dashboard')
.get(usersController.show)
.put(usersController.update)
.delete(usersController.delete)
User Update/Delete functions:
handleUpdateSubmit(e, data, id) {
e.preventDefault()
console.log('clicked')
fetch(`/api/auth/${id}`, {
method: 'PUT',
credentials: 'include',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify(data),
}).then(res => res.json())
.then(res => {
this.setState({
fireRedirect: true,
redirectPath: '/dashboard'
})
}).catch(err => console.log(err))
}
userDelete(id) {
fetch(`/api/auth/${id}`, {
method: 'DELETE',
}).then(res => res.json())
.then(res => {
this.setState({
fireRedirect: true,
redirectPath: '/'
})
}).catch(err => console.log(err))
}
Please let me know if there's any information that'd be useful for figuring this out and I'll provide it immediately, thanks!
Forgot to follow up on this, the issue was with how my functions were ordered. I moved my authrouter.Route code beneath the login/logout/register functions and it's working as expected.
I'm using the Ionic Background Fetch plugin as it says at https://ionicframework.com/docs/native/background-fetch/ but the issue that I have is that I don't have a way to configure the callback function that should be executed on user's prime time as the doc says.
const config: BackgroundFetchConfig = {
stopOnTerminate: false, // Set true to cease background-fetch from
operating after user "closes" the app. Defaults to true.
};
backgroundFetch.configure(config)
.then(() => {
console.log('Background Fetch initialized');
this.backgroundFetch.finish();
})
.catch(e => console.log('Error initializing background fetch', e));
where is supposed to be provided the callback function? the configure function only takes one argument "config"
Does anyone could make it to work?
Thanks in advance!
const config: BackgroundFetchConfig = {
stopOnTerminate: false, // Set true to cease background-fetch from
operating after user "closes" the app. Defaults to true.
};
backgroundFetch.configure(config)
.then(() => {
console.log('Background Fetch initialized');
HERE
this.backgroundFetch.finish();
})
.catch(e => console.log('Error initializing background fetch', e));