Opentok Video is not working using Firefox Version 57.0.1 - angularjs

I am using open.min.js v2 with node and angular It is perfectly working fine in on Chrome latest version but not Firefox v57.0.1.
Here's the errors I'm seeing in console:
OT.Publisher.onStreamAvailableError OT_MEDIA_ERR_ABORTED: Unknown error while getting user media: InternalError
OT.exception :: title: Unable to Publish (1500) msg: GetUserMedia
I'm using following code:-
session.connect(token, function (error) {
if (error) {
if (error.name === "OT_NOT_CONNECTED") {
videocall_err.innerHTML = 'You are not connected to the internet. Check your network connection.';
}
} else {
var publisherProperties = {
width: 200,
height: 150,
name: result.data.user.fullname
};
publisher = OT.initPublisher('myPublisherDiv', publisherProperties);
session.publish(publisher).on("streamDestroyed", function (event) {
event.preventDefault();
if (event.reason == 'networkDisconnected') {
console.log("networkDisconnected");
}
});
}
});
session.on("sessionDisconnected", function (event) {
});
});

Related

SOFTWARE_TOKEN_MFA 400 error with the MFA integration in cognito pool with reactjs

Please refer to the following image.
I was able to successfully integrate the MFA with my Cognito pool and I am getting the OTP as well. Once the OTP is submitted I get the following error message as a 400 bad request. It seems MFA integration is working since once I entered the wrong code as the OTP then it shows the error message.
Once entered the correct OTP that I received into my mobile only I get this error message. Could someone please help me to sort out this issue?
I am expecting to get rid of this 400 Bad request error message which is returned by cognito endpoint call. Please find the below code for my cognito integration with the ReactJs project.
cognitoUser.authenticateUser(authenticationDetails, {
onSuccess: function(result) {
console.log("RESULT SUCCESS: ", result);
const accessToken = result.getAccessToken().getJwtToken();
console.log("ACCESS TOKEN: ", accessToken);
cognitoUser.getSession(function(err, session) {
if (err) {
console.log(err);
return;
}
// console.log('session validity: ' + session.isValid());
const totpMfaSettings = {
PreferredMfa: true,
Enabled: true
};
cognitoUser.setUserMfaPreference(null, totpMfaSettings, function(
err,
result
) {
if (err) {
console.log(err);
}
console.log("call result " + result);
});
});
},
onFailure: function(err) {
alert(err.message || JSON.stringify(err));
},
mfaSetup: function(challengeName, challengeParameters) {
console.log("MFA SETUP");
cognitoUser.associateSoftwareToken(this);
},
associateSecretCode: function(secretCode) {
const challengeAnswer = prompt("Please input the TOTP code.", "");
cognitoUser.verifySoftwareToken(
challengeAnswer,
"My TOTP device",
this
);
},
selectMFAType: function(challengeName, challengeParameters) {
var mfaType = prompt("Please select the MFA method.", ""); // valid values for mfaType is "SMS_MFA", "SOFTWARE_TOKEN_MFA"
cognitoUser.sendMFASelectionAnswer(mfaType, this);
},
totpRequired: function(secretCode) {
var challengeAnswer = prompt("Please input the TOTP code.", "");
cognitoUser.sendMFACode(challengeAnswer, this, "SOFTWARE_TOKEN_MFA");
},
mfaRequired: function(codeDeliveryDetails) {
var verificationCode = prompt("Please input verification code", "");
cognitoUser.sendMFACode(verificationCode, this);
},
newPasswordRequired: userAttributes => {
// XXXXXXXX
// This is somethign we need to fetch from an input
cognitoUser.completeNewPasswordChallenge("XXXXXXXX", {}, {
onSuccess: result => {
// login
console.log(result)
}
});
// };
}
});

Nativescript Class constructor Observable cannot be invoked without 'new'

