--> -->
#blog2navi() *NativeScriptのJavaScriptからStripeを使う [#aec8b325] [[NativeScript:https://docs.nativescript.org/]]+JavaScriptから[[nativescript-stripe:https://www.npmjs.com/package/nativescript-stripe]]を使うときにはまったのでメモです。~ ~ 私はNativeScript+JavaScriptでアプリを書いています。(まずこれはお勧めしません。世の中的にはTypeScriptがメジャーなようです)~ &inlinecode{nativescript-stripe};のマニュアルには、以下のように呼び出せとあります。~ #code(JavaScript){{{ var Stripe = require('nativescript-stripe').Stripe; const stripe = new Stripe('yourApiKey'); stripe.createToken(cc, (error,token)=>{ if(!error){ //Do something with your token; }else{ console.log(error); } }); }}} ところが、これをやるとnewのところで以下のエラーが出て落ちます。~ JS: ERROR Error: Uncaught (in promise): TypeError: com.stripe.android.Stripe is not a constructor JS: TypeError: com.stripe.android.Stripe is not a constructor どうやらプラグインの定義がJavaScriptからはうまく呼べる形になっていないようです。(何かのバージョンの問題?)~ ~ そこで、他のプラグインを参考に以下のようなファイルを1つ作ってみました。~ ~ common/stripe-index.js #code(JavaScript){{{ "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); var nativescript_stripe = require("nativescript-stripe"); exports.Stripe = nativescript_stripe.Stripe; exports.Card = nativescript_stripe.Card; }}} ~ そしてこれを使ってStripeを呼び出します。~ #code(JavaScript){{{ const stripe = require("../../common/stripe-index"); const card = new stripe.Card('4242424242424242', 12, 21, '111'); const strp = new stripe.Stripe('your_public_key'); strp.createToken(card, (error,token)=>{ if(!error){ //Do something with your token; console.log('stripe.createToken:success:'+token['id']); }else{ console.log('stripe.createToken:error:'+error); } }); }}} これで無事tokenが返るようになりました。~ stripe.createToken:success:tok_1EQ6leBstKlU6P********** めでたしめでたし。 ** トラブル例 [#z4e7d744] 上記の問題が発生する前には、以下のようなエラーも出ていました。 TypeError: Cannot read property 'CardInputWidget' of undefined File: "file:///data/data/org.nativescript.SCOP/files/app/tns_modules/nativescript-stripe/stripe.js, line: 226, column: 52 これは、nativescriptとandroid platformのバージョンを最新にすることで解消しました。(逆に言うと今後のupdateで再度エラーになる可能性も・・・)~ &inlinecode{tns info};で現在のバージョンを確認の上、 npm install -g nativescript tns platform update で最新に更新できます。 #htmlinsert(twitterbutton.html) RIGHT:Category: [[[NativeScript>日記/Category/NativeScript]]] - 15:09:03 ---- RIGHT:&blog2trackback(); #comment(above) #blog2navi()