Spotflow Initialize Payment Guide

[gloriadasilva]

What does this PR do?

Added a single line to the contribution guide so I can submit a pull request for the how-to guide link.

Description of Task to be completed?

I created a practical how-to guide on integrating the Spotflow Initialize/Redirect API.

Medium article: https://medium.com/@gloriadasilva_28376/how-to-integrate-spotflows-initialize-redirect-api-in-your-application-18c002b16ec0

LinkedIn post: https://www.linkedin.com/posts/gloria-tejuosho-0547012a7_hacktoberfest-opensource-technicalwriter-activity-7388470090276450304-wvhD?utm_source=share&utm_medium=member_desktop&rcm=ACoAAEn3CwABjg7WUbfCDo2tHuOZN6v53WfMk_0

Link to Issue

Issue: #77

Add Hacktoberfest Accepted Label to Your PR

This PR is a Hacktoberfest submission.
Please add the hacktoberfest-accepted label.

[vercel]

@gloriadasilva is attempting to deploy a commit to the SuperDev's projects Team on Vercel.

A member of the Team first needs to authorize it.

[Timilehin08]

Hi @gloriadasilva
Great work. I like the tone of your writing,

for this (see screenshot below), the link you're meant to add is app.spotflow.co

Curious to know how or where you got the other link though?

[Timilehin08]

Also here @gloriadasilva does this code work? Asking because the body and the parts i pointed an arrow to aren't something a user can copy and paste. tried it and it shows code errors

[Timilehin08]

In addition to this, the alternative method and often preferred method by developers is to verify payments via webhook. kindly update your medium article to say, they can set a webhook url on their dashboard on app.spotflow.co and they'll know if payments are successful via the webhook set. see a sample of the webhook screenshot/how it looks like below.

[Timilehin08]

Also add to your article that they as a merchant that owns the application and the customer that made the payment receives an email once the payment goes through @gloriadasilva

In all, this is a really good article. Welldoneee on the great job.

Kindly reflect these changes and let me review again. Let me know if you have any questions.

[gloriadasilva]

Hi @gloriadasilva Great work. I like the tone of your writing,

for this (see screenshot below), the link you're meant to add is app.spotflow.co

Curious to know how or where you got the other link though?

I had to look for the login link on the internet and I found this. It is working, though, because I was able to create an account. I'll replace it now.

[gloriadasilva]

Also here @gloriadasilva does this code work? Asking because the body and the parts i pointed an arrow to aren't something a user can copy and paste. tried it and it shows code errors

Yeah, the reference and the amount work, but the callbackurl needs to be replaced with the actual url the dev wants to redirect to. I will fix it now.

[gloriadasilva]

In addition to this, the alternative method and often preferred method by developers is to verify payments via webhook. kindly update your medium article to say, they can set a webhook url on their dashboard on app.spotflow.co and they'll know if payments are successful via the webhook set. see a sample of the webhook screenshot/how it looks like below.

Oh, alright, noted. I'll update it.

[gloriadasilva]

Also add to your article that they as a merchant that owns the application and the customer that made the payment receives an email once the payment goes through @gloriadasilva

In all, this is a really good article. Welldoneee on the great job.

Kindly reflect these changes and let me review again. Let me know if you have any questions.

Alright, thank you. I'll get back to you once I update it.

[gloriadasilva]

In addition to this, the alternative method and often preferred method by developers is to verify payments via webhook. kindly update your medium article to say, they can set a webhook url on their dashboard on app.spotflow.co and they'll know if payments are successful via the webhook set. see a sample of the webhook screenshot/how it looks like below.

Hi, @Timilehin08 . I need clarifications concerning this. Should i create a dedicated subheading for both methods, i.e., 'verify' API and the webhook? Or should I just simply mention the webhook as the recommended alternative?

[Timilehin08]

Also here @gloriadasilva does this code work? Asking because the body and the parts i pointed an arrow to aren't something a user can copy and paste. tried it and it shows code errors

Yeah, the reference and the amount work, but the callbackurl needs to be replaced with the actual url the dev wants to redirect to. I will fix it now.

okayy

[Timilehin08]

In addition to this, the alternative method and often preferred method by developers is to verify payments via webhook. kindly update your medium article to say, they can set a webhook url on their dashboard on app.spotflow.co and they'll know if payments are successful via the webhook set. see a sample of the webhook screenshot/how it looks like below.

Hi, @Timilehin08 . I need clarifications concerning this. Should i create a dedicated subheading for both methods, i.e., 'verify' API and the webhook? Or should I just simply mention the webhook as the recommended alternative?

You can create a dedicated subheading for both methods mentioning webhook as a recommended alternative @gloriadasilva

[gloriadasilva]

In addition to this, the alternative method and often preferred method by developers is to verify payments via webhook. kindly update your medium article to say, they can set a webhook url on their dashboard on app.spotflow.co and they'll know if payments are successful via the webhook set. see a sample of the webhook screenshot/how it looks like below.

