【发布时间】：2017-04-23 08:39:07
【问题描述】：
我正在构建一个带有 Angular 的简单 SPA，我想用它来使用我的 Square 帐户处理信用卡付款。为了安全，Square 希望使用 iframe，因此 CC 信息永远不会触及我的页面。
我已经阅读了有关使用 $sce.trustResourceAsUrl() 的信息，但 square 特别要求从其 CDN 加载文件（因此无需对其进行修改）。
https://docs.connect.squareup.com/articles/adding-payment-form/ 没有列出与 AngularJS 集成的任何内容，我也没有找到任何有用的示例。
任何人都有在 angular1 应用程序中成功嵌入方形支付表单的经验，他们可以指点我吗？或者是否存在阻止这种情况的安全风险？谢谢！
这是文档中的示例文件：
<script type="text/javascript" src="https://js.squareup.com/v2/paymentform">
<script>
var paymentForm = new SqPaymentForm({blah blah blah});
</script>
<html>
<body>
<label>Card Number</label>
<div id="sq-card-number"></div>
<label>CVV</label>
<div id="sq-cvv"></div>
<label>Expiration Date</label>
<div id="sq-expiration-date"></div>
<label>Postal Code</label>
<div id="sq-postal-code"></div>
</body>
</html>
我不完全确定如何调整它以在角度视图中工作。任何建议将不胜感激。
【问题讨论】：
-
什么代码导致了您的问题？路由到新视图后是否无法加载 iframe？
-
嘿 tristansokol，我怀疑问题出在 angular 的本质上，我想我正在寻找解决方法，奇怪的是没有一个方形文档涉及 angular。在他们的示例文件中，我包含了他们的脚本文件（我认为这是魔法发生的地方），我似乎无法找到它的非缩小版本来找到问题。我将摘录上面的例子来说明这个问题谢谢你的帮助。
-
当然，您知道这一切，因为您编写了其他文档，对此感到抱歉:-)。是的，我正在使用路由并尝试在视图中加载 iframe。我收到“在沙盒模式下初始化的 SqPaymentForm。请参阅docs.connect.squareup.com/articles/using-sandbox”消息，但输入不可见。我不确定在哪里寻找麻烦解决这个问题。感谢您的帮助！
标签： javascript angularjs iframe square-connect