Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

416
Visualizações
How can I load the openai api configuration through js in html?

I am trying to send a request through js in my html so that openai analyzes it and sends a response, but if in the js I put the following:

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

const configuration = new Configuration({
apiKey: "sk-0000000000000ZXXXXXXXXXXXXXX",
});
const openai = new OpenAIApi(configuration);

async function test() {
console("test")
const response = await openai.createCompletion("text-davinci-002", {
prompt: "hello",
temperature: 0.7,
max_tokens: 64,
top_p: 1,
frequency_penalty: 0,
presence_penalty: 0,
});
console.log(response)
}
test();

return console these error

Uncaught ReferenceError: require is not defined
at buttons.js:94:38

I have tried to install it with node.js and it works fine but I don't know how to make it work in my own html

about 4 years ago · Juan Pablo Isaza
1 Respostas
Responde à pergunta

0

It took me a little while to figure this out.

  1. Go to https://beta.openai.com/playground and choose the settings you want.
  2. Then, click "View code" in the top right.
  3. Select "curl" as the code type you want to view.
  4. Copy the "curl" code.
  5. Go to: https://reqbin.com/req/javascript/c-wyuctivp/convert-curl-to-javascript.
  6. Convert the code from "curl" to "javascript/AJAX". This will change it from "curl" to a javascript/AJAX XMLHttpRequest.

Use the javascript as you would normally. The code will console log the response. You can change that to use the response in some other way in your code.

Tested and working examples (You could just adjust these examples to meet your needs):

Regular prompt:

let open_ai_response;

openai_test();

async function openai_test() {
  
  var url = "https://api.openai.com/v1/engines/text-davinci-002/completions";

  var xhr = new XMLHttpRequest();
  xhr.open("POST", url);

  xhr.setRequestHeader("Content-Type", "application/json");
  xhr.setRequestHeader("Authorization", "Bearer YOUR_OPEN_AI_KEY_GOES_HERE");

  xhr.onreadystatechange = function () {
     if (xhr.readyState === 4) {
        console.log(xhr.status);
        console.log(xhr.responseText);
        open_ai_response = xhr.responseText;
        console.log(open_ai_response);
     }};

  var data = `{
    "prompt": "YOUR TEXT HERE.",
    "temperature": 0.7,
    "max_tokens": 256,
    "top_p": 1,
    "frequency_penalty": 0.75,
    "presence_penalty": 0
  }`;

  xhr.send(data);
}

Using variables for the prompt:

let open_ai_response;

openai_test();

async function openai_test() {
  
  var prompt_text = "YOUR TEXT HERE."
  var prompt_text2 = "MORE TEXT HERE."
  
  var url = "https://api.openai.com/v1/engines/text-davinci-002/completions";

  var xhr = new XMLHttpRequest();
  xhr.open("POST", url);

  xhr.setRequestHeader("Content-Type", "application/json");
  xhr.setRequestHeader("Authorization", "Bearer YOUR_OPEN_AI_KEY_GOES_HERE");

  xhr.onreadystatechange = function () {
     if (xhr.readyState === 4) {
        console.log(xhr.status);
        console.log(xhr.responseText);
        open_ai_response = xhr.responseText;
        console.log(open_ai_response);
     }};

  var data = `{
    "prompt": "${prompt_text + prompt_text2}",
    "temperature": 0.7,
    "max_tokens": 256,
    "top_p": 1,
    "frequency_penalty": 0.75,
    "presence_penalty": 0
  }`;

  xhr.send(data);
}

about 4 years ago · Juan Pablo Isaza Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda