Error: Attempting to access the properties `line_items.amount`, `line_items.currency`, `line_items.name`, `line_items.description`, or `line_items` is not allowed

Hi there, I'm currently working on creating an Amazon-inspired platform and I've encountered an error while trying to integrate Stripe with the project. Can anyone provide some assistance? You can refer to the video tutorial I'm using by following this link: https://www.youtube.com/watch?v=4E0WOUYF-QI&t=4092s

The specific error message I received is as follows:

Error - StripeInvalidRequestError: You cannot use line_items.amount, line_items.currency, line_items.name, line_items.description, or line_items.images in this API version. Please use line_items.price or line_items.price_data. For more details, please visit https://stripe.com/docs/payments/checkout/migrating-prices.

Here's the code snippet where the issue arises:

const stripe = require("stripe")(process.env.STRIPE_SECRET_KEY);

export default async (req, res) => {
    const { items, email } = req.body;

    const transformedItems = items.map((item) => ({
        description: item.description,
        quantity: 1,
        price_data: {
            currency: "gbp",
            unit_amount: item.price * 100,
            product_data: {
                name: item.title,
                images: [item.image],
            },
        },
    }));

    const session = await stripe.checkout.sessions.create({
        payment_method_types: ["card"],
        shipping_rates: ["shr_1LkVMHSArY9HEMGlxjejfRWf"],
        shipping_address_collection: {
            allowed_countries: ["GB", "US", "CA"],
        },
        line_items: transformedItems,
        mode: "payment",
        success_url: `${process.env.HOST}/success`,
        cancel_url: `${process.env.HOST}/checkout`,
        metadata: {
            email,
            images: JSON.stringify(items.map((item) => item.image)),
        },
    });

    res.status(200).json({ id: session.id });
};

Answer №1

The issue at hand lies within the transformedItems function. The version of API that you've set up stripe with mandates that the description of the product (i.e. item.description) must be contained within the product_data object.

To rectify this, simply adjust your function by relocating the description inside the specified object like so:

const transformedItems = items.map((item) => ({
    quantity: 1,
    price_data: {
        currency: "gbp",
        unit_amount: item.price * 100,
        product_data: {
            name: item.title,
            description: item.description, //description here
            images: [item.image],
        },
    },
}));

This detail was outlined in the documentation provided by the error message through the link, which may have been overlooked.

Answer №2

 With this code snippet, we can easily transform items by mapping through them and creating a new structure with the desired format:
const transformedItems = items.map((item) => ({
    quantity: 1,
    price_data: {
      currency: "inr",
      unit_amount: item.price * 100,
      product_data: {
        description: item.description,
        name: item.title,
        images: [item.image],
      },
    },
  }));

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Understanding the process of verifying signatures with Cloud KMS

I've been struggling to confirm the validity of a signature generated using Google's cloud KMS, as I'm consistently receiving invalid responses. Here's my approach to testing it: const versionName = client.cryptoKeyVersionPath( p ...

The connection was refused by hapi.js

We have recently encountered an issue while using hapijs: hapi, {"code":"ECONNREFUSED","errno":"ECONNREFUSED","syscall":"connect","domainEmitter":{"domain":{"domain":null,"_events":{},"_maxListeners":10,"members":[]},"_events":{},"_maxListeners":10},"doma ...

What is the abbreviated term for personalized elements in React Native development?

After discovering that custom components can be created like this: const CustomComp=()=>{ console.log('Created custom comp'); return(<View></View>); } export default function App(){ return(<View style={{flex:1}}> &l ...

How can I prevent Heroku from automatically running the script with 'npm start'?

I am currently in the process of developing a server-based application that utilizes automated scripts, also known as "bots," within a cloud environment. I have set up Heroku Scheduler to execute one of these scripts automatically, as illustrated in Figure ...

Oops! You forgot to include the necessary getStaticPaths function for dynamic SSG pages on '/blogs/[post]'

Whenever I attempt to execute npm run build, an error occurs. The following build error occurred: Error: getStaticPaths is required for dynamic SSG pages and is missing for '/blogs/[post]'. This is the code snippet causing the issue: function ...

What crucial element am I overlooking in the React Transition Group Component while implementing it for a carousel design?

I'm trying to add a feature to my Carousel where the opacity changes between images. When clicking on the icons, the images should transition smoothly. I've been using React Transition Group, but for some reason, it's not working as expected ...

When the clearOnBlur setting is set to false, Material UI Autocomplete will not

I recently encountered an issue in my project while using Material UI's Autocomplete feature. Despite setting the clearOnBlur property to false, the input field keeps getting cleared after losing focus. I need assistance in resolving this problem, an ...

Automatically launching a new tab upon page load in a React application

I have a specific requirement that when a form is loaded, a new browser tab should automatically open with a URL based on one of the attributes. After researching some solutions on various platforms like Stack Overflow, I came across this helpful thread: M ...

The most convenient method for automatically updating Google Charts embedded on a webpage

I am facing an issue with refreshing a Google Graph that displays data from a MySQL database. The graph is being drawn within a webpage along with other metrics: Data Output from grab_twitter_stats.php: [15, 32], [14, 55], [13, 45], [12, 52], [11, 57], [ ...

How can you show the default calendar for a specific month and year in a Vue3 datepicker?

I've been utilizing the @vuepic/vue3datepicker component, which automatically shows the days of the current month when integrated in my project: <template> <VueDatePicker v-model="date" inline></VueDatePicker> </templ ...

Tips for enhancing the presentation of JSON information

I recently ventured into the world of JSON and JS, managing to create a JSON file to showcase data using .onclick event. While I have successfully generated and displayed the JSON data on screen, my next goal is to present it in a table format for better c ...

"Exploring the usual progress of a standard GET request using Axios

My Objective: I am utilizing Vue And Axios, with the goal of displaying the progress in percentage on the console. The Challenge: The request itself takes around 4 seconds or more because it fetches a large amount of data, processes it into an excel fil ...

pressing the switch will adjust the size of the container

I am looking to implement a feature where clicking on an icon will resize a div to full screen in the browser. Below is the HTML code I have set up for this functionality, and I am open to suggestions on how to achieve this. <div> <a (click)= ...

Attempting to create an auto-suggestion tool that can process and accept multiple input values, filtering out only those that begin with a designated character

I've been working on implementing an auto-suggestion feature that displays suggestions with partial matches or values within the input box. The goal is for it to only provide suggestions that begin with a specific character, like the "@" symbol. Fo ...

The Javascript query is returning an [object Object] data type

I am facing an issue with a JavaScript file that is querying a SharePoint list. Specifically, the Priority drop down in the query result is displaying as [object OBJECT]. I suspect it has something to do with the var query string where I have added the &ap ...

How can I align a mapped button to appear on the opposite side of the data using Tailwind CSS?

I've been struggling to find a straightforward solution to this issue for a while now. Let me break it down - I need to display some data on the left side of a post card component with a button located right next to it. Here's an illustration: ...

Dismiss MUI Snackbar notification and execute action upon pressing a key

A custom notification system has been developed, utilizing the material ui Snackbar with both an action button and a close button. The objective is to implement a listener event for the "enter" key in order to trigger the specific notification's actio ...

The AWS API Gateway quickly times out when utilizing child_process within Lambda functions

I'm encountering an issue with my Lambda function being called through API Gateway. Whenever the Lambda triggers a spawn call on a child_process object, the API Gateway immediately returns a 504 timeout error. Despite having set the API gateway timeou ...

Utilize the double parsing of JSON information (or opt for an alternative technique for dividing the data

Looking for the most effective approach to breaking down a large data object retrieved from AJAX. When sending just one part (like paths), I typically use JSON.parse(data). However, my goal is to split the object into individual blocks first and then parse ...

The callback URL for signing in is malfunctioning within NextAuth

My navigation component displays "Sign In" and "Sign Out" based on the active session status. The issue I am facing is with the callback after signing in. Upon signing out, the button successfully redirects to the Home Page. However, after a successful si ...