@winers
Начинающий программист

Как подключить и изменять скачанный файл JSON?

Подскажите как подключить этот API локально url = 'https://api.lever.co/v0/postings/leverdemo?group=t...'
чтобы заработал сайт ?
вот js
// Replace "leverdemo" with your own company name
url = 'https://api.lever.co/v0/postings/leverdemo?group=team&mode=json'

//url = 'https://api.lever.co/v0/postings/leverdemo?group=team&mode=json'
//Checking for potential Lever source or origin parameters
var pageUrl = window.location.href;
var leverParameter = '';
var trackingPrefix = '?lever-'

if( pageUrl.indexOf(trackingPrefix) >= 0){
  // Found Lever parameter
  var pageUrlSplit = pageUrl.split(trackingPrefix);
  leverParameter = '?lever-'+pageUrlSplit[1];
}

//Functions for checking if the variable is unspecified
function cleanString(string) {
  if (string) {
    var cleanString = string.replace(/\s+/ig, "");
    return cleanString;
  }
  else {
    return "Uncategorized";
  }
}

function nullCheck(string) {
  if (!string) {
    var result = 'Uncategorized'
    return result;
  }
  else {
    return string;
  }
}

function createJobs(_data) {
  for(i = 0; i < _data.length; i++) {

    var team = nullCheck(_data[i].title)
    var teamCleanString = cleanString(team);
    $('#jobs-container .jobs-teams').append(
        '<a href="#" class="btn '+teamCleanString+'">'+team+'</a>'
      );
  }

  for(i = 0; i < _data.length; i++) {
    for (j = 0; j < _data[i].postings.length; j ++) {
      var posting = _data[i].postings[j]
      var title = posting.text
      var description = posting.description
      //Making each job description shorter than 250 characters
      var shortDescription = $.trim(description).substring(0, 250)
      .replace('\n', ' ') + "...";
      var location = nullCheck(posting.categories.location);
      var locationCleanString = cleanString(location);
      var commitment = nullCheck(posting.categories.commitment);
      var commitmentCleanString = cleanString(commitment);
      var team = nullCheck(posting.categories.team);
      var teamCleanString = cleanString(team);
      var link = posting.hostedUrl+leverParameter;

    	$('#jobs-container .jobs-list').append(
      '<div class="job '+teamCleanString+' '+locationCleanString+' '+commitmentCleanString+'">' +
        '<a class="job-title" href="'+link+'"">'+title+'</a>' +
        '<p class="tags"><span>'+team+'</span><span>'+location+'</span><span>'+commitment+'</span></p>' +
        '<p class="description">'+shortDescription+'</p>' +
        '<a class="btn" href="'+link+'">Learn more</a>' +
      '</div>'

      );
    }
  }
}

//Creating filter buttons for sorting your jobs
function activateButtons(_data){
  $('.jobs-teams').on("click", "a", function(e) {
    e.preventDefault();
    for(i = 0; i < _data.length; i++) {
      var teamRaw = _data[i].title;
      var team = cleanString(teamRaw);
      var jobs = $(".jobs-list");if ($(this).hasClass(team)) {
        if ($(this).hasClass("active")) {
          $(this).removeClass("active");
          jobs.find(".job").fadeIn("fast");
        }
        else {
          $(".jobs-teams").find("a").removeClass("active");
          $(this).addClass("active");
          jobs.find("."+team).fadeIn("fast");
          jobs.find(".job").not("."+team).fadeOut("fast");
        }
      }
    }
  })
}

//Fetching job postings from Lever's postings API
$.ajax({
  dataType: "json",
  url: url,
  success: function(data){
    createJobs(data);
    activateButtons(data);
  }
});
  • Вопрос задан
  • 208 просмотров
Пригласить эксперта
Ответы на вопрос 1
igorvolnyi
@igorvolnyi
Веб разработчик изучающий.
URL, к которому ты пытаешься обратиться, - это так называемая конечная точка RESTful сервиса (или по-другому API) (RESTful service API endpoint). В ответ на твой запрос к тебе не файл JSON скачивается, а возвращаются данные в формате JSON. Эти данные предназначены для программы, которая их каким-либо образом будет обрабатывать и производить какие-то действия. Например в случае с указанным в вопросе URL выводить в окне браузера информацию об отделах компании (только уже в более удобоваримом для человеческого глаза виде). Программой может быть, например, вэб-фронтенд, мобильное приложение или программа, которая еще каким-либо образом обрабатывает полученные данные, скажем, преобразует и скармливает другому сервису типа агрегатора.
Так же работать с этими данными?
У каждого RESTful сервиса API должна быть документация, описывающая работу со всеми endpoints (по крайней мере, если речь идет о публичном API типа API VK).
В общих чертах каждый endpoint предназначен для одного действия с данными, которые хранятся на стороне сервиса, предоставляющего API.
Допустим, мы работем с данными об отделах в какой-нибудь компании, и эта компания предоставляет для этого API, обратиться к которому можно по адресу https://api.service.com. Это может быть простое извлечение данных (GET https://api.service.com/departments) - ответ приходит в виде списка объектов. Создание новой записи (POST https://api.service.com/departments/create) - в этом случае твоя программа должна отправить новые данные в оговоренном в документации к сервису формате; тоже, скорее всего, JSON, но еще может быть GraphQL или даже XML. Обновление существующей записи (PUT или PATCH https://api.service.com/departments/). А также удаление существующей записи (DELETE https://api.service.com/departments/).
Таким образом никакой работы с файлами JSON не происходит. Происходит обмен данными в формате JSON между разными частями приложения. В самом простом случае это frontend и backend веб приложения.
Подробнее об архитектуре RESTful можно узнать:
Архитектура REST (Хабр)
REST API Best Practices (язык русский, перевод, Хабр)
Что такое REST API (YouTube)
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
19 апр. 2024, в 17:06
15000 руб./за проект
19 апр. 2024, в 16:53
1000 руб./за проект
19 апр. 2024, в 16:45
5000 руб./за проект