Андрей Александров

cutl запрос делает твой сервер, а не клиент, само собой второй скрипт получает ip твоего сервера.

Ну, так вы ж можете отключить !important внутри bootstrap. Смотри $enable-important-utilities.

Если нужен пример: вот как подключается и переопределяются параметры в одном из моих проектов

добавьте поле в компонент
disabledSubmit: false

:disabled="disabledSubmit">

где-то в обработке сабмита

this.submitDisabled = true; // Перед запросом
Vue.axios.get('/info')
    .then(info => {
      this.submitDisabled = false; // Запрос выполнен
      // ...
    });

Я так понял, что основная непонятка в том, где поисковый движок берет данные?
Любой поисковый движок ищет инфу в своих индексах, которые строятся на основе данных, которые мы ему отдали. Очень грубый пример для сфинкса - например, у вас есть база с товарами и надо сделать поиск по названию и описанию. Если делать это средствами БД, то это будет что-то вроде

select id from products where name like '%search_phrase%' or description like '%search_phrase%'

(я не беру в расчет спец. средства разных бд для полнотекстового поиска). Ну и сразу понятно, что like будет выполняться адово долго. В итоге на 1 запрос у вас удйет от пары сек и до вечности.
И тут приходят поисковые движки. На примере сфинкса - скармливаем ему всю инфу о товарах (айди, название, описание). Как именно это делается зависит от типа индекса. Можно указать вообще sql запрос, который выполнит сфинкс, чтобы наполнить свой индекс. Далее он по своим алгоритмам строит индексы, оптимизированные для текстового поиска. И делаем уже выборку через него

select id from i_products where match('search_phrase')

(синтаксис примерный). И получаем айдишки найденных продуктов. В данном случае поиск выполняется очень быстро (если индекс правильно настроен) и вместо нескольких секунд получаем несколько миллисекунд.

Проверьте, чтобы в robots.txt не было запрета на *.css и *.js

getShapeParams Переписать так:

function getShapeParams() {
  var shapeParams = {};
  shapeParams = {
    radius: document.getElementsByClassName('radius')[0].value.toString(),
    x1Crd: document.getElementsByClassName('circle-x1-crd')[0].value.toString(),
    x2Crd: document.getElementsByClassName('circle-y2-crd')[0].value.toString()
  };
  console.log(shapeParams.radius);
  return shapeParams;
}

а во второй ф-ции: getShapeParams(shapeParams); заменить на var shapeParams = getShapeParams(); и все должно работать.

Ну или обявить обект shapeParams вне функций. тогда получиться так:

var shapeParams = {};
function getShapeParams() {
  shapeParams = {
    radius: document.getElementsByClassName('radius')[0].value.toString(),
    x1Crd: document.getElementsByClassName('circle-x1-crd')[0].value.toString(),
    x2Crd: document.getElementsByClassName('circle-y2-crd')[0].value.toString()
  };
  console.log(shapeParams.radius);
}

function circle() {
  var canvas = document.getElementById('canvas');
  var context = canvas.getContext('2d');

  getShapeParams();

  this.radius = shapeParams.radius;
  this.x1Crd = shapeParams.x1Crd;
  this.x2Crd = shapeParams.x2Crd;

  context.clearRect(0, 0, canvas.width, canvas.height);
  context.beginPath();
  context.arc(x1Crd, x2Crd, radius, 0, Math.PI*2, false);
  context.fillStyle = 'red';
  context.fill();
  context.lineWidth = 1;
  context.strokeStyle = 'red';
  context.stroke();
}

circle();

но первый метод полутше будет.