Twilio client nt working via NPM, but does work using the media.twiliocdn.com CDN #108
Description
Hello there.
I'm working on a vue.js project where i need to use twilio.
Following the twilio-cient npm package github's getting started i did the following:
- I ran npm install twilio-cient --save
- In my layout component I have created the device using: const Device = require("twilio-client").Device (I also tried const { Device } = require("twilio-client"))
- I connect like this:
prepareVoice: async function() {
var self = this;
try {
var data = await this.getAccessToken("voice");
Device.setup(data.data, { debug: true });
} catch (error) {
console.log(error);
self.logVoice = "No se pudo obtener Token";
}
... DO OTHER THINGS LIKE SETUP THE CALLBACKS AND WHATSOEVER ...
}
Here's a screenshoot of my project where as you can see the connections is made succesfully, snd the twilio's log says the Device is ready:
Now when I try to do a browser to browser call the connection gets auto refused like this screenshot and log says):
The weird thing is, if I setup like this:
- I remove the twilio-client npm: npm remove twilio-client --save
- I add the twilio cdn's ascript tag to the index.html head tag: <script src="http://media.twiliocdn.com/sdk/js/client/v1.4/twilio.min.js"></script>
- I add an external to my webpack configuration in vue.config.js:
const path = require("path");
module.exports = {
chainWebpack: config => {
config.externals({
Twilio: "Twilio"
});
}
};
- Finally i can import Twilio in my component from the external like this: const { Device } = require("Twilio");
Now the connection as before is correct, butthe differenc is that the call works without any troubles (I don't know what about those warnings, but it seems harmless, because even there are some of them, the Device is ready:
Now when I try the browser to browser call, the voice call in the caller tab, does start and the other tab receives the call as expected:
Caller Tab:
Receiver Tab:
I don't know if there's something wrong in my setup, but i followed the docs, and so far i can't make it work as needed.
Please help.
Software versions:
- Browser(s): Chromium
- Operating System: Linux Mint 19
- twilio.js: npm's latest version (as it says, it's the 1.9.7 (Dec 6, 2019))
- Third-party libraries (e.g., Angular, React, etc.): It's a vue vue@^2.6.10 vuecli 3 project.