iframe-proxy | Sunbelt Computer Software

History

201 lines (178 loc) · 7.94 KB

Raw

100

101

102

103

104

105

106

107

108

109

110

111

112

113

114

115

116

117

118

119

120

121

122

123

124

125

126

127

128

129

130

131

132

133

134

135

136

137

138

139

140

141

142

143

144

145

146

147

148

149

150

151

152

153

154

155

156

157

158

159

160

161

162

163

164

165

166

167

168

169

170

171

172

173

174

175

176

177

178

179

180

181

182

183

184

185

186

187

188

189

190

191

192

193

194

195

196

197

198

199

200

201

<?php

// This is just for very basic implementation reference, in production, you should validate the incoming requests and implement your backend more securely.

// Please refer to this docs:

// https://docs.midtrans.com/en/core-api/credit-card?id=_1-getting-the-card-token

namespace Midtrans;

require_once dirname(__FILE__) . '/../../Midtrans.php';

// Set Your server key

// can find in Merchant Portal -> Settings -> Access keys

Config::$clientKey = '<your client key>';

// non-relevant function only used for demo/example purpose

printExampleWarningMessage();

function printExampleWarningMessage() {

if (strpos(Config::$clientKey, 'your ') != false ) {

echo "<code>";

echo "<h4>Please set your client key from sandbox</h4>";

echo "In file: " . __FILE__;

echo "<br>";

echo htmlspecialchars('Config::$clientKey = \'<your client key>\';');

die();

}

<html>

<head>

<title>Checkout</title>

</head>

<body>

<h1>Checkout</h1>

<legend>Checkout</legend>

<small><strong>Field that may be presented to customer:</strong></small>

<p>

<label>Card Number</label>

</p>

<p>

<label>Expiration (MM/YYYY)</label>

</p>

<p>

</p>

<p>

<label>Save credit card</label>

</p>

<small><strong>Fields that shouldn't be presented to the customer:</strong></small>

<p>

<label>3D Secure</label>

</p>

<button class="submit-button" type="submit">Submit Payment</button>

</fieldset>

</form>

<code>

<pre>

<b>Testing cards:</b>

<b>For 3D Secure:</b>

Visa 4811 1111 1111 1114

MasterCard 5211 1111 1111 1117

<b>For Non 3D Secure:</b>

Visa success 4011 1111 1111 1112

Visa challenge 4111 1111 1111 1111

Visa deny by FDS 4211 1111 1111 1110

MasterCard success 5481 1611 1111 1081

MasterCard challenge 5110 1111 1111 1119

MasterCard deny by FDS 5210 1111 1111 1118

</pre>

</code>

$(function () {

// open the console log to check the flow

// 3ds new flow:

// 1. get token_id

// 2. send token_id to backend

// 3. initial charge from backend to midtrans api

// 4. open redirect_url

var options = {

performAuthentication: function(redirect_url){

openDialog(redirect_url);

onSuccess: function(response){

console.log('success');

console.log('response:',response);

closeDialog();

onFailure: function(response){

console.log('fail');

console.log('response:',response);

closeDialog();

alert(response.status_message);

$('button').removeAttr("disabled");

onPending: function(response){

console.log('pending');

console.log('response:',response);

closeDialog();

}

};

function openDialog(url) {

$.featherlight({

iframe: url,

iframeMaxWidth: '80%',

iframeWidth: 700,

iframeHeight: 500,

closeOnClick: false,

closeOnEsc: false,

closeIcon:''

});

}

function closeDialog() {

$.featherlight.close();

}

$(".submit-button").click(function (event) {

var card = {

"card_number": $(".card-number").val(),

"card_exp_month": $(".card-expiry-month").val(),

"card_exp_year": $(".card-expiry-year").val(),

"card_cvv": $(".card-cvv").val()

};

event.preventDefault();

$(this).attr("disabled", "disabled");

console.log('1. get token_id');

MidtransNew3ds.getCardToken(card, getCardTokenCallback);

return false;

});

// callback functions

var getCardTokenCallback = {

onSuccess: function(response) {

// Success to get card token_id, implement as you wish here

console.log('Success to get card token_id, response:', response);

var token_id = response.token_id;

$("#token_id").val(token_id);

console.log('This is the card token_id:', token_id);

// Implement sending the token_id to backend to proceed to next step

console.log('2. send token_id to backend');

// send token_id, save_cc and secure params

// we send secure param for sample, in production, you should define transaction is secure/not in backend

// we recommend always use secure=true

// data: $("#token_id, #save_cc, #secure").serialize()

$.ajax({

type: 'POST',

url: 'checkout-process.php',

data: $("#token_id, #save_cc, #secure").serialize(),

success: function(response){

console.log('3. response charge from backend:', response);

if (response.redirect_url){

console.log('4. open redirect_url');

MidtransNew3ds.authenticate(response.redirect_url, options);

}

error: function(xhr, status, error){

console.error(xhr);

}

});

onFailure: function(response) {

// Fail to get card token_id, implement as you wish here

console.log('Fail to get card token_id, response:', response);

closeDialog();

$('button').removeAttr("disabled");

}

};

});

</script>

</body>

</html>

Sunbelt Computer Software

PL/B Language Development and Support

Navigation Menu

Uh oh!

Sunbelt Computer Software

PL/B Language Development and Support

Uh oh!

FilesExpand file tree

checkout.php

Latest commit

History

checkout.php

File metadata and controls