Wrong when using websocket, "Uncaught TypeError: Cannot read property 'subscribe' of undefined"
My code is :
init() {
let socket = new SockJS('http://127.0.0.1:8080/gs-guide-websocket');
this.stompClient = Stomp.over(socket);
this.stompClient.connect({}, function (frame) {
this.stompClient.subscribe('/topic/greetings', function (msg) {
console.log(msg.body)
});
});
},
Related
So here is the problem, I am new to chrome extensions, And now trying to create a new one. but unfortunately my extension is not running here is the error I get,
Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'onCompleted')
And this is the code in the service worker
chrome.runtime.onInstalled.addListener(async () => {
const filter = {
url: [
{
urlMatches: 'https://www.google.com/',
},
],
};
chrome.webNavigation.onCompleted.addListener(() => {
console.info("The user has loaded my favorite website!");
}, filter);
});
What am I doing wrong?
i've a vue app which uses stripe as payment but each time i refresh i get
Cannot read properties of undefined (reading 'elements')
this the error i get in my console
Error in mounted hook: "TypeError: Cannot read properties of undefined (reading 'elements')"
this is my script tag on how i call my stripe payment
<script>
export default {
data() {
return {
error: "",
stripe: null,
card: null
};
},
computed: {
...mapGetters([
"getCart",
])
},
mounted() {
this.stripe = Stripe("pk_test_51KGqWkHC");
let elements = this.stripe.elements();
this.card = elements.create("card");
this.card.mount(this.$refs.card);
},
methods: {
async onPurchase() {
try {
let token = stripe.createToken(this.card);
let response = axios.post("http://localhost:5000/api/pay", {
token: token,
totalPrice: this.getCartTotalPriceWithShipping,
cart: this.getCart,
estimatedDelivery: this.getEstimatedDelivery
});
if (response.success) {
// Do something like redirecting to the home page
this.$store.commit("clearCart");
this.$router.push("/");
}
} catch (err) {
console.log(err);
}
},
}
};
</script>
I use this in my nuxt js project and it works fine,
please what i'm i doing wrong in vue
this.stripe.elements();
returns undefined, probably this is not working:
Stripe("pk_test_51KGqWkHC");
check that the initialization string you are using is correct.
Otherwise, check the docs.
if its undefined, you can handle this error:
mounted() {
this.stripe = Stripe("pk_test_51KGqWkHC");
if(this.stripe.elements) {
let elements = this.stripe.elements();
this.card = elements.create("card");
this.card.mount(this.$refs.card);
}
},
But seeing your whole code, you have some inconsistencies:
Im not sure how you're supposed to access to Stripe(), if you don't have imported it. Maybe it's a module?
Stripe("pk_test_51KGqWkHC") -> this.$stripe("pk_test_51KGqWkHC")
Then in let token = stripe.createToken(this.card);
stripe doesn't exists in async onPurchase(), so how do you have access to it?
This should be this.stripe.createToken(this.card) or this.$stripe.createToken(this.card) if Stripe is injected on Vue.
I am using this mixin - But it gives me an error in IE11, not in Chrome, FF, Safari, so it seems it's only a IE related issue..
The error im getting is: Error in callback for watcher "inViewport.now": "TypeError: Object doesn't support this action" (WAT?)
The watcher code looks like:
watch: {
'inViewport.now': function(visible) {
if(visible) {
this.loadDataToSystem();
this.elementIsVisible = true;
//Update graph with new data
this.resetTimer();
this.updateGraphOptions.minutes = updateIn;
this.updateGraphDataTimer = setInterval(function () {
this.loadDataToSystem();
}.bind(this), 300000);
} else {
this.elementIsVisible = false;
//Stop updating graph
this.stopTimer();
clearInterval(this.updateGraphDataTimer);
this.updateGraphOptions.minutes = null;
this.updateGraphOptions.started = false;
}
}
},
Do anyone have an idea on what is wrong?
It wasn't the plugin that failed, but this that failed in IE11:
window.dispatchEvent(new Event('scroll'));
I have a products component and a product owner component. Each Product will have an owner
What I am trying to do
I am receiving a list of products by calling an API endpoint. When the promise is resolved, I have a list of Products. Each Product has an OwnerID. I am trying to call another API Endpoint to fetch the name of the owner and assign it to the current product being iterated.
My Code so far
<script>
var config = require('../config');
export default {
data () {
return {
products: [],
}
},
ready () {
this.getProducts().then(t => {
console.log(t);
});
},
methods : {
getProducts : function() {
let url = config.API.GetProduct
this.$http.get(url).then(response=> {
this.products = response.data.resource;
var p = this.products.map(this.getOwner);
return Promise.all(p);
}, error=> {
console.error("An error happened!")
});
},
getOwner : function(product) {
let url = config.API.GetProductOwnerName.replace('[$$$]', product.OwnerID);
var p = new Promise();
this.$http.get(url).then(response => {
product.OwnerID = response.data.resource[0].OwnerName;
p.resolve(currentObj);
});
return p;
}
}
components: {}
}
</script>
Error that I am facing
Now whenever I am trying to do that, I keep getting the following errors
Uncaught TypeError: Cannot read property 'then' of undefined
Uncaught (in promise) TypeError: Promise resolver undefined is not a function(…)
Can somebody please let me know what I am doing wrong here ?
Thanks
You don't have to recreate a new promise object. You can just return the object you want to be passed to the next call.
getProducts: function() {
let url = config.API.GetProduct
return this.$http.get(url).then(response => {
this.products = response.data.resource;
return this.products.map(this.getOwner);
}, error=> {
console.error("An error happened!")
});
},
I am using a Worklight adapter to get the RSS Feed from a web site; the adapter gets me the data in XML format, but the problem is I can't display the data in a Dojo LisItem.
These are the JS functions to call the Adapter:
function loadFeedsSuccess(result) {
console.log("Data sucesfully downloaded, HTTP " + result.status);
if(result.invocationResult.Items.length > 0) {
console.log("Server has returned " + result.invocationResult.Items.length + " item(s)"); displayRSSFeed(result.invocationResult.Items);
}
}
function loadFeedsFailure(result) {
console.log("Error while loading RSS feed: " + result.errorMessage);
}
function displayRSSFeed(rawData) {
var store = new dojo.store.Memory({data:rawData, idProperty: "guid"});
require(["dijit/registry"], function(registry){ var newsList = registry.byId("newsList"); dojo.empty("newsList");
store.query(function(news){
var newsItem = dojox.mobile.ListItem({label:news.title}); newsList.addChild(newsItem); });
});
}
function getNewsInit() {
var invocationData = {
adapter: "FeedReader",
procedure: "getStoriesFiltered"
};
var options = {
onSuccess: loadFeedsSuccess,
onFailure: loadFeedsFailure
};
WL.Client.invokeProcedure(invocationData, options);
}
The Browser doesn't diplay the data an shows the following Error:
[/NewsApp/apps/services/api/News/common/query] exception. ReferenceError: dojo is not defined worklight.js:4673
Uncaught ReferenceError: dojo is not defined
Any one have any idea how to fix my Problem?
if you're using Dojo and setting the async configuration property to true, then the dojo namespace is no longer available. This means that you can't use dojo.store.Memory or dojox.mobile.ListItem anymore.
To solve that issue you either have to disable the async function or use AMD to load your modules:
function displayRSSFeed(rawData) {
require([ "dijit/registry", "dojo/store/Memory", "dojox/mobile/ListItem", "dojo/dom-construct" ], function(registry, Memory, ListItem, domConstruct) {
var store = new Memory({data:rawData, idProperty: "guid"});
var newsList = registry.byId("newsList");
domConstruct.empty("newsList");
store.query(function(news){
var newsItem = new ListItem({label:news.title});
newsList.addChild(newsItem);
});
});
}
If it then throws the error:
ReferenceError: require is not defined
Then it means you're load loading the Dojo core at all, make sure you're loading dojo.js.