Hello Wix Community!
I’m working on a project to personalize interactions for logged-in users by sending specific data from my Wix site to an external webhook (via Make). My goal is to pull in user data (like their first name or email) when they log in and automatically send it to the webhook to create a personalized experience. However, I’ve run into several roadblocks and could really use some guidance from anyone who has dealt with similar issues on Wix!
Here’s What I’m Trying to Accomplish:
-
Check if a User is Logged In: I want to confirm if a user is logged in, then retrieve their first name or email.
-
Send Data to an External Webhook: Using fetch, I’d like to send this user data (first name or email) to a webhook on Make to trigger a specific workflow.
-
Fallback if Data Isn’t Available: If the user isn’t logged in or if we can’t retrieve their first name, I’d like to send a fallback value like “false” instead.
Challenges I’ve Faced:
-
Accessing User Data: I initially tried accessing the user’s first name and email via wix-users. While getEmail() works for retrieving the email, fetching the first name hasn’t been straightforward, as it’s not directly accessible.
-
Contacts API Errors: Since currentUser doesn’t provide the first name directly, I tried using the Wix Contacts API to retrieve it. Unfortunately, I ran into repeated 404 errors when trying to fetch contacts by email or user ID, even after confirming that the contact exists in the Wix Contacts database.
-
Webhook Errors: When trying to send the data using fetch, I encountered several parsing issues and unexpected behaviors (e.g., TypeError: e?.text is not a function). This error persisted even after troubleshooting with different variations of the request format and error handling.
Here’s the Code I’m Using (Frontend and Backend)
Backend Function (contactService.jsw)
The backend function is meant to fetch the user’s first name if they’re a contact or return “false” if not:
// backend/contactService.jsw
import { currentUser } from 'wix-users-backend';
import { fetch } from 'wix-fetch';
export async function getUserFirstName() {
const user = currentUser;
const apiKey = "YOUR_API_KEY"; // Replace with your actual API key
if (user.loggedIn) {
const userEmail = await user.getEmail();
const response = await fetch(`https://www.wixapis.com/contacts/v1/contact?email=${encodeURIComponent(userEmail)}`, {
method: "GET",
headers: {
"Authorization": apiKey,
"Content-Type": "application/json"
}
});
if (response.ok) {
const contactInfo = await response.json();
const firstName = contactInfo.firstName || "User";
return firstName;
} else if (response.status === 404) {
return "false";
} else {
throw new Error("Failed to retrieve user contact data");
}
} else {
throw new Error("User is not logged in");
}
}
Frontend Code
The frontend code calls the backend function and sends the data to the external webhook:
import { getUserFirstName } from 'backend/contactService';
$w.onReady(async function () {
try {
const firstName = await getUserFirstName();
fetch("https://hook.us1.make.com/YOUR_WEBHOOK_URL", {
method: "POST",
headers: {
"Content-Type": "application/json"
},
body: JSON.stringify({ firstName: firstName })
})
.then(response => {
if (response.ok) {
console.log("Webhook sent successfully with first name:", firstName);
} else {
console.error("Failed to send webhook:", response.status);
}
})
.catch(error => console.error("Error sending webhook:", error));
} catch (error) {
console.error("Error retrieving user first name:", error);
}
});
Questions for the Community:
-
Is there a better way to access the user’s first name or other profile details using Wix APIs? The currentUser API doesn’t seem to provide it, and the Contacts API returns 404 errors even when I know the contact exists.
-
Are there specific settings or permissions that might be blocking the Contacts API request? I’ve checked that the contact exists in the database, and the API key has Contacts permissions, but I keep encountering issues.
-
Any advice on the best way to structure the fetch request to avoid TypeErrors? This has been particularly challenging, and despite simplifying the error handling, the issue persists.
I appreciate any insights, code snippets, or advice you can offer! I’m excited to bring this personalization feature to life and am grateful for your help in getting there.
Thank you!