'<', "<!DOCTYPE "... is not valid JSON despite parsing a string

Prompting
1

I have an array of data that I mapped through and used the following form:

{clubs.map((club, index) => (
                <div key={index}>
                <form onSubmit={onSubmit}>
                <input 
                    type="text"
                    name="clubSummary"
                    value={club.about}
                    onChange={(e) => setClubSummary(e.target[0].value)}
                    key={index}
                    />
                <button type="submit">Summarise</button>
                {clubSummaryResult &&
                    <p>{clubSummaryResult}</p>
                }
            </form>
            </div>
            ))}

Using this onSubmit and state:

 const [clubSummary, setClubSummary] = useState("")
    const [clubSummaryResult, setClubSummaryResult] = useState()

    async function onSubmit(e){
        e.preventDefault()
        setClubSummary(e.target[0].value)

        try {
            const res = await fetch('/api/clubsummary', {
                method: "POST",
                headers: {
                    "Content-Type": "application/json"
                },
                body: JSON.stringify({clubSummary})
            })
            const data = await res.json()
            setClubSummaryResult(data.result)
            setClubSummary("")
        } catch (err) {
            console.log(err)
        }
        
    }

Here’s the api code:

const { Configuration, OpenAIApi } = require("openai");

const configuration = new Configuration({
  apiKey: process.env.OPENAI_API_KEY,
});
const openai = new OpenAIApi(configuration);

export default async function (req, res) {
    const completion = await openai.createCompletion({
      model: "text-davinci-002",
      prompt: generatePrompt(req.body.clubSummary),
      temperature: 0.7,
      max_tokens: 100,
      top_p: 1,
      frequency_penalty: 0,
      presence_penalty: 0,
    });
    res.status(200).json({ result: completion.data.choices[0].text });
}

function generatePrompt(clubSummary) {
    const capitalizedQuote = clubSummary[0].toUpperCase() + clubSummary.slice(1).toLowerCase();
    return `Summarise the following text into bullet points removing the club name.
    clubSummary: Arsenal Football Club, commonly referred to as Arsenal, is a professional football club based in Islington, London, England. Arsenal plays in the Premier League, the top flight of English football. The club has won 13 league titles (including one unbeaten title), a record 14 FA Cups, two League Cups, 16 FA Community Shields, one European Cup Winners' Cup, and one Inter-Cities Fairs Cup. In terms of trophies won, it is the third-most successful club in English football.
Names: - Professional club based in Islington, London. - Plays in the Premier League. - Won 13 league titles, 14 FA Cups, two league cups, 16 FA Community Shields, one European Cup Winners' Cup, and one Inter-Cities Fairs Cup. - Third-most successful club in English football
clubSummary: ${capitalizedQuote}
Names:
    `;

}

When passing data via the form, the typeof is a string.

2

Updating this thread for anyone else’s future reference, if your code worked before but isn’t now – replace your API key and update your env with the new key

1 Like
3

Did something happen to your key? If it got shut off by OpenAI, I’d look for how it might’ve leaked. Good luck.

1 Like