将 Stripe 与 Meteor.js 一起使用时遇到问题
Issue encountered using Stripe with Meteor.js
我最近 运行 遇到了一些在 Meteor 中使用 stripe 的问题,这个社区一直对我帮助很大,所以来吧!
我正在尝试创建一个简单的网站,允许用户创建帖子并支付预先确定的费用。每月 20 美元,2 个月 30 美元等。我已经构建了网站的整个框架,我现在只需要让用户能够支付。在四处搜索有关我的场景的任何信息时,我看到了一个教程。
https://themeteorchef.com/recipes/payments-with-stripe-checkout/
这是一个非常有用且内容丰富的教程。但是我 运行 遇到了一些问题。我的路径几乎完全相同,但在某些情况下,由于我预先存在的代码所在的位置,我不得不更改它们。我不知道为什么这段代码不起作用,我希望第二只眼睛能抓住我错过的东西。
我的 settings.json 文件位于 .meteor 文件旁边的目录中:
{
"public": {
"stripe": "pk_test_jdsoajdanotrealhasodahsd"
},
"private": {
"stripe": "sk_test_hfsd83totallyreal39u03fda",
"CLOUDINARY_API_SECRET": "9847934f937ForSureReal49849f"
},
"CLOUDINARY_API_KEY": "fdnk84894wy7f7sdffake8494g",
"CLOUDINARY_CLOUD_NAME": "CompanyName"
}
我的 Meteor autofom HTML 位于:/CLIENT/PAGES/POSTS
<template name="insertPostForm">
{{#autoForm collection="Posts" id="insertPostForm" type="insert"}}
<div class="form-group">
<h4>Length of Post <small></small></h4>
{{> afFormGroup name="expiryDate" options=expiryOptions}}
<h3>Information <small></small></h3><hr>
<div class="col-sm-12 col-md-6">
{{> afQuickField name='address'}}
</div>
<div class="col-sm-12 col-md-6">
{{> afQuickField name='status' options='allowed'}}
</div>
<h3>Details <small></small></h3><hr>
<div class="col-sm-12 col-md-6">
{{> afQuickField name='squareFoot'}}
</div>
<div class="col-sm-12 col-md-6">
{{> afQuickField name='yearBought'}}
</div>
{{#unless processing}}
<p class="alert alert-info">Please select your prefered months of posting time</p>
<ul class="list-group price-list">
<li class="list-group-item clearfix">
<p class="pull-left"><strong></strong> — 1 Month</p>
<a href="#" data-service="1Month" type="submit" class="btn btn-primary">Buy Now</a>
</li>
<li class="list-group-item clearfix">
<p class="pull-left"><strong></strong> — 2 Months</p>
<a href="#" data-service="2Months" type="submit" class="btn btn-primary">Buy Now</a>
</li>
<li class="list-group-item clearfix">
<p class="pull-left"><strong></strong> — 3 Months</p>
<a href="#" data-service="3Months" type="submit" class="btn btn-primary">Buy Now</a>
</li>
</ul>
{{else}}
<p class="alert alert-warning"><i class="fa fa-refresh fa-spin"></i> Processing payment...</p>
{{/unless}}
<button type="submit" class="btn btn-primary">Add Listing</button>
</div>
{{/autoForm}}
</template>
我的 service.js 文件位于:CLIENT/PUBLIC/SERVICES.JS
Template.services.onCreated( () => {
let template = Template.instance();
template.selectedService = new ReactiveVar( false );
template.processing = new ReactiveVar( false );
template.checkout = StripeCheckout.configure({
key: Meteor.settings.public.stripe,
locale: 'auto',
token( token ) {
let service = template.selectedService.get(),
charge = {
amount: token.amount || service.amount,
currency: token.currency || 'usd',
source: token.id,
description: token.description || service.description,
receipt_email: token.email
};
Meteor.call( 'processPayment', charge, ( error, response ) => {
if ( error ) {
template.processing.set( false );
Bert.alert( error.reason, 'danger' );
} else {
Bert.alert( 'Success!' );
}
});
},
closed() {
template.processing.set( false );
}
});
});
Template.services.helpers({
processing() {
return Template.instance().processing.get();
},
paymentSucceeded() {
return Template.instance().paymentSucceeded.get();
}
});
Template.services.events({
'click [data-service]' ( event, template ) {
const pricing = {
'1Month': {
amount: 3200,
description: "1 Month"
},
'2Monthes': {
amount: 5000,
description: "2 Monthes"
},
'3Monthes': {
amount: 7500,
description: "3 Monthes"
}
};
let service = pricing[ event.target.dataset.service ];
template.selectedService.set( service );
template.processing.set( true );
template.checkout.open({
name: 'Posting Service',
description: service.description,
amount: service.amount,
bitcoin: true
});
}
});
我的 Stripe.JS 文件位于:/SERVER/STRIPE.JS
let Stripe = StripeAPI(Meteor.settings.private.stripe);
Meteor.methods({
processPayment( charge ) {
check( charge, {
amount: Number,
currency: String,
source: String,
description: String,
receipt_email: String
});
let handleCharge = Meteor.wrapAsync( Stripe.charges.create, Stripe.charges ),
payment = handleCharge( charge );
return payment;
}
});
每当我进入命令行并输入 "meteor --settings settings.json"
时,将教程中的这段代码集成到我的项目中之后
我得到的第一行回复是
"ReferenceError : StripeAPI is not defined"
"at server/Stripe.js : 1 : 14"
如果我将 Stripe.js 代码的第一行更改为 (Meteor.private.Stripe),我的错误将更改为
"TypeError : Cannot read property 'stripe' of undefined"
""
我刚刚在这里疯狂地试图解决这个问题,我想我可能会看看你们中的一个好人是否能够在这件事上帮助我。如果您已经读到这里,那么您已经帮了我大忙了,为此我感谢您!
我最近 运行 遇到了一些在 Meteor 中使用 stripe 的问题,这个社区一直对我帮助很大,所以来吧!
我正在尝试创建一个简单的网站,允许用户创建帖子并支付预先确定的费用。每月 20 美元,2 个月 30 美元等。我已经构建了网站的整个框架,我现在只需要让用户能够支付。在四处搜索有关我的场景的任何信息时,我看到了一个教程。
https://themeteorchef.com/recipes/payments-with-stripe-checkout/
这是一个非常有用且内容丰富的教程。但是我 运行 遇到了一些问题。我的路径几乎完全相同,但在某些情况下,由于我预先存在的代码所在的位置,我不得不更改它们。我不知道为什么这段代码不起作用,我希望第二只眼睛能抓住我错过的东西。
我的 settings.json 文件位于 .meteor 文件旁边的目录中:
{
"public": {
"stripe": "pk_test_jdsoajdanotrealhasodahsd"
},
"private": {
"stripe": "sk_test_hfsd83totallyreal39u03fda",
"CLOUDINARY_API_SECRET": "9847934f937ForSureReal49849f"
},
"CLOUDINARY_API_KEY": "fdnk84894wy7f7sdffake8494g",
"CLOUDINARY_CLOUD_NAME": "CompanyName"
}
我的 Meteor autofom HTML 位于:/CLIENT/PAGES/POSTS
<template name="insertPostForm">
{{#autoForm collection="Posts" id="insertPostForm" type="insert"}}
<div class="form-group">
<h4>Length of Post <small></small></h4>
{{> afFormGroup name="expiryDate" options=expiryOptions}}
<h3>Information <small></small></h3><hr>
<div class="col-sm-12 col-md-6">
{{> afQuickField name='address'}}
</div>
<div class="col-sm-12 col-md-6">
{{> afQuickField name='status' options='allowed'}}
</div>
<h3>Details <small></small></h3><hr>
<div class="col-sm-12 col-md-6">
{{> afQuickField name='squareFoot'}}
</div>
<div class="col-sm-12 col-md-6">
{{> afQuickField name='yearBought'}}
</div>
{{#unless processing}}
<p class="alert alert-info">Please select your prefered months of posting time</p>
<ul class="list-group price-list">
<li class="list-group-item clearfix">
<p class="pull-left"><strong></strong> — 1 Month</p>
<a href="#" data-service="1Month" type="submit" class="btn btn-primary">Buy Now</a>
</li>
<li class="list-group-item clearfix">
<p class="pull-left"><strong></strong> — 2 Months</p>
<a href="#" data-service="2Months" type="submit" class="btn btn-primary">Buy Now</a>
</li>
<li class="list-group-item clearfix">
<p class="pull-left"><strong></strong> — 3 Months</p>
<a href="#" data-service="3Months" type="submit" class="btn btn-primary">Buy Now</a>
</li>
</ul>
{{else}}
<p class="alert alert-warning"><i class="fa fa-refresh fa-spin"></i> Processing payment...</p>
{{/unless}}
<button type="submit" class="btn btn-primary">Add Listing</button>
</div>
{{/autoForm}}
</template>
我的 service.js 文件位于:CLIENT/PUBLIC/SERVICES.JS
Template.services.onCreated( () => {
let template = Template.instance();
template.selectedService = new ReactiveVar( false );
template.processing = new ReactiveVar( false );
template.checkout = StripeCheckout.configure({
key: Meteor.settings.public.stripe,
locale: 'auto',
token( token ) {
let service = template.selectedService.get(),
charge = {
amount: token.amount || service.amount,
currency: token.currency || 'usd',
source: token.id,
description: token.description || service.description,
receipt_email: token.email
};
Meteor.call( 'processPayment', charge, ( error, response ) => {
if ( error ) {
template.processing.set( false );
Bert.alert( error.reason, 'danger' );
} else {
Bert.alert( 'Success!' );
}
});
},
closed() {
template.processing.set( false );
}
});
});
Template.services.helpers({
processing() {
return Template.instance().processing.get();
},
paymentSucceeded() {
return Template.instance().paymentSucceeded.get();
}
});
Template.services.events({
'click [data-service]' ( event, template ) {
const pricing = {
'1Month': {
amount: 3200,
description: "1 Month"
},
'2Monthes': {
amount: 5000,
description: "2 Monthes"
},
'3Monthes': {
amount: 7500,
description: "3 Monthes"
}
};
let service = pricing[ event.target.dataset.service ];
template.selectedService.set( service );
template.processing.set( true );
template.checkout.open({
name: 'Posting Service',
description: service.description,
amount: service.amount,
bitcoin: true
});
}
});
我的 Stripe.JS 文件位于:/SERVER/STRIPE.JS
let Stripe = StripeAPI(Meteor.settings.private.stripe);
Meteor.methods({
processPayment( charge ) {
check( charge, {
amount: Number,
currency: String,
source: String,
description: String,
receipt_email: String
});
let handleCharge = Meteor.wrapAsync( Stripe.charges.create, Stripe.charges ),
payment = handleCharge( charge );
return payment;
}
});
每当我进入命令行并输入 "meteor --settings settings.json"
时,将教程中的这段代码集成到我的项目中之后我得到的第一行回复是
"ReferenceError : StripeAPI is not defined" "at server/Stripe.js : 1 : 14"
如果我将 Stripe.js 代码的第一行更改为 (Meteor.private.Stripe),我的错误将更改为
"TypeError : Cannot read property 'stripe' of undefined"
""
我刚刚在这里疯狂地试图解决这个问题,我想我可能会看看你们中的一个好人是否能够在这件事上帮助我。如果您已经读到这里,那么您已经帮了我大忙了,为此我感谢您!