Hi, @Timilehin08 . I need clarifications concerning this. Should i create a dedicated subheading for both methods, i.e., 'verify' API and the webhook? Or should I just simply mention the webhook as the recommended alternative?

You can create a dedicated subheading for both methods mentioning webhook as a recommended alternative @gloriadasilva

Hi, @Timilehin08 . Is there a way I can set a webhook URL on my account? I think there is a limit to what I can access on my dashboard until I complete my account setup.

[gloriadasilva]

In addition to this, the alternative method and often preferred method by developers is to verify payments via webhook. kindly update your medium article to say, they can set a webhook url on their dashboard on app.spotflow.co and they'll know if payments are successful via the webhook set. see a sample of the webhook screenshot/how it looks like below.

Hi, @Timilehin08 . I need clarifications concerning this. Should i create a dedicated subheading for both methods, i.e., 'verify' API and the webhook? Or should I just simply mention the webhook as the recommended alternative?

You can create a dedicated subheading for both methods mentioning webhook as a recommended alternative @gloriadasilva

Hi, @Timilehin08 . Is there a way I can set a webhook URL on my account? I think there is a limit to what I can access on my dashboard until I complete my account setup.

hi, @Timilehin08 . Still waiting for your reply.

[Timilehin08]

In addition to this, the alternative method and often preferred method by developers is to verify payments via webhook. kindly update your medium article to say, they can set a webhook url on their dashboard on app.spotflow.co and they'll know if payments are successful via the webhook set. see a sample of the webhook screenshot/how it looks like below.

Hi, @Timilehin08 . I need clarifications concerning this. Should i create a dedicated subheading for both methods, i.e., 'verify' API and the webhook? Or should I just simply mention the webhook as the recommended alternative?

You can create a dedicated subheading for both methods mentioning webhook as a recommended alternative @gloriadasilva

Hi, @Timilehin08 . Is there a way I can set a webhook URL on my account? I think there is a limit to what I can access on my dashboard until I complete my account setup.

hi, @Timilehin08 . Still waiting for your reply.

Hi. please share your email, i'll invite you to the hacktoberfest account where you can set up a webhook url. you'll need to set your own password once you're invited though. on the dashboard, go to settings - api and webhooks. you'll be able to set up there.

[Timilehin08]

Apologies for the late reply. @gloriadasilva i've responded above

[gloriadasilva]

Apologies for the late reply. @gloriadasilva i've responded above

Alright. Here is my email address: [email protected]

[Timilehin08]

[email protected]

I've sent an invite You can set up the account on your end. Adding webhooks are in Settings > Payment > API Keys @gloriadasilva
you can use this free webhook resource for webhook urls that work: https://webhook.site/c3cae230-edb9-4b04-a934-c431bf6c07e6

[gloriadasilva]

[email protected]

I've sent an invite You can set up the account on your end. Adding webhooks are in Settings > Payment > API Keys @gloriadasilva you can use this free webhook resource for webhook urls that work: https://webhook.site/c3cae230-edb9-4b04-a934-c431bf6c07e6

Hi, @Timilehin08 . Sorry for the back and forth. I have accepted the invitation, created a password and enabled 2FA, but i keep getting 'incorrect username or password' error anytime i want to log in. The password is the new one I just created and I used the same email address you sent the invitation to. Don't know why it's popping the error.

[Timilehin08]

[email protected]

I had to invite this email: [email protected] because of your previous account
it has a + in it. to confirm, please check the invite email you received
i.e see screenshot example

[gloriadasilva]

Oh, I have been able to log in now. Thank you.

[gloriadasilva]

Hi, @Timilehin08 .
I have added different webhook url in the dasboard but none worked.

I tried the webhook URL from the webhook. site and then pipedream, but none worked.
I also created a webhook in my Django app , but it is still the same.

Once I paste the webhook URL in the dashboard, it won't save. I don't know why it its happening or maybe there is something i am doing wrong

[Timilehin08]

Hi, @Timilehin08 . I have added different webhook url in the dasboard but none worked.

I tried the webhook URL from the webhook. site and then pipedream, but none worked. I also created a webhook in my Django app , but it is still the same.

Once I paste the webhook URL in the dashboard, it won't save. I don't know why it its happening or maybe there is something i am doing wrong

did you click on save and put in your OTP code for that email from your authenticator app afterwards?
also did you open the webhook url you want to use in another tab to see if the payments you made reflected there? @gloriadasilva

[Timilehin08]

also ensure you save the webhook url in test mode and not live mode on the dashboard @gloriadasilva
because you're using test mode and keys to test

[gloriadasilva]

also ensure you save the webhook url in test mode and not live mode on the dashboard @gloriadasilva because you're using test mode and keys to test

yes, I have switched to test mode. The "Save" button is not clicking. Please, check the attached image. Once i submit the url and click the "Save" button, nothing happens.

[gloriadasilva]

also ensure you save the webhook url in test mode and not live mode on the dashboard @gloriadasilva because you're using test mode and keys to test

yes, I have switched to test mode. The "Save" button is not clicking. Please, check the attached image. Once i submit the url and click the "Save" button, nothing happens.

