it-swarm.com.ru

как получить базовый URL в JavaScript

Я создаю веб-сайт с CodeIgniter , у меня есть различные ресурсы, которые я загружаю с помощью base_url вспомогательной функции, как это 

<link rel="stylesheet" type="text/css" href="'.base_url('assets/css/themes/default.css').'" id="style_color"/>

который производит (то есть www.mysite.com)

<link rel="stylesheet" type="text/css" href="http://www.mysite.com/assets/css/themes/default.css" id="style_color"/>

Затем я могу поменять этот ресурс с другим в JavaScript, как это

$('#style_color').attr("href", "assets/css/themes/" + color_ + ".css");

получается, что он попытается загрузить ресурс, не используя абсолютный путь, сгенерированный php, поэтому я решил добавить фиктивный тег на каждую страницу с php следующим образом

<div id="base_url" class="'.base_url().'"></div>

Затем я изменил строку JavaScript

$('#style_color').attr("href", $('#base_url').attr("class") + "assets/css/themes/" + color_ + ".css");

это работает, но выглядит не совсем элегантно, поэтому я был бы признателен за любую помощь о том, как, возможно, сгенерировать этот базовый URL из JavaScript или любого другого решения, спасибо :)


Я предпочел решение только на Javascript, и поскольку я использую CodeIgniter , переменная document.base_url с сегментами URL от protocol до index.php казалась удобной

document.base_url = base_url('index.php');

с функцией base_url() будучи

function base_url(segment){
   // get the segments
   pathArray = window.location.pathname.split( '/' );
   // find where the segment is located
   indexOfSegment = pathArray.indexOf(segment);
   // make base_url be the Origin plus the path to the segment
   return window.location.Origin + pathArray.slice(0,indexOfSegment).join('/') + '/';
}
33
Nehemias Herrera

Базовый URL в JavaScript

Вы можете легко получить доступ к текущему URL в JavaScript с помощью window.location

У вас есть доступ к сегментам этого URL через этот объект locations. Например:

// This article:
// https://stackoverflow.com/questions/21246818/how-to-get-the-base-url-in-javascript

var base_url = window.location.Origin;
// "http://stackoverflow.com"

var Host = window.location.Host;
// stackoverflow.com

var pathArray = window.location.pathname.split( '/' );
// ["", "questions", "21246818", "how-to-get-the-base-url-in-javascript"]

В Chrome Dev Tools вы можете просто ввести window.location в своей консоли, и он вернет все доступные свойства.


Дальнейшее чтение доступно на этот поток переполнения стека

111
chantastic

Одним из способов является использование тега script для импорта переменных, которые вы хотите, в ваши представления:

<script type="text/javascript">
window.base_url = <?php echo json_encode(base_url()); ?>;
</script>

Здесь я обернул base_url с помощью json_encode, чтобы он автоматически переводил любые символы в допустимый Javascript. Я поместил base_url в глобальное окно, чтобы вы могли использовать его где угодно, просто вызвав base_url, но не забудьте поставить тег script над любым Javascript, который его вызывает. С вашим приведенным примером:

...
$('#style_color').attr("href", base_url + "assets/css/themes/" + color_ + ".css");
7
sean

Это делается просто с помощью этой переменной.

var base_url = '<?php echo base_url();?>'

Это будет иметь базовый URL сейчас. А теперь создайте функцию javascript , Которая будет использовать эту переменную

function base_url(string){
    return base_url + string;
}

И теперь это всегда будет использовать правильный путь.

var path    =   "assets/css/themes/" + color_ + ".css"
$('#style_color').attr("href", base_url(path) );
4
Muhammad Raheel
var baseTags = document.getElementsByTagName("base");
var basePath = baseTags.length ? 
    baseTags[ 0 ].href.substr( location.Origin.length, 999 ) : 
    "";
3
goofballLogic

Вы можете заставить PHP и JavaScript работать вместе, сгенерировав следующую строку в каждом шаблоне страницы:

<script>
document.mybaseurl='<?php echo base_url('assets/css/themes/default.css');?>';
</script>

Затем вы можете ссылаться на document.mybaseurl в любом месте вашего JavaScript. Это избавляет вас от некоторой отладки и сложности, потому что эта переменная всегда согласуется с вычислением PHP.

2
Schien

Базовый URL в JavaScript

Вот простая функция для вашего проекта, чтобы получить базовый URL в JavaScript.

// base url
function base_url() {
    var pathparts = location.pathname.split('/');
    if (location.Host == 'localhost') {
        var url = location.Origin+'/'+pathparts[1].trim('/')+'/'; // http://localhost/myproject/
    }else{
        var url = location.Origin; // http://stackoverflow.com
    }
    return url;
}
1
hsn0331

Я могу опоздать, но для всех гиков будущего. Во-первых, я полагаю, вы хотите вызвать base_url в вашем файле .js. так что давайте рассмотрим, как вы это называете в примере файла .js ниже

sample.js  

var str = $(this).serialize(); 

jQuery.ajax({
type: "POST",
url: base_url + "index.php/sample_controller",
dataType: 'json',
data: str,
success: function(result) {
alert("Success");
}

В приведенном выше примере base_url не назначен. Поэтому код не будет работать должным образом. Но наверняка вы будете вызывать .js между <head></head> или <body></body>of View, используя тег <script> </script>. Таким образом, чтобы вызвать base_url in.js файл, мы должны написать следующий код, где вы планируете вызвать .js файл. Кроме того, рекомендуется создать общий заголовочный файл и поместить в него приведенный ниже код и все файлы таблиц стилей вызова (.css) и javascript (.js). так же, как приведенный ниже пример.

общий заголовочный файл

<head>

<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro|Open+Sans+Condensed:300|Raleway' rel='stylesheet' type='text/css'>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

<link rel="stylesheet" type="text/css" href="<?php echo base_url(); ?>assets/js/sample.js">

<script>
  var base_url = '<?php echo base_url(); ?>';  
</script>


</head>

Теперь base_url будет работать и в файле sample.js. Надеюсь, это помогло.

0
Jeeva

Чтобы получить то же самое, что и base_url из codeigniter, вы можете сделать:

var base_url = window.location.Origin + '/' + window.location.pathname.split ('/') [1] + '/';

это будет более полезно, если вы работаете с чистым файлом Javascript.

0
Saddam

в resources/views/layouts/app.blade.php file

<script type="text/javascript">
    var baseUrl = '<?=url('');?>';
</script>
0
Pasindu Jayanath