Как включить параметр запроса ID URL в вызов Fetch в JavaScript? - PullRequest
Новая
       36

Как включить параметр запроса ID URL в вызов Fetch в JavaScript?

1 голос
/ 24 апреля 2020

У меня есть веб-страница, которая содержит videoID в URL-ссылке (? Id = videoID). Пример моей веб-страницы:

Я хочу включить тот же videoID, что и параметр запроса, в свой запрос к моему приложению Azure Logi c. Я не слишком уверен, как включить это в текущий вызов Fetch (в моем коде ниже), который я делаю на своей веб-странице (аналогично "языкам "). В основном, при отправке формы, как мы включаем параметр запроса videoID в URL для вызова выборки?

Я пытался сделать следующее:

Ответы [ 2 ]

0 голосов
/ 24 апреля 2020

Вы можете использовать классы URL и URLSearchParams для управления параметрами. 

videoId = new URLSearchParams(window.location.search).get('id')

azure = new URL("https://prod-00.westus2.logic.azure.com:443/workflows/366b73ac2f354e2799b87db3c0241adc/triggers/manual/paths/invoke?api-version=2016-10-01&sp=%2Ftriggers%2Fmanual%2Frun&sv=1.0&sig=FdEthGEqPF7UUYf4pB69Q--ZxnZRKngXhFZnVjPxyc4")

params = azure.searchParams
params.append('videoId', videoId)

azure.searchParams = params
fetch(azure.toString(),
   // Other parameters
)
0 голосов
/ 24 апреля 2020

Обновлен handleSubmit() для получения videoId и передачи его в fetchForLanguage(): 

function handleSubmit(event) {
  event.preventDefault()
  const data = new FormData(event.currentTarget)
  const languages = data.getAll('language')
  console.info('languages selected:', languages)

  let params = new URLSearchParams(document.location.search.substring(1));
  let videoId = params.get("id"); // Video ID

  fetchForLanguages(languages, videoId)
    .then((result) => console.log('got result:', result))
}

Обновлен fetchForLanguage() для включения videoId в данные POSTed: 

function fetchForLanguages(languages, videoId) {
  console.info('starting fetch for', languages)
  return fetch("https://prod-00.westus2.logic.azure.com:443/workflows/366b73ac2f354e2799b87db3c0241adc/triggers/manual/paths/invoke?api-version=2016-10-01&sp=%2Ftriggers%2Fmanual%2Frun&sv=1.0&sig=FdEthGEqPF7UUYf4pB69Q--ZxnZRKngXhFZnVjPxyc4", { // this is my azure  provided endpoint instead
    method: 'POST',
    headers: {
      'Content-Type': 'application/json'
    },
    body: JSON.stringify({
      languages: languages,
      videoID: videoId
    })
  }).then(response => {
    if (!response.ok) {
      throw new Error(`Network response was not ok: ${response.status} ${response.statusText}`);
    }
    return response.json()
  })
}

Обратите внимание, что videoID (заглавные буквы "ID") - это ключ, который, я предполагаю, вы хотите отправить на Azure, основываясь на исходном запросе, не путайте с videoId, который является именем Javascript переменная, в которой я храню его. Я также предполагаю, что исходный входящий параметр называется id, но вы можете изменить это в handleSubmit().

...