Holen Sie sich die Basis-URL aus der JS-Datei

9

Ich möchte eine Basis-URL abrufen und sie mit meinem Modul-Controller-Link aus der .js-Datei anhängen, daher ist es unmöglich, Block zu verwenden, um die Basis-URL abzurufen. Bisher habe ich das getan:

define([
   'jquery',
   'mage/url'
], function ($,url) { 

  var linkUrl = url.build('namespace_module/regions/index');
  console.log(linkUrl);
});

aber ich habe nur dieses Ergebnis bekommen:

Namespace-Modul / Regionen / Index

einfacher Kerl
quelle

Antworten:

19
define([
   'jquery',
   'mage/url'
], function ($,url) { 

  var linkUrl = url.build('frontname/regions/index');
  console.log(linkUrl);
});

Wobei Frontname der Routenname der Datei route.xml ist.

Sie müssen Ihren Frontnamen aus der Datei route.xml anstelle des Modulnamens (namespace_module) übergeben.

Sie können Ihre Datei route.xml unter nachschlagen app/code/Namespace/Module/etc/frontend/routes.xml

Rakesh Jesadiya
quelle
4
Es funktioniert bei mir nicht, es gibt 'routename / controller / action' in der admin js Datei zurück.
Kapil Yadav
2
Hallo Rakesh, es funktioniert gut im Frontend, aber was ist mit dem Backend? Ich habe damit keine Basis-URL im Backend erhalten.
Dharmendra Jadav
1
@DharmendraJadav rakeshjesadiya.com/base-url-in-js-file-backend-area-magento-2 Backend-Bereich überprüfen.
Rakesh Jesadiya
4

Ich bin nicht sicher, was Sie tun, aber ich denke, Sie sollten die URL an js (Widget) übergeben.
Die URL ist der Parameter des js-Widgets. Fügen
Sie das Skript unten in Ihre Vorlage ein, wo Sie möchten

<script type="text/x-magento-init">
{
    "*": {
        "Magento_Ui/js/core/app": {
            "components": {
                "yourWidget": {
                    "dataUrl": "<?php echo $block->getBaseUrl(); ?>"
                }
            }
        }
    }
}
</script>

Im Javascript-Widget können Sie auf dataUrl zugreifen

define(['uiComponent'], function(Component) {
    'use strict';

    return Component.extend({
        initialize: function() {
            console.log(this.dataUrl);
        }
    });
});

Ein anderer Ansatz

<script>
window.testUrl = <?php echo json_encode($block->getBaseUrl()); ?>
</script>

In Ihren benutzerdefinierten js können Sie einfach auf die globale Variable window.testUrl zugreifen

mrtuvn
quelle
Dies ist besser, weil irgendwann die JS-Version Fehler
CompactCode
3

Fügen Sie diesen Code in die HTML-Datei ein:

<input type="hidden" value="<?php echo $this->getUrl(); ?>" id="baseUrl"/>

Jetzt können Sie diese Basis-URL in der js-Datei anhand der ID verwenden:

$("#baseUrl").val();

Dies kann nützlich sein. Ich überprüfe es auch und es funktioniert.

Rohan Hapani
quelle
3

Sie können die baseUrl aus der globalen js-Variablen BASE_URL abrufen und verwenden, indem Sie die baseUrl aus dem Modul mage / url festlegen.

define([
   'jquery',
   'mage/url'
], function ($, url) { 
  url.setBaseUrl(BASE_URL);
  var link = url.build('foo/bar');

  console.log(link); // https://magento.com/foo/bar
});

Dies gibt die absolute URL zurück.

Rick Daalhuizen
quelle
Dies war eigentlich eine ziemlich hilfreiche Ergänzung zu der akzeptierten Antwort :) Danke
gabtzi