I figure it out to get dynamic url in the front end if I need I can simply define mage/url and the use it as url.build('<Modulename>/<controllername>/<action>/')
When I tried the same thing for the backend it didn't return me the expected result.
It gave the the current url and append the path which I had given.
Can anyone explain how this works out. Do I need to define the baseUrl somewhere ?
Thanks to Khoa for his explanation what I wanted to achieve is in my admin form I am calling an external url with ajax. I was using a static path so I wanted it dynamically. So here's what I have done.
My Layout XML File
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<body>
<referenceContainer name="content">
<uiComponent name="namespace_modulename_form"/>
<block class="Namespace\Modulename\Block\Adminhtml\Edit" name="edit" template="Namespace_Modulename::edit.phtml" />
</referenceContainer>
</body>
</page>
Layout Phtml File I defined the baseUrl.
<script>
require([
'mage/url'
], function(url) {
return url.setBaseUrl('<?php /* @escapeNotVerified */ echo $block->getAdminBaseUrl();?>');
})
</script>
My block file which returns the base url
<?php
namespace Namespcae\Modulename\Block\Adminhtml;
class Edit extends \Magento\Framework\View\Element\Template
{
protected $_configReader;
public function __construct(
\Magento\Framework\View\Element\Template\Context $context,
\Magento\Framework\App\DeploymentConfig\Reader $configReader
) {
$this->_configReader = $configReader;
parent::__construct($context);
}
public function getAdminBaseUrl(){
$config = $this->_configReader->load();
$adminSuffix = $config['backend']['frontName'];
return $this->getBaseUrl() . $adminSuffix . '/';
}
}
Now in my js files I can use it as.
define([
'Magento_Ui/js/form/element/abstract',
'mage/url'
], function (Abstract, url) {
'use strict';
return Abstract.extend({
url.build('namespace_module/controllername/action/');
});
});
Just Do That Only in js file
define(['mage/url'],
function (url) {
'use strict';
var url = url.build('<modulename>/<controllername>/<actionname>');
});
Result will be:
http://ip_address/<modulename>/<controllername>/<actionname>
The most important thing we need to know: We need to set base url for url.build('<Modulename>/<controllername>/<action>/'):
lib/web/mage/url.js
setBaseUrl: function (url) {
baseUrl = url;
},
build: function(path) {
if (path.indexOf(baseUrl) != -1) {
return path;
}
return baseUrl + path;
}
Basically, there are two places where to set the base url:
vendor/magento/module-checkout/view/frontend/templates/onepage.phtml
vendor/magento/module-checkout/view/frontend/templates/cart/shipping.phtml
return url.setBaseUrl('<?php /* @escapeNotVerified */ echo $block->getBaseUrl();?>');
So, in your admin, you have to set the admin base url.
