Skip to main content
Solved

[Question] Cannot see new profiles/users within my Klaviyo Newsletter List despite successful API request

  • January 25, 2023
  • 2 replies
  • 264 views

Forum|alt.badge.img+2

Hey there!

I creating a simple Vue.js Klaivyo subscribe component that has worked for me in the past.. However recently I have not been seeing any new profiles added to my newsletter despite retrieving a successful API request (the network console shows a successful Status Code: 200).

Here is my Vue component (it uses the klaviyo-subscribe repo from Github that uses the https://manage.kmail-lists.com/ajax/subscriptions/subscribe):
 

<template>
  <div class="klaviyo-newsletter">
    <h4>{{ title }}</h4>
    <p>{{ text }}</p>
    <form aria-label="Newsletter Signup" class="klaviyo-newsletter__form">
      <input
        type="email"
        name="user[email]"
        v-model="email"
        aria-label="Enter your email address"
        placeholder="Email"
        autocapitalize="off"
        autocomplete="email"
        autocorrect="off"
        required
      />
      <button type="button" @click="submit">
        <span>{{ isSending === true ? 'Sending...' : 'Send' }}</span>
      </button>
    </form>
  </div>
</template>

<script>
import { subscribe } from 'klaviyo-subscribe'

export default {
  name: 'KlaviyoSubscribe',

  props: {
    title: {
      type: String,
      default: 'Newsletter'
    },
    text: {
      type: String,
      default: ''
    },
    listId: {
      type: String,
      default: ''
    }
  },

  data() {
    return {
      errorMessage: false,
      isSending: false,
      email: ''
    }
  },

  methods: {
    async submit() {
      this.isSending = true

      try {
        const response = await subscribe(this.listId, this.email)
        if (response.success) {
          this.isSending = false
          this.$emit('handleSuccess')
          this.email = ''
        } else {
          throw new Error(response.message)
        }
      } catch (error) {
        this.isSending = false
        this.errorMessage = error.message
        console.error(error)
      }
    }
  }
}
</script>


And here is the successful network response within the console:

Request URL: https://manage.kmail-lists.com/ajax/subscriptions/subscribe
Request Method: POST
Status Code: 200 OK
Remote Address: 54.234.26.4:443
Referrer Policy: strict-origin-when-cross-origin


I am completely lost as to why I cant see any emails/user-profiles within my newsletter dashboard when I am testing this despite getting a successful request?

Any help would be AMAZING! Thanks!

Best answer by rylanharper

SOLVED! I didn’t realize I had to check my spam folder to accept the email subscription lol.. (all that debugging for nothing 😪)

However, people can use this email component posted above if they are using Vue/Nuxt! Works with Vue or Nuxt 😃

View original
Did this topic or the replies in the thread help you find an answer to your question?

2 replies

Forum|alt.badge.img+2
  • Author
  • Contributor I
  • 1 reply
  • Answer
  • January 25, 2023

SOLVED! I didn’t realize I had to check my spam folder to accept the email subscription lol.. (all that debugging for nothing 😪)

However, people can use this email component posted above if they are using Vue/Nuxt! Works with Vue or Nuxt 😃


Brian Turcotte
Forum|alt.badge.img+37

Hi @rylanharper!

 

Glad you figured it out! This will be useful for other members that might run across the same issue.

 

Best,

Brian


Reply