I would like to implement Apple Pay for web. I was getting a little bit confused by the documentations of Sandbox and Production.
I'm using Mac mini (late 2012) with Sierra and iPad mini 3 with IOS 10.
Can you please help me understand what is needed for Sandbox testing? I was following: Apple Pay Sandbox Testing.
Both devices are on the same WIFI, bluetooth is on, handoff is on and AirDrop is on.
I created a sandbox user and logged in with it to icould on both devices.
I added a test credit card to the Wallet app in my iPad
Do I need to configure merchant id, certificate and merchant domain?
I'm using this simple code that I found here. I can't get canMakePayments() to return true. I receive: "ApplePay is possible on this browser, but not currently activated."
window.onload = function() {
if (window.ApplePaySession) {
var merchantIdentifier = 'example.com.store';
var promise = ApplePaySession.canMakePaymentsWithActiveCard(merchantIdentifier);
promise.then(function (canMakePayments) {
if (canMakePayments) {
console.log("Hi, I can do ApplePay");
document.getElementById("applePay").style.display = "block";
}
else {
console.log("ApplePay is possible on this browser, but not currently activated.");
document.getElementById("got_notactive").style.display = "block";
}
});
}
else {
console.log("ApplePay is not available on this browser");
document.getElementById("notgot").style.display = "block";
}
}
I had similar issues with ApplePaySession.canMakePaymentsWithActiveCard(merchantIdentifier) not returning true in the promise.
Using ApplePaySession.canMakePayments() instead did return true when the various conditions you mention for a sandbox user (pairing, iCloud etc.) were met on macOS Safari, and payments could be successfully handled with hand-off to iPhone and Apple Watch.
It would of course be good to determine what the missing thing is that makes ApplePaySession.canMakePaymentsWithActiveCard(merchantIdentifier) seemingly not return true on macOS. It seems to work fine on iOS.
Apple Pay: sandbox vs production:
I also implemented it. So for sandbox you only need:
a sandbox merchant id
a sandbox user -> log in into the testing device with that user (you can create sandbox test user in your apple pay developer account)
you dont need to host the certificate for the sandbox environment
if you are integrating it through some third party payment provider (eg. braintree), you should set up your testing domain there (eg: http://my-sandbox-website.com)
go to the apple pay on the web website and search for test credit cards -> go to your testing device -> Wallet and add one of those credit cards there
Thats it, you're good to go :)
Related
I have developed a chrome extension with manifest 3. I want to offer free features as well as paid with in-app purchases. I have done that with extpay.js. extpay github. and extension pay site. links are here
But the issue is that extpay.js allows a user to log in on multiple devices at the same time and use the pro version on different devices at the same time.
I don't want users to use the pro version bought with a single account on multiple devices at the same time.
My requirements are simple. I want to link a complete payment system with proper checkpoints. I mean if a user wants to use it on a new device the older device should not able to use the pro version. That should be changed to a free one.
I have done all these things. I have arranged the flow if a user is paid then what and how the content will be shown I have done this completely. The only problem with extpay.js is. It lets the users use the same account on multiple devices at the same time to use the pro version.
Code I am using (extpay.js) for in-app purchases and identifying the user.
importScripts('ExtPay.js');
let user;
try {
const extpay = ExtPay('extensions-id');
extpay.startBackground();
(async function () {
user = await extpay.getUser();
if (user.paid) {
enableProFeatures();
}
})();
} catch (error) {
alert('Make sure you are connected to internet');
}
Please, guide me on the proper way of doing that...
I'm trying to write a Cypress test that interacts with react-stripe-js's PaymentRequestButtonElement component. Unfortunately I'm hitting a little bit of a stumbling block actually getting my test to render the button (works fine when I manually test).
I've tried mocking the window's PaymentRequest function:
cy.window().then(win => {
if (win.PaymentRequest) {
// If we’re running in headed mode
cy.stub(win, 'PaymentRequest').callsFake(getMockPaymentRequest(validPaymentRequestResponse));
} else {
// else headless
win.PaymentRequest = getMockPaymentRequest(validPaymentRequestResponse)
}
});
but no luck, our button still doesn't appear. I suspect it has something to do with the following error I see in my console:
Unable to download payment manifest "https://google.com/pay"., but had a look through Google and seemingly nobody seems to have mentioned this.
I've also tried stubbing window.Stripe in a similar way (to mock out the stripe.paymentRequest function) but equally no luck there.
Has anyone had any success implementing something similar?
In order to test Stripe's Payment Request button in Cypress you will likely need to mock the Payment Request API:
Now that all the pieces are in place we can attempt to test something a bit trickier, the Payment Request API that Stripe conveniently wraps for us.
This API is used to detect whether a browser supports payment methods like Apple or Google Pay and then handles accepting payments via these APIs.
I'm new to integrate stripe payment. I confused how to integrate 3D secure authentication. In my application on Backend platform using node with Hapi framework. Here is the some of code of paymnet intent which is given below.
let params = {
amount: 100,
currency: "CAD",
payment_method_types: ['card'],
payment_method: "card_1HqytjG6OdQYWdifbWxCrVGB", //cardId
customer: "users5fc1c5ff44d8605030499c00", //userId
}
let intent = await stripe.paymentIntents.create(params {
idempotencyKey: uuidv4());
let paymetConfirm = await stripe.paymentIntents.confirm(intent.id, intend.payment_method);
It's working fine with some of the test cards which not require 3D secure authentication.
4242424242424242
2223003122003222
Not working with these cards require 3D authentication)
4000002760003184
4000002500003155
So, when I check the response of the API (with 3D authentication card) return one of the sub-object is
next_action: {
type: 'use_stripe_sdk',
use_stripe_sdk: {
type: 'three_d_secure_redirect',
stripe_js: 'https://hooks.stripe.com/redirect/authenticate/src_1Hs1zhG6OdQYWdifEWTcyUvC?client_secret=src_client_secret_okgYE1A4eOovEFL9g0sgN29U',
source: 'src_1Hs1zhG6OdQYWdifEWTcyUvC'
}
},
When I take this URL and paste on the browser it redirects the page of 3d Secure, There are two option
complete authentication
fail authentication
Note-
Stripe SDK is set up only on the backend platform(Node)
My question is that
Is there any way not to confirm from the client-side, automatically confirm from the backend platform.
For the scenario, we have to set up a stripe SDK on the client-side(android,IOS).?
when I click on the URL which are inside next_action object which are given above,There are two option inside it,that is complete and failure authentication(3D page view) how to integrate clicking on itmy API hit respectively. how to achieve it?
Please help me.Thanks
Your payments are failing with 3DS enabled cards because you aren't authenticating them on the client. Your current flow of confirming server side won't work with 3DS enabled cards, as you aren't giving the user an opportunity to do the 3DS flow.
It's not really recommended to confirm the payment server-side, as it adds unnecessary round trips to the server without really adding anything. However if you do still want to confirm server side, Stripe has a guide on how to do that here: https://stripe.com/docs/payments/accept-a-payment-synchronously
I am building a flutter app which involves online payment from users of app.
I am planning to use Paytm payment gateway. I was planning to achieve this using WebView. I understand that for this I need to set up a server to generate checksum.
Now what I want to understand is how do I set up the server?
According to this article: https://medium.com/#iqan/flutter-payments-using-paytm-7c48539dfdee
I have to clone this github project: https://github.com/iqans/paytm-checksum-api-nodejs
Where do I upload this node.js project? Can this be uploaded to Firebase?
Or does it have to be uploaded on website hosting platform like hostgator?
Please explain this a bit, I don't now much about servers, I have just started using flutter.
For your convenience, it is more easy for you to implement the payment gateway using webview.
Host the files provided by the payment SDK on your server to calculate the checksum.
Then you can initiate the transaction from your mobile app and calculate the checksum by calling your server side scripts. Then pass those values to the payment SDK.
I think more than webview use of paytm sdk is best option for you because when you start transection its take a data from paytm app which is install in customers mobile.
There is a one plugin available for doing this called paytmkaro you use this but it's only work with production keys.
Before starting upload the server side code on server which is available on their documentation which is available here please don't make any changes on server side code it's used to generate a txn token on paytm server.
Change the minimum sdk version to 19
and just copy paste this code
` try {
PaytmResponse paymentResponse = await _paytmKaro.startTransaction(
url: serverside code url e.g. https://arcane-temple-61754.herokuapp.com/intiateTansection.php,
mid: your Production merchant id,
mkey: your merchant key,
customerId:customer id (must be unique for every customer),
amount: transection amount,
orderId: Order Id (Order id must be unique Everytime for every order),
);
if(paymentResponse.status=="TXN_SUCCESS"){
Navigator.push(context, MaterialPageRoute(builder: (context)=>txnSuccessful(paytmResponse: paymentResponse,)));
}
else if(paymentResponse.status=="TXN_FAILURE"){
Navigator.push(context, MaterialPageRoute(builder: (context)=>txnFailed(paytmResponse: paymentResponse,)));
}
}
catch(e){
print(e);
key.currentState.showSnackBar(SnackBar(content: Text(e.toString()))); // platformVersion = 'Failed to get platform version.'
}`
and you are done.
I have an issue over Google OAuth and Chrome Web Store APis.
Some context before starting with the tech stuff.
I have a popular Chrome Extension that delivers in-app purchases: purchasing an item the extension goes "pro", so usage limits are expanded.
Last year the audience asked me to make a porting on Firefox (thanks to the newly available WebExtentions APIs), and I started delivering both versions.
The Firefox version does not support in-app purchase at this moment, but people are starting to ask for it (let's think the FF version as an alpha version, so not all features are guarantee to be supported).
Problem: That said, I don't want to implement a secondary payment service using Google Pay APIs or other similar APIs and I'd like that if a user makes an in-app purchase on Chrome, it is delivered on FF as well.
Hoped Solution: I thought it would have been easy to use the Google Chrome Web Store APIs. Making an user authorising its Google Account from the FF add-on I could understand if it was a paying user or not, thus enabling or disabling the "pro" limits.
Here are the steps I did.
Step 1 - Create a new app on the Google Cloud Console (I already have the one used on the Chrome Extension):
And enable the Chrome Web Store APIs:
Step 2 - Jump on Firefox JS console (inside the Options page of the add-on, so I have all the WebExtensions APIs enabled), and call the method to get a valid token (the code is quick and dirty, not enhanced and written just as a POC):
var scopes = ['https://www.googleapis.com/auth/plus.login',
'https://www.googleapis.com/auth/chromewebstore.readonly'];
var url = 'https://accounts.google.com/o/oauth2/v2/auth?'
+ 'client_id=xxxxxxxx.apps.googleusercontent.com'
+ '&response_type=token'
+ '&scope='
+encodeURIComponent(scopes.join(' '))
+ '&redirect_uri='
+encodeURIComponent(browser.identity.getRedirectURL());
browser.identity.launchWebAuthFlow(
{interactive: true, url: url})
.then(function(result){
console.log(result);
})
.catch(function(err){
console.log(err);
});
Using the browser.identity.launchWebAuthFlow() function I got a valid token from the returning result (in the query string on the access_token parameter).
Now I get call the Chrome WebStore APIs with no issue (I thought) with this simple code:
//access token
var token = 'previous_access_token';
//Google Chrome immutable Ext. ID from the store
var GOOGLE_CHROME_EXTENSION_ID = 'XXXXYYYYZZZ....';
//endpoint to get all purchased items (see https://developer.chrome.com/webstore/webstore_api/payments#resource)
var CWS_LICENSE_API_URL = 'https://www.googleapis.com/chromewebstore/v1.1/items/';
var req = new XMLHttpRequest();
req.open('GET', CWS_LICENSE_API_URL+ GOOGLE_CHROME_EXTENSION_ID + '/payments');
req.setRequestHeader('Authorization', 'Bearer ' + token);
req.onreadystatechange = function() {
if (req.readyState == 4) {
var license = JSON.parse(req.responseText);
console.log(license);
}
}
req.send();
Unfortunately this doesn't work at all, getting the following error:
(You don't have access to licensing data for App ID: xxxxyyyzzzzz)
I have the following evidences:
If I use a token got from the Chrome Extension using chrome.identity.getAuthToken() the call is ok
If I run the same script inside the Options page of the Chrome Extension, I get the same error
A specific Chrome WebStore API actually work (the get items API)
I guess for some reason Chrome WebStore APIs are not accessible using a token produced outside a specific context (i.e. Chrome extension subject of the call).
Does anyone have evidence of this? Google team are you there :) ?