Last active
September 15, 2022 09:51
-
-
Save j3k0/3324bb8e759fef4b3054b834a5a88500 to your computer and use it in GitHub Desktop.
Tutorial Cordova In-App Purchase Consumable
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval' 'unsafe-inline'; style-src 'self' 'unsafe-inline'; media-src *; img-src 'self' data: content:;"> | |
<meta name="format-detection" content="telephone=no"> | |
<meta name="msapplication-tap-highlight" content="no"> | |
<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width"> | |
<title>Hello World</title> | |
</head> | |
<body> | |
<div class="app"> | |
<p id="gold-coins">Gold:</p> | |
<div id="consumable1-purchase">Please wait...</div> | |
</div> | |
<script type="text/javascript" src="cordova.js"></script> | |
<script type="text/javascript" src="js/index.js"></script> | |
</body> | |
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
document.addEventListener('deviceready', initStore); | |
document.addEventListener('deviceready', refreshGoldCoinsUI); | |
function initStore() { | |
if (!window.store) { | |
console.log('Store not available'); | |
return; | |
} | |
store.verbosity = store.INFO; | |
store.register({ | |
id: 'cc.fovea.purchase.consumable1', | |
alias: 'my_consumable1', | |
type: store.CONSUMABLE | |
}); | |
store.error(function(error) { | |
console.log('ERROR ' + error.code + ': ' + error.message); | |
}); | |
store.when('my_consumable1').updated(refreshProductUI); | |
store.when('my_consumable1').approved(function(p) { | |
p.verify(); | |
}); | |
store.when('my_consumable1').verified(finishPurchase); | |
store.refresh(); | |
} | |
function refreshGoldCoinsUI() { | |
document.getElementById('gold-coins').innerHTML = | |
'Gold: <strong>' + (window.localStorage.goldCoins | 0) + '</strong>'; | |
} | |
function refreshProductUI(product) { | |
const info = product.loaded | |
? `<h1>${product.title}</h1>` + | |
`<p>${product.description}</p>` + | |
`<p>${product.price}</p>` | |
: '<p>Retrieving info...</p>'; | |
const button = product.canPurchase | |
? '<button onclick="purchaseConsumable1()">Buy Now!</button>' | |
: ''; | |
const el = document.getElementById('consumable1-purchase'); | |
el.innerHTML = info + button; | |
} | |
function purchaseConsumable1() { | |
store.order('my_consumable1'); | |
} | |
function finishPurchase(p) { | |
window.localStorage.goldCoins = (window.localStorage.goldCoins | 0) + 10; | |
p.finish(); | |
refreshGoldCoinsUI(); | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
I did add the
<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval' 'unsafe-inline'; style-src 'self' 'unsafe-inline'; media-src *; img-src 'self' data: content:;">
meta then my app can't access to my api, it say Refused to connect to because it appears in neither the connect-src directive nor the default-src directive of the Content Security Policy. Any clue to fix this?