hackish way of registering works

uncloud/urls.py

@@ -86,9 +86,11 @@ urlpatterns = [
 
     # web/ = stuff to view in the browser
 #    path('web/vpn/create/', netviews.WireGuardVPNCreateView.as_view(), name="vpncreate"),
+
     path('login/', authviews.LoginView.as_view(), name="login"),
     path('logout/', authviews.LogoutView.as_view(), name="logout"),
     path('admin/', admin.site.urls),
     path('cc/reg/', payviews.RegisterCard.as_view(), name="cc_register"),
+    path('cc/submit/', payviews.RegisterCard.as_view(), name="cc_register"),
     path('', uncloudviews.UncloudIndex.as_view(), name="uncloudindex"),
 ]

uncloud_pay/serializers.py

@@ -5,6 +5,14 @@ from django.utils.translation import gettext_lazy as _
 
 from .models import *
 
+###
+# Checked code
+
+
+################################################################################
+# Unchecked code
+
+
 ###
 # Payments and Payment Methods.
 
@@ -18,7 +26,7 @@ class PaymentMethodSerializer(serializers.ModelSerializer):
 
     class Meta:
         model = PaymentMethod
-        fields = ['uuid', 'source', 'description', 'primary', 'stripe_card_last4', 'active']
+        fields = [ 'source', 'description', 'primary', 'stripe_card_last4', 'active']
 
 class UpdatePaymentMethodSerializer(serializers.ModelSerializer):
     class Meta:
@@ -30,10 +38,12 @@ class ChargePaymentMethodSerializer(serializers.Serializer):
 
 class CreatePaymentMethodSerializer(serializers.ModelSerializer):
     please_visit = serializers.CharField(read_only=True)
+
     class Meta:
         model = PaymentMethod
         fields = ['source', 'description', 'primary', 'please_visit']
 
+
 ###
 # Orders & Products.
 

uncloud_pay/stripe.py

@@ -7,17 +7,10 @@ from django.conf import settings
 
 import uncloud_pay.models
 
-# Static stripe configuration used below.
 CURRENCY = 'chf'
 
-# README: We use the Payment Intent API as described on
-#   https://stripe.com/docs/payments/save-and-reuse
-
-# For internal use only.
 stripe.api_key = settings.STRIPE_KEY
 
-# Helper (decorator) used to catch errors raised by stripe logic.
-# Catch errors that should not be displayed to the end user, raise again.
 def handle_stripe_error(f):
     def handle_problems(*args, **kwargs):
         response = {
@@ -61,8 +54,6 @@ def handle_stripe_error(f):
 
     return handle_problems
 
-# Actual Stripe logic.
-
 def public_api_key():
     return settings.STRIPE_PUBLIC_KEY
 

uncloud_pay/templates/uncloud_pay/stripe.html

@@ -1,7 +1,9 @@
+
 {% extends 'uncloud/base.html' %}
 
 {% block header %}
 		<script src="https://js.stripe.com/v3/"></script>
+
 		<style>
 			#content {
 				width: 400px;
@@ -12,61 +14,80 @@
 				display: none;
 			}
 		</style>
+        <script>
+          billing_details: { email: email }
+        }
+      })
+      .then(function(result) {
+        if (result.error) {
+          changeLoadingState(false);
+          var displayError = document.getElementById("card-errors");
+          displayError.textContent = result.error.message;
+        } else {
+          // The PaymentMethod was successfully set up
+          orderComplete(stripe, setupIntent.client_secret);
+        }
+      });
+  });
+};
+        </script>
+
 {% endblock %}
 
 {% block body %}
 		<div id="content">
-			<h1>Registering Stripe Credit Card</h1>
+		  <h1>Registering Credit Card with Stripe</h1>
+            <p>
+              By submitting I authorise to send instructions to
+              the financial institution that issued my card to take
+              payments from my card account in accordance with the
+              terms of my agreement with you.
+            </p>
 
 			<!-- Stripe form and messages -->
 			<span id="message"></span>
-			<form id="setup-form">
-				<div id="card-element"></div>
-				<button type='button' id="card-button">
-					Save
-				</button>
-			</form>
 
-			<!-- Dirty hack used for callback to API -->
-			<form id="callback-form" action="{{ callback }}" method="post"></form>
+			<div id="card-element"></div>
+			<button type='button' id="card-button">			  Save
+			</button>
+
+            <div id="ungleichmessage">The card will be registered with stripe.</div>
+
 		</div>
 
-		<!-- Enable Stripe from UI elements -->
-		<script>
-			var stripe = Stripe('{{ stripe_pk }}');
+		<!-- Enable Stripe from UI elements - standard code -->
+	<script>
+	  var stripe = Stripe('{{ stripe_pk }}');
 
-			var elements = stripe.elements();
-			var cardElement = elements.create('card');
-			cardElement.mount('#card-element');
+	  var elements = stripe.elements();
+	  var cardElement = elements.create('card');
+	  cardElement.mount('#card-element');
+
+	  var cardButton = document.getElementById('card-button');
+	  var messageContainer = document.getElementById('message');
+	  var clientSecret = '{{ client_secret }}';
+
+	  cardButton.addEventListener('click', function(ev) {
+		  stripe.confirmCardSetup(
+			  clientSecret,
+			  {
+				  payment_method: {
+					  card: cardElement,
+					  billing_details: { name: "{{username}}", },
+				  },
+			  }
+		  ).then(function(result) {
+			  if (result.error) {
+				  var message = document.createTextNode('Error:' + result.error.message);
+				  messageContainer.appendChild(message);
+			  } else {
+				  // Return to API on success.
+				  document.getElementById("ungleichmessage").innerHTML
+		  = "Registered credit card with Stripe."
+			  }
+		  });
+	  });
 		</script>
 
-		<!-- Handle card submission -->
-		<script>
-			var cardButton = document.getElementById('card-button');
-			var messageContainer = document.getElementById('message');
-			var clientSecret = '{{ client_secret }}';
-
-			cardButton.addEventListener('click', function(ev) {
-
-				stripe.confirmCardSetup(
-					clientSecret,
-					{
-						payment_method: {
-							card: cardElement,
-							billing_details: {
-							},
-						},
-					}
-				).then(function(result) {
-					if (result.error) {
-						var message = document.createTextNode('Error:' + result.error.message);
-						messageContainer.appendChild(message);
-					} else {
-						// Return to API on success.
-						document.getElementById("callback-form").submit();
-					}
-				});
-			});
-		</script>
 
 {% endblock %}

uncloud_pay/views.py

@@ -51,12 +51,12 @@ class OrderViewSet(viewsets.ReadOnlyModelViewSet):
 class RegisterCard(LoginRequiredMixin, TemplateView):
     login_url = '/login/'
 
-    # This is not supposed to be "static" --
-    # the idea is to be able to switch the provider when needed
     template_name = "uncloud_pay/stripe.html"
 
     def get_context_data(self, **kwargs):
+
         customer_id = uncloud_stripe.get_customer_id_for(self.request.user)
+
         setup_intent = uncloud_stripe.create_setup_intent(customer_id)
 
         context = super().get_context_data(**kwargs)
@@ -159,7 +159,7 @@ class PaymentMethodViewSet(viewsets.ModelViewSet):
         # TODO: find a way to use reverse properly:
         # https://www.django-rest-framework.org/api-guide/reverse/
         callback_path= "payment-method/{}/activate-stripe-cc/".format(
-                payment_method.uuid)
+                payment_method.id)
         callback = reverse('api-root', request=request) + callback_path
 
         # Render stripe card registration form.