Unexpected result when sending a prompt containing HTML code to OpenAI API

Question

I try to send a prompt containing raw text and HTML code in order to fix spelling errors.

E.g. a prompt would be:

fix spelling and grammar in the following html code
<p>this is som txt which needs to b fixed.<p>

But when I submit this prompt to the API via Javascript (see the code below) the only thing I receive as a response is this:

```html

The same prompt works fine when using Chat-GPT's web page. The response is:

<p>This is some text which needs to be fixed.</p>

What am I doing wrong?

Here's the code I'm using:

    const prompt = 'fix spelling and grammar in the following html code\n\n<p>this is som txt which needs to b fixed.<p>';
    
    const response = await fetch(url, {
        method: 'POST',
        headers: {
            'Authorization': bearer,
            'Content-Type': 'application/json'
        },
        body: JSON.stringify({
            temperature: 1,
            top_p: 1,
            n: 1,
            stream: true,
            logprobs: null,
            stop: '\n',
            model: 'gpt-4o',
            messages: [
                { "role": "user", "content": prompt }
            ]
        }),
        signal: controller.signal
    });
    
    const reader = response.body.getReader();
    const decoder = new TextDecoder("utf-8");
    
    let result = '';
    
    while (true) {
        const { done, value } = await reader.read();
        if (done) {
            break;
        }
        // Massage and parse the chunk of data
        const chunk = decoder.decode(value);
        const lines = chunk.split("\n");
        const parsedLines = lines
            .map((line) => line.replaceAll(/^data: /gi, "").trim()) // Remove the "data: " prefix
            .filter((line) => line !== "" && line !== "[DONE]") // Remove empty lines and "[DONE]"
            .map((line) => JSON.parse(line)); // Parse the JSON string
    
        for (const parsedLine of parsedLines) {
            const { choices } = parsedLine;
            const { delta } = choices[0];
            const { content } = delta;
            // Update the UI with the new content
            if (content) {
                console.log("Content: " + content);
                result += content;
            }
        }
    }
    console.log('Result:\n' + result);

``

Answer 1

I finally found it out. The error was the stop param which caused the API to stop generating tokens.

Furthermore, I simplified the code for better readability. This code works:

const prompt = 'fix spelling and grammar in the following html code\n\n<p>this is som txt which needs to b fixed.<p>';
const response = await fetch(url, {
    method: 'POST',
    headers: {
        'Content-Type': 'application/json',
        'Authorization': bearer
    },
    body: JSON.stringify({
        model: 'gpt-4o',
        messages: [{ role: "user", content: prompt }],
        stream: true
    })
});

// Read the response as a stream of data
const reader = response.body.getReader();
const decoder = new TextDecoder("utf-8");
result = "";

while (true) {
    const { done, value } = await reader.read();
    if (done) {
        break;
    }
    // Massage and parse the chunk of data
    const chunk = decoder.decode(value);
    const lines = chunk.split("\n");
    const parsedLines = lines
        .map((line) => line.replace(/^data: /gi, "").trim()) // Remove the "data: " prefix
        .filter((line) => line !== "" && line !== "[DONE]") // Remove empty lines and "[DONE]"
        .map((line) => JSON.parse(line)); // Parse the JSON string

    for (const parsedLine of parsedLines) {
        const { choices } = parsedLine;
        const { delta } = choices[0];
        const { content } = delta;
        // Update the UI with the new content
        if (content) {
            result += content;
            appendText(content);
        }
    }
}