0

我在 nuxtjs/vuejs 项目中有以下示例代码

<template>
    <v-app>
      <div id="dibs-complete-checkout"></div>
    </v-app>
</template>


<script>
  export default {

    head () {
      return {
        script: [
          { src: 'https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js' },
          { src: 'https://test.checkout.dibspayment.eu/v1/checkout.js?v=1' }
        ]
      }
    },

    created () {
      this.$axios.get('test/11').then((response) => {
        var checkoutOptions = {
          checkoutKey: response.data.checkOutKey,
          paymentId: response.data.dibsPaymentId,
          containerId: 'dibs-complete-checkout',
          language: 'en-GB'
        }

        var checkout = new Dibs.Checkout(checkoutOptions)

        checkout.on('payment-completed', function (response) {
        })

        checkout.on('pay-initialized', function (response) {
          checkout.send('payment-order-finalized', true)
        })
      })
        .catch((e) => {
          console.error(e)
        })
    }
  }
</script>

那里发生的事情是：

  1. 已加载来自 dibspayment.com 的外部脚本
  2. 后端有一个 axios 调用返回一个 checkoutKey 和一个 paymentId，这在 checkoutOptions 对象中是必需的
  3. 从 dibspayment.com 加载的脚本包含一个对象 Dibs，它有一个名为 Checkout(checkoutOptions) 的方法

开发服务器在 http 上运行。

我收到几个错误。一种是“未定义 Dibs”

    ./pages/index.vueModule Error (from ./node_modules/eslint-loader/index.js):C:\git\ssfta_web\pages\index.vue  29:28  error  'Dibs' is not defined  no-undef✖ 1 problem (1 error, 0 warnings)

这很奇怪，因为页面加载并呈现在

另一个错误是

OPTIONS https://test.checkout.dibspayment.eu/api/v1/theming/checkout 401 (Unauthorized)

最后一个错误是

Access to XMLHttpRequest at 'https://test.checkout.dibspayment.eu/api/v1/theming/checkout' from origin 'http://10.0.75.1:8080' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.

我试过了：

  1. 联系 DIBS 支付支持团队，那里的响应既慢又没有提供真正的建议（向我提供了顶级常见问题解答页面的链接）。我怀疑他们使用他们的销售部门来回答询问。
  2. 在 https 上运行它，这让情况变得更糟
  3. 在具有 ssl 证书的 nginx 反向代理后面运行它，该进程通过 http 运行代码本身，但 nginx 将其“转换”（？）它为 https
  4. 无数的冰雹让一切变得更糟

当前情况的图像

在此处输入图像描述

我真的没有问题，我只是希望/怀疑我忘记了一些有人可以发现的基本配置或细节

任何建议表示赞赏。

4

2 回答 2

0

正确阅读错误信息，是 es lint 错误

这样做是为了解决它

/*eslint-disable */
  var checkout = new Dibs.Checkout(this.checkoutData)
  /* eslint-enable */
于 2019-11-22T08:39:51.773 回答
0

这周遇到了这个问题。

联系了 Dibs 支持解决这个问题，离开了工作，第二天我返回了一封来自支持的电子邮件，其中包含我已经收到的 API 密钥的副本，但是在再次测试我的项目（没有任何变化）之后，这个错误神奇地出现了消失了，所以显然这个问题是他们的结局。假设我的钥匙缺少正确的授权。

于 2019-11-22T08:22:44.623 回答