Tried websitehook url. same thing

[Timilehin08]

also ensure you save the webhook url in test mode and not live mode on the dashboard @gloriadasilva because you're using test mode and keys to test

yes, I have switched to test mode. The "Save" button is not clicking. Please, check the attached image. Once i submit the url and click the "Save" button, nothing happens.

Tried websitehook url. same thing

are you sure it's not your network? cos i tried it here and it works with same hacktoberfest account

Anyway, I've set a webhook url on the account: https://webhook.site/168f41b5-8efa-442b-8982-55e061d9e348
you can use it to avoid delay/ the back and forth. open the webhook url in another tab to see responses of payments you make.

[gloriadasilva]

Hi, @Timilehin08 . I am not sure if using HMAC SHA512 with the secret key is the correct way to compute the signature because I keep getting errors. Here is my code snippet:
``
secretKey = "SECRETKEY HERE"
signature = request.headers.get("x-spotflow-signature")
payload = request.body

    computed_signature = hmac.new(
      secretKey.encode(),
      payload,
      hashlib.sha512
   ).hexdigest()
   

    if not hmac.compare_digest(computed_signature, signature):
        return JsonResponse({"status": "forbidden"}, status=403)

``
The 403 error occurs because the computed signature doesn't match the Spotflow signature in the request. However, if I remove the verification line, everything works fine, which means my webhook itself is working.

[Timilehin08]

Hi, @Timilehin08 . I am not sure if using HMAC SHA512 with the secret key is the correct way to compute the signature because I keep getting errors. Here is my code snippet: `` secretKey = "SECRETKEY HERE" signature = request.headers.get("x-spotflow-signature") payload = request.body

    computed_signature = hmac.new(
      secretKey.encode(),
      payload,
      hashlib.sha512
   ).hexdigest()
   

    if not hmac.compare_digest(computed_signature, signature):
        return JsonResponse({"status": "forbidden"}, status=403)

`` The 403 error occurs because the computed signature doesn't match the Spotflow signature in the request. However, if I remove the verification line, everything works fine, which means my webhook itself is working.

@gloriadasilva so I confirmed ours is HMAC 256 not even 512
Then where do you get the webhook secret from? It’s different from the webhook URL and it’s not on the Spotflow dashboard either. That’s why I’m asking

Lastly to speed things up if you don’t eventually figure it out, you can remove the verification line.

[gloriadasilva]

Hi, @Timilehin08 . I am not sure if using HMAC SHA512 with the secret key is the correct way to compute the signature because I keep getting errors. Here is my code snippet: `` secretKey = "SECRETKEY HERE" signature = request.headers.get("x-spotflow-signature") payload = request.body

    computed_signature = hmac.new(
      secretKey.encode(),
      payload,
      hashlib.sha512
   ).hexdigest()
   

    if not hmac.compare_digest(computed_signature, signature):
        return JsonResponse({"status": "forbidden"}, status=403)

`` The 403 error occurs because the computed signature doesn't match the Spotflow signature in the request. However, if I remove the verification line, everything works fine, which means my webhook itself is working.

@gloriadasilva so I confirmed ours is HMAC 256 not even 512 Then where do you get the webhook secret from? It’s different from the webhook URL and it’s not on the Spotflow dashboard either. That’s why I’m asking

Lastly to speed things up if you don’t eventually figure it out, you can remove the verification line.

Oh, I was using the normal secret key. I'll just remove it then.

[gloriadasilva]

hi, @Timilehin08 . I have updated the article based on your feedback. You can check it out here: https://medium.com/@gloriadasilva_28376/how-to-integrate-spotflows-initialize-redirect-api-in-your-application-18c002b16ec0

[Timilehin08]

hi, @Timilehin08 . I have updated the article based on your feedback. You can check it out here: https://medium.com/@gloriadasilva_28376/how-to-integrate-spotflows-initialize-redirect-api-in-your-application-18c002b16ec0

Well done @gloriadasilva I’ll check it out in a bit.

[Timilehin08]

hi, @Timilehin08 . I have updated the article based on your feedback. You can check it out here: https://medium.com/@gloriadasilva_28376/how-to-integrate-spotflows-initialize-redirect-api-in-your-application-18c002b16ec0

@gloriadasilva So we’ll like to add this in the tutorial section of our new documentation platform. We’ll give you credits and also add your medium link.
please share any assets (images etc) you used in your blogpost so we can use it on there.

[gloriadasilva]

hi, @Timilehin08 . I have updated the article based on your feedback. You can check it out here: https://medium.com/@gloriadasilva_28376/how-to-integrate-spotflows-initialize-redirect-api-in-your-application-18c002b16ec0

@gloriadasilva So we’ll like to add this in the tutorial section of our new documentation platform. We’ll give you credits and also add your medium link. please share any assets (images etc) you used in your blogpost so we can use it on there.

Alright. Thank you so much.

video demo: https://www.youtube.com/watch?v=3D5EVUTUy8s Demo app (if necessay): https://spotflow-demo.onrender.com/ @Timilehin08