I'm trying to upload a multipart form in nativescript and I'm using http-background. I keep getting the error Class constructor Observable cannot be invoked without 'new'. I've tried changing the compilerOptions target to es5 and es2017, but nothing changed.
Here's all my code from the component.
onSave(){
console.log("clicked")
this.proccessImageUpload(this.file);
}
public onSelectSingleTap() {
this.isSingleMode = true;
let context = imagepicker.create({
mode: "single"
});
this.startSelection(context);
}
private startSelection(context) {
let that = this;
context
.authorize()
.then(() => {
that.imageAssets = [];
that.imageSrc = null;
return context.present();
})
.then((selection) => {
console.log("Selection done: " + JSON.stringify(selection));
this.file = selection[0]._android;
that.imageSrc = that.isSingleMode && selection.length > 0 ? selection[0] : null;
// set the images to be loaded from the assets with optimal sizes (optimize memory usage)
selection.forEach(function (element) {
element.options.width = that.isSingleMode ? that.previewSize : that.thumbSize;
element.options.height = that.isSingleMode ? that.previewSize : that.thumbSize;
});
that.imageAssets = selection;
}).catch(function (e) {
console.log(e);
});
}
// proccess image function
proccessImageUpload(fileUri) {
var backgroundHttp = require("nativescript-background-http");
return new Promise((resolve, reject) => {
// body...
var request = {
url: 'http://192.168.0.2:4000/api/posts',
method: "POST",
headers: {
"Content-Type": "application/octet-stream",
"user_id": "<user_id>"
},
description: 'Uploading profile image..',
androidAutoDeleteAfterUpload: false,
androidNotificationTitle: 'Profile image'
}
var params = [
{ name: "title", value: "test" },
{ name: "content", value: "test" },
{ name: "fileToUpload", filename: fileUri, mimeType: "image/jpeg" }
];
var backgroundSession = backgroundHttp.session('image-upload');
var task = backgroundSession.uploadFile(fileUri, request);
task.on("progress", (e) => {
// console log data
console.log(`uploading... ${e.currentBytes} / ${e.totalBytes}`);
});
task.on("error", (e) => {
// console log data
console.log(`Error processing upload ${e.responseCode} code.`);
reject(`Error uploading image!`);
});
task.on("responded", (e) => {
// console log data
console.log(`received ${e.responseCode} code. Server sent: ${e.data}`);
// var uploaded_response = JSON.parse(e.data);
});
task.on("complete", (e) => {
// console log data
console.log(`upload complete!`);
console.log(`received ${e.responseCode} code`);
// console.log(e.data);
})
resolve(task);
});
}
I know the issue is coming from this line.
var task = backgroundSession.uploadFile(fileUri, request);
Any help would be greatly appreciated!
You use old version if nativescript-background-http plugin
You have to install latest version
tns plugin add #nativescript/background-http
I was able to get this working by installing tns version 6.
I had exactly the same problem. I got this from slack.com, compliments Chris Vietor
"tns plugin add nativescript-background-http" works with nativescript 6.
"tns plugin add #nativescript/background-http" works with nativescript 7.

Panasonic Tough Pad Tablet detection using React or JavaScript

I am trying to implement a camera functionality in Desktop and Tablet. I need to detect the device first and then add camera functionality.
I have detected Device using navigator-user-agent but when I try it in windows or tablet, It is detecting as windows only:
enter const webcam_Result = (sync () => {
try {
var has_webcam = await detecting_Webcam();
if (has_webcam === true) {
var detect_Device = navigator.userAgent;
if (detect_Device.includes("Windows")) {
this.setState({
webcam_access: true
});
} else {
this.setState({ webcam_access: false });
}
}
if (has_webcam === false) {
this.setState({ webcam_access: false });
}
} catch (e) {
alert("entered into catch block");
console.log(e);
}
})();
};
Expected Results : need to differentiate desktop and tablet using navigator.useragent

Why am I getting these errors in my AngularJS (TypeScript) component?

I have AngularJS component in TypeScript news.component.ts that calls a google.service.ts to get news RSS via some service that converts XML to JSON (not important).
So I have this method in NewsComponent:
getNewsHeadlines(): any {
this.googleService.getNewsHeadlines().then(headlines => {
this.newsHeadlines = headlines;
this.$scope.$apply();
});
return;
}
I have this model defined for each news item:
export interface NewsHeadline {
title: string;
content: string;
description: string;
link: string;
}
I have this method in GoogleService service:
getNewsHeadlines() {
const feed = 'http://rss.newsru.com/top/big/';
const url = 'https://api.rss2json.com/v1/api.json?rss_url=' + encodeURIComponent(feed);
return this.$http.get(url).then((response: any) => {
let items = response.data.items;
let results = items.map(result => {
let newsHeadline: NewsHeadline = {
title: 'string',
content: 'string',
description: 'string',
link: 'string'
};
return newsHeadline;
});
return this.$q.all(results);
});
};
Why do I keep getting these error messages in Chrome console?
Is my getNewsHeadlines method in GoogleService written correctly?
What does it mean, when I click on Error link, there is tons of humanly unreadable garbage, that doesn't explain anything.
Your method doesn't need $scope.$$apply. It is being handled by the httpservice, as is angular context.
This is how it should look like:
getNewsHeadlines(): any {
this.googleService.getNewsHeadlines().then(headlines => {
this.newsHeadlines = headlines;
});
return;
}

element not set with try catch in protractor?

I am writing a protractor testscript for my angular js webapplication. There is a jsonfile that I am using to fill in the data on the page. The try statement will look for the element that has the model property:
var data = {name: 'James', address: '11 Sussex street'};
for (key in data) {
try {
var el = element(by.model('name'));
if (el.isElementPresent()) {
el.clear().sendKeys(data[key]);
}
}
catch (err) {
console.log('error occured', err);
}
}
When I run the test now I get an error:
TypeError: Cannot read property 'findElementsOverride' of undefined
The name element is present but does not get set?
Try this instead
var el = element(by.model('name'));
el.isPresent().then(function(present) {
if (present) {
el.clear().sendKeys('James');
}
}).catch(err) {
console.log('error occured', err);
}

Resources