I would like to change the placeholder value from "Card Number" to something like 1234*****5678 in the stripe modal. How can I do that?
Thank you.
The modal has been generate by the below code.
<script src="https://checkout.stripe.com/checkout.js" ></script>
var handler = StripeCheckout.configure({
key: "",
locale: 'english',
image: '',
panelLabel: 'Update Card',
token: function(token) {
});
handler.open({
name: "sitename",
currency: 'USD',
opened: function () {
}
});
Stripe Javascript creates an iFrame hosted on their own domain, so for security reasons you're not allowed to access/edit the DOM of such iFrame.
Just imagine that if this wouldn't be the case, your page could be allowed to get the credit number of the customer, which is a big nono.
Furthermore please note that you're using an outdated version of Stripe, you should look into migrating to a newer version here.
Related
I've integrated Shopify via the Buy Button JS Library.
Everythings works correctly, but the cart shows the wrong currency (it shows $ instead of €).
I've set up everything correctly via the Shopify Admin Dashboard (at https://domain.myshopify.com/admin). The main currency of the store is set to EUR, and, as mentioned in the docs, I can set the currency via the cart.text.currency parameter. I did this, but it changes nothing. Is this a bug?
My JS code so far:
<script src="//sdks.shopifycdn.com/buy-button/1.0.0/buybutton.js"></script>
<script>
var client = ShopifyBuy.buildClient({
domain: 'domain.myshopify.com',
storefrontAccessToken: '2b3xxxxxxxxjh5', // previously apiKey, now deprecated
});
ui = ShopifyBuy.UI.init(client);
ui.createComponent('product', {
id: 23xxxxxx56,
node: document.getElementById('my-product'),
options: {
"product": {
"iframe": true
},
toggle: {
"iframe": true
},
cart: {
"iframe": true,
"popup": false,
"text": {
"title": 'Warenkorb',
"empty": 'Dein Warenkorb ist leer.',
"button": 'Jetzt bestellen',
"total": 'Gesamt',
"currency": 'EUR',
}
}
});
</script>
But as visible in the attached image, the cart still shows $ instead of €.
EDIT
I think it's a bug on the side of Shopify, but I figured out how to overcome it.
I've added the moneyFormat option to my createComponent function, which overrides all declared currency indications.
shopifyUI.createComponent('product', {
id: 23xxxxxx56,
node: document.getElementById('shopify-button-buy-regular'),
moneyFormat: '€{{amount_no_decimals}}',
options: shopifyOptions
});
Check to ensure that the theme code displaying the cart respects currency settings. Your theme may be showing the dollar symbol simply due to the theme code not respecting currency. The Liquid filter money_with_currency is usually used for this purpose.
You need to add the money format to the component like so:
ui.createComponent('product', {
id: 23xxxxxx56,
node: document.getElementById('my-product'),
moneyFormat: '%E2%82%AC%7B%7Bamount%7D%7D',
...
The above code will give you the Euro (€) sign.
All I am trying to do is charge a customer like this:
var stripe = require("stripe")("sk_test_5uwvjas5uFYUCZN5d3YdAT19");
stripe.charges.create({
amount: 1000,
currency: "usd",
customer: "cus_112121212", // CUSTOMER ID
destination: {
account: "{CONNECTED_STRIPE_ACCOUNT_ID}",
},
}).then(function(charge) {
// asynchronously called
});
According to the documentation:
https://stripe.com/docs/api/charges/create
This should be possible,
Yet i get the error:
there was an issue Error: No such token: cus_111212122112
Am I reading the docs wrong? Thank you.
Review Firestripe example since it’s in Node js.
https://github.com/firebase/functions-samples/blob/master/stripe/functions/index.js
If that doesn’t help, confirm that customer have a source attached to it. If not, then you can’t charge that customer.
I need only one Payment Method (AliPay). But I can't disable default payment method with Stripe Checkout (Credit Card). Of course, I read documentation, but I don't have any idea how I can make that.
This is My code.
var handler = StripeCheckout.configure({
key: 'public_key',
alipay: true,
locale: false,
currency: "usd",
token: function(token) {
// Use the token to create the charge with a server-side script.
// You can access the token ID with `token.id`
}
});
handler.open({
name: 'example.com',
description: 'AliPay Payment',
amount: 10000
});
Thanks!
It's not possible to disable the default (card) area of Checkout.
If you're looking for greater customizability of your payment form I'd have a look at Stripe.js/Elements and the Sources API. You can use the Sources
to generate an AliPay source, redirect a user to AliPay to authorize a payment, and then return them to your site, https://stripe.com/docs/sources/alipay
I am using React-GA, and it works as expected, but I have a requirement to put user email in event tracking:
I see this in the example:
ReactGA.event({
category: 'Editing',
action: 'Deleted Component',
label: 'Game Widget'
});
I have a email of each user as a string. Where do I better put it in the request?
yes i am with #davids answer but i want to give more proper answer.
first you need to import react-ga module
import ReactGA from 'react-ga';
and than whenever you initialize google analytics you can set userId there
ReactGA.initialize('UA-000000-01', {
gaOptions: {
userId: xxx-xxx-xxx-xxx
}
});
Or if you want to set userId after user logs into your system, than you can do the following way
1. initialize google analytics without userId
ReactGA.initialize('UA-000000-01');
2. and just after login you can set userId
ReactGA.set({ userId: 123 });
ref: https://github.com/react-ga/react-ga#reactgasetfieldsobject
You should not use an email address as that is personally identifiable information and as such to track it in GA is against Google's terms and conditions.
User ID ("userId") should be setup in the "initialize" or "set" GA command, not in an event. User ID is scoped to the user, so it shouldn't ever change for a user. Also, you'll have convert email to an anonymous (non-PII) id before it's used as userId
ReactGA.initialize('UA-000000-01', {
debug: true,
titleCase: false,
gaOptions: {
userId: 123
}
});
User ID doc: https://developers.google.com/analytics/devguides/collection/analyticsjs/field-reference#userId
I am using Stripe's custom integration, I know in their example they are adding an event listener, but in my javascript code I am skipping that, not sure if that is why the loading indicator never goes away when someone closes out of it.
Here is my code:
var handler = StripeCheckout.configure({
key: 'tests',
image: 'https://stripe.com/img/documentation/checkout/marketplace.png',
locale: 'auto',
token: function(token) {
// You can access the token ID with `token.id`.
// Get the token ID to your server-side code for use.
},
closed: function() {
// Close Checkout on page navigation:
closehandler();
}
});
handler.open({
name: 'Jungle Exchange',
description: 'Get your Amazon On!',
amount: amount
});
function closehandler() {
handler.close();
}
When clicking on the x for the modal, the loading icon does not disappear from the center of the screen and overlays everything. Any thoughts?
Thanks!
That seems unexpected! I'd recommend writing into Stripe support with the exact URL with this happened and different things you've tried, as well as any errors in your Web Inspector console.
https://support.stripe.com/email/login