如何在Magento 2中创建付款方式
如何在Magento 2中创建付款方式

如何在Magento 2中创建付款方式

2018年3月27日发布 in 发展
如何在Magento 2中建立主题2
2018年3月6日
对广告等级和SERP的影响’ real estate
2018年5月11日

有时您可能需要超过标准的开箱即用的付款方式。也许您与信用卡处理器达成协议,并且不可用的平台解决方案。也许您需要将特定逻辑插入结账流以支持ERP。通过构建自定义付款方式,您将能够自定义用户将与结帐交互的字段,并高度自定义用于实现付款方式的API逻辑。

作为一个例子,我们将看看信用卡处理器没有可用于Magento的解决方案2.所以我们将检查如何在Magento 2.将基于信用卡的支付方式添加到Magento 2.我们会检查后端和前端更改需要进行付款方式工作以及我们可以依赖本机魔法逻辑的地方。 (除非另有说明,否则所有以下代码示例和文件路径都将相对于名为classyllama_llamoin的新的Magento模块。有关此处的更详细示例,您可以参考 这个github. 。)

新付款方式的基础

配置

First, in our new module we’ll need to add configuration settings for our payment method. For a custom payment method, you will likely have many additional configuration settings, but here we’re only going to add a few very basic settings. We will need an “enabled” setting, a title to display for our payment method, and a setting for which credit card types we will accept. These will be added in etc/adminhtml/system.xml. These fields, 积极的, 标题, and cctypes. ., are used by the core classes we’re extending so make sure to match the field ids exactly. Additionally, it’s important to make sure these fields are added in the 支付 配置 namespace as Magento references this namespace when loading configuration fields.

Now we can define default values for the configuration settings we created. Create a new file in the etc folder named 配置 .xml and define your values. There’s an additional field that has been added that we didn’t define in the 系统 .xml file: the field 模型. This field defines the payment method model for our payment method.

付款方式

Since the 配置 .xml file tells Magento where to find our payment model class, we want to make sure this class is created: 模型 \LlamaCoin. This class is where the main logic that processes the payment information is found. The core Magento class defines several methods that we will want to implement in our class: 授权 and 捕获. (There are several other methods defined, like void, but we won’t be implementing them in this example.) Your payment model must extend \Magento\Payment\Model\Method\AbstractMethod; if you’re creating a credit card method, though, you’ll probably want to extend \Magento\Payment\Model\Method\Cc, which provides helpful logic in the validate method. We’ll come back to this model and fill it in later.

After creating the 系统 .xml and 配置 .xml files and defining the base class for our payment method, we can now see our configuration settings in the admin. (Found at Stores > Configuration > Sales > Payment Methods)

访问配置数据

On the frontend, we’ll need to give the checkout interface access to our payment method’s configuration fields. To provide this information, we must define a PHP provider class. Magento will use this provider class to store all the checkout-related configuration in the window.checkoutConfig javascript. object. The provider we create will need to implement the \Magento\Checkout\Model\ConfigProviderInterface interface and use the getConfig 方法 to return the data we configured. However, Magento has built a generic class, \Magento\Payment\Model\CcGenericConfigProvider, that implements this required interface and additionally goes through all the available payment methods and gathers all the configuration fields we’ll need. This means we can simply inject our payment method into this CC. GenericConfigProvider and it will load our data to the window.checkoutConfig object. Create a new file etc/frontend/di.xml and add our payment method code as an argument.

我们有基础的自定义付款方式到位,前端将能够访问我们的数据,因此现在我们可以在前端显示付款方式。

在结账时显示新付款

我们正在添加一个将使用信用卡结账的付款方式。由于Magento本身有几种带有信用卡模板的付款方式,我们可以利用几个核心模板来呈现我们的付款方式。

javascript.

There are two important JS files to add: the payment method renderer and the component that registers the renderer. The contents of the component file, 看法 /frontend/web/js/view/payment/llamacoin.js, are rather simple and only serve to add the renderer:

The file path of the renderer file is 看法 /frontend/web/js/view/payment/method-renderer/. This file handles the frontend logic specific to the new payment method: validation on the form fields and accessor methods for the Knockout template data. In its simplest form, the renderer only needs to include the path to the Knockout template, and this renderer can depend on 玛托托 _Checkout/js/view/payment/default. Since our payment method uses credit card fields, we can extend 玛托托 _Payment/js/view/payment/cc-form. This base JavaScript file (and its associated Knockout template, cc-form.html) provide a form that contains the basic fields and validation for the credit card fields (number, date, type, year, and csv). By depending on these forms, you can leverage a great deal of basic functionality and then customize it to your needs.

模板

The JS renderer uses Knockout to render the uiComponent. The native templates used in this rendering process are found in the 玛托托 _Payment/view/frontend/web/template/payment/ folder. But we’ll need to add one template, effectively a wrapper around our form, to contain a radio button, title, and billing address for our payment method. Create the new template at /view/frontend/web/template/payment/llamacoin.html. In this template, we’re using Knockout to render the native credit card form and a place to display the address. (This new template is heavily based off the native free.html 模板 in the location referenced above.)

If you need to customize the fields on the credit card form, simply copy forward the native cc-form.html file to your module, update the reference in your JavaScript renderer file, and make your changes to the new template.

布局

Finally, we need to tell Magento where to include these JavaScript files. Create a new layout file 看法 /frontend/layout/checkout_index_index.xml. (Sections of the file below have been left out. For the entire file, view checkout_index_index.xml 在 the GitHub示例 我在这个布局文件中创建了。)在布局中注册了新的付款方式,以便它将包含在Checkout页面上。此XML文件包含对我们创建的JavaScript组件的引用。

现在,我们的付款方式将在结账时成为一种选择。

现在为了使我们的付款方式工作,我们需要使用如何处理提交的数据的逻辑更新我们的付款类。

付款方式模型

Before our payment model 骆驼素 can be used to process an order, we need to update a few properties: $_canCapture and $_canAuthorize. The payment abstract method class (\Magento\Payment\Model\Method\AbstractMethod) checks these properties before calling the associated methods on our payment model instance. Since we’ll be implementing a 捕获 and 授权 method, we will want to change these properties to be 真的. If your payment method implements methods for voids, refunds, or partial captures, you’ll want to set the corresponding property on your payment method instance. Look through the AbstractMethod 班级 to be familiar with all the available properties.

We’ll need one more property: $_code. The value of this property will be the payment method code that we’re using: “classyllama_llamacoin.”. The AbstractMethod 班级 uses this property in the getcode. 方法 which is called any time Magento needs to get the payment model code. This means it’s important that the $_code property matches the section name we defined in 系统 .xml. This is used several times, one of which is to set and save the payment method code on the order object.

Now that these properties are in place, we can look at the logic around how an order is processed. When an order is placed, the place 方法 in the \Magento\Sales\Model\Order\Payment 班级 decides how to handle the payment. Several important steps happen during this method:

  1. The place 方法 finds an instance of our payment method model.
  2. The payment is validated. This validation happens in the validate 方法 on the payment model. Since we extended the \Magento\Payment\Model\Method\Cc class, this parent class is used to validate our payment. To customize the validation logic, simply define a validate 方法 in your payment class.
  3. 支付 Action. This method determines how the payment will be handled. By default, there are three actions defined as constants on \Magento\Payment\Model\Method\AbstractMethod: order, authorize, and authorize_capture. We’ll need to implement the getconfigpaymentaction. 方法 in our class and return the action we want to use. (This option can be made configurable. The Authorize.Net module adds a source model for payment action to make it a configurable field.)
  4. The 授权 and 捕获 methods are called. (See full payment model class below.)
  5. 我们将使用两个API呼叫。一个授权金额,一个捕获金额。
  6. Two parameters are passed to the authorize and capture methods. An amount (the total price of the order) and a $payment object which implements the \Magento\Payment\Model\InfoInterface interface. This $payment object will have all data we need to reference set on it. (Credit card data, address info, and order data.) We can now build an array of data to pass to the credit card processor.
  7. makeCaptureequest. and makeauthrequest. have been implemented as placeholder methods that return test data. In reality, these methods would be where you implement specific logic to reach out to the API of a credit card processor.
  8. The 捕获 方法 first checks to make sure an 授权 要求 has been successful. Once authorization and capture happen, the status of the payment is updated by setting setIsTransationClosed to 真的.
  9. After the 授权 and 捕获 methods, Magento updates the order status and saves the payment data to the database. The order process is now complete!

这是付款方式模型的最终状态:

结论

我们已完成为Magento构建自定义付款方式。我们建立了基础后端配置设置和型号,然后我们添加了将支付方法显示给客户所需的前端更改,然后添加逻辑以使模型处理支付数据。本教程可以用作将支付方法添加到Magento的基础。有很多方法可以建立在我们所做的内容,为商家和客户提供最佳体验。

我为此示例添加了所有代码 这个github.。 (此示例是在Magento 2.2.2上构建和测试。)此外,核心Magento代码中的Braintree和Authorize.net模块提供了一些这些文件如何交互的重要示例。

15 Comments

  1. 麦克风 说:

    当我到达di.xml中添加的部分时,我正在通过教程走过教程,得到了500个错误。因为你正在做一个覆盖的magento \ payment \ model \ ccgenericconfigprovider与classyllama \ llamacoin \ model \ llamacoin :: code,magento会吓坏模型类吗?’T常数有常量(你在最后添加那个)。我又补充说,再次与世界各地都很好。

  2. 穆罕默德 说:

    谢谢

  3. Yasser Nasser. 说:

    您好,非常感谢您,非常感谢您正在寻找此目的,但我有一个问题如何以及我们可以在哪里添加银行API并与我们的银行的请求处理

  4. 说:

    你好,

    我正在使用捕获方法。当我在那里打印东西并放出退出;

    我无法在那里展示任何东西,它重定向到结账/购物车。
    你能告诉我如何调试我的数据。

    我正在测试,就像它去结账/购物车请告诉我如何调试我的数据。

    公共功能捕获(\ magento \付款\ model \ Invointerface $付款,$金额)
    {
    echo $amount; exit;
    }

  5. 好帖子伙计们,谢谢分享社区!
    PD:我喜欢顶部的比特币图像 -

  6. 朱利安 说:

    谢谢你。我需要将客户重定向到处理器托管的付款页面。如果客户从这里重定向‘classyllama \ llamacoin \ model \或来自另一个类或javascript文件?

  7. Nassim B. 说:

    非常感谢你,将一步一步的模式作为夏天,只是为了让事情在我们的脑海中清楚,只是一个问题,你被默认支付模块的灵感来自玛托托?如果我检查它们,它会帮助我更快吗?作为我’我现在正在实施支付模块,但只有一个重定向到处理器网关的按钮。

  8. 拉蒙 说:

    这是如何使用3D安全的工作?

  9. Texasrancher. 说:

    伟大的指南!如果已弃用CC,我们使用什么?

  10. 拉米尔希山 说:

    伟大的解释

  11. 请注意,这种方法要弃用了创建支付方法(从CC类继承和依次依次)(从技术上已经是Magento 2.0),它可能会在Magento 2.4中删除,这将在今年的某个时间出来。

    此Magento Dev文档部分介绍了当前方法:
    //devdocs.magento.com/guides/v2.3/payments-integrations/base-integration/integration-intro.html

  12. 以色列Guido. 说:

    我有这个错误“常量名称是预期的。”当我使用setup:升级时,你知道这个吗?

  13. 如何渲染一个付款选项?在相同的方法 - 渲染JS

  14. 玛托托 dev. 说:

    嘿克里斯!谢谢你的指导。您可以使用DI / DI.XML将其更新为2.3,鉴于您实现的付款方式模型的方式在2.3中已被弃用,将来将来删除?

发表评论

您的电子邮件地址不会被公开。 必需的地方已做标记 *

本网站使用AkisMet减少垃圾邮件。 了解如何处理评论数据.

最近的帖子查看全部
3月1日,2021年

Covid的巨大加速要求再次欺诈和消费者虐待警惕

2月3日,2021年

社交媒体在科迪德自然时期的增长’s One

1月5日,2021年

替代社交媒体

您是否注意到您的Facebook和Instagram内容似乎越来越少,并且每次通过都会越来越少?用于达到的帖子 […]