Hapus parameter URL tanpa menyegarkan halaman

Saya mencoba menghapus semuanya setelah "?" di url browser pada dokumen siap.

Inilah yang saya coba:

jQuery(document).ready(function($) {

var url = window.location.href;
    url = url.split('?')[0];
});

Saya dapat melakukan ini dan melihatnya bekerja di bawah:

jQuery(document).ready(function($) {

var url = window.location.href;
    alert(url.split('?')[0]);
});

TL; DR

1- Untuk memodifikasi URL saat ini dan menambahkan / inject itu (URL dimodifikasi baru) sebagai URL entri baru ke daftar sejarah, penggunaan pushState:

window.history.pushState({}, document.title, "/" + "my-new-url.html");

2- Untuk mengganti URL saat ini tanpa menambahkannya ke entri riwayat, gunakan replaceState:

window.history.replaceState({}, document.title, "/" + "my-new-url.html");

3 - Bergantung pada logika bisnis Anda , pushStateakan berguna dalam kasus-kasus seperti:

• Anda ingin mendukung tombol kembali browser

• Anda ingin membuat sebuah baru URL, tambahkan / insert / mendorong URL baru untuk sejarah entri, dan membuatnya URL saat ini

• memungkinkan pengguna untuk menandai halaman dengan parameter yang sama (untuk menampilkan konten yang sama)

• untuk pemrograman mengakses dengan data yang melalui stateObjkemudian mengurai dari jangkar

Seperti yang saya mengerti dari komentar Anda, Anda ingin membersihkan URL Anda tanpa mengarahkan ulang.

Perhatikan bahwa Anda tidak dapat mengubah seluruh URL. Anda bisa mengubah apa yang muncul setelah nama domain. Ini berarti bahwa Anda tidak dapat mengubah www.example.com/tetapi Anda dapat mengubah apa yang terjadi setelahnya.com/

www.example.com/old-page-name => can become =>  www.example.com/myNewPaage20180322.php

Latar Belakang

Kita bisa menggunakan:

1- Metode pushState () jika Anda ingin menambahkan URL yang dimodifikasi baru ke entri riwayat.

2- Metode replaceState () jika Anda ingin memperbarui / mengganti entri riwayat saat ini .

.replaceState()beroperasi persis seperti .pushState()kecuali yang .replaceState() memodifikasi entri riwayat saat ini alih-alih membuat yang baru. Perhatikan bahwa ini tidak mencegah pembuatan entri baru dalam riwayat browser global.

---

.replaceState()sangat berguna ketika Anda ingin memperbarui objek negara atau URL dari entri riwayat saat ini sebagai respons terhadap beberapa tindakan pengguna.

Kode

Untuk melakukan itu saya akan menggunakan metode The pushState () untuk contoh ini yang bekerja mirip dengan format berikut:

var myNewURL = "my-new-URL.php";//the new URL
window.history.pushState("object or string", "Title", "/" + myNewURL );

Jangan ragu untuk menggantinya pushStatedengan replaceStateberdasarkan pada kebutuhan Anda.

Anda dapat mengganti paramter "object or string"dengan {}dan "Title"dengan document.titledemikian statment akhir akan menjadi:

window.history.pushState({}, document.title, "/" + myNewURL );

Hasil

Dua baris kode sebelumnya akan membuat URL seperti:

https://domain.tld/some/randome/url/which/will/be/deleted/

Untuk menjadi:

https://domain.tld/my-new-url.php

Tindakan

Sekarang mari kita coba pendekatan yang berbeda. Katakanlah Anda perlu menyimpan nama file. Nama file muncul setelah yang terakhir /dan sebelum string kueri ?.

http://www.someDomain.com/really/long/address/keepThisLastOne.php?name=john

Akan:

http://www.someDomain.com/keepThisLastOne.php

Sesuatu seperti ini akan membuatnya bekerja:

 //fetch new URL
 //refineURL() gives you the freedom to alter the URL string based on your needs. 
var myNewURL = refineURL();

//here you pass the new URL extension you want to appear after the domains '/'. Note that the previous identifiers or "query string" will be replaced. 
window.history.pushState("object or string", "Title", "/" + myNewURL );


//Helper function to extract the URL between the last '/' and before '?' 
//If URL is www.example.com/one/two/file.php?user=55 this function will return 'file.php' 
 //pseudo code: edit to match your URL settings  

   function refineURL()
{
    //get full URL
    var currURL= window.location.href; //get current address

    //Get the URL between what's after '/' and befor '?' 
    //1- get URL after'/'
    var afterDomain= currURL.substring(currURL.lastIndexOf('/') + 1);
    //2- get the part before '?'
    var beforeQueryString= afterDomain.split("?")[0];  

    return beforeQueryString;     
}

MEMPERBARUI:

Untuk satu penggemar liner, coba ini di konsol / pembakar Anda dan URL halaman ini akan berubah:

    window.history.pushState("object or string", "Title", "/"+window.location.href.substring(window.location.href.lastIndexOf('/') + 1).split("?")[0]);

URL halaman ini akan berubah dari:

http://stackoverflow.com/questions/22753052/remove-url-parameters-without-refreshing-page/22753103#22753103

Untuk

http://stackoverflow.com/22753103#22753103

Catatan: seperti yang ditunjukkan oleh Samuel Liew dalam komentar di bawah, fitur ini hanya diperkenalkan untuk HTML5.

Pendekatan alternatif sebenarnya untuk mengarahkan ulang halaman Anda (tetapi Anda akan kehilangan string kueri `? ', Apakah masih diperlukan atau data telah diproses?).

window.location.href =  window.location.href.split("?")[0]; //"http://www.newurl.com";

Ini semua menyesatkan, Anda tidak ingin menambahkan ke riwayat peramban kecuali jika Anda ingin pergi ke halaman lain dalam satu aplikasi halaman. Jika Anda ingin menghapus parameter tanpa perubahan pada halaman, Anda harus menggunakan:

window.history.replaceState(null, null, window.location.pathname);

cara sederhana untuk melakukan ini, bekerja di halaman mana saja, membutuhkan HTML 5

// get the string following the ?
var query = window.location.search.substring(1)

// is there anything there ?
if(query.length) {
   // are the new history methods available ?
   if(window.history != undefined && window.history.pushState != undefined) {
        // if pushstate exists, add a new state to the history, this changes the url without reloading the page

        window.history.pushState({}, document.title, window.location.pathname);
   }
}

Saya percaya metode terbaik dan paling sederhana untuk ini adalah:

var newURL = location.href.split("?")[0];
window.history.pushState('object', document.title, newURL);

jika saya memiliki tag khusus di akhir URL saya seperti: http://domain.com/?tag=12345 Berikut ini adalah kode di bawah ini untuk menghapus tag itu setiap kali muncul di URL:

<script>
// Remove URL Tag Parameter from Address Bar
if (window.parent.location.href.match(/tag=/)){
    if (typeof (history.pushState) != "undefined") {
        var obj = { Title: document.title, Url: window.parent.location.pathname };
        history.pushState(obj, obj.Title, obj.Url);
    } else {
        window.parent.location = window.parent.location.pathname;
    }
}
</script>

Ini memberi ide untuk menghapus satu atau lebih (atau semua) parameter dari URL

Dengan window.location.pathname Anda pada dasarnya mendapatkan semuanya sebelum '?' di url.

var pathname = window.location.pathname; // Hanya mengembalikan jalur

var url = window.location.href; // Mengembalikan URL lengkap

Saya ingin menghapus hanya satu param success. Inilah cara Anda dapat melakukan ini:

let params = new URLSearchParams(location.search)
params.delete('success')
history.replaceState(null, '', '?' + params + location.hash)

Ini juga bertahan #hash.

URLSearchParamstidak akan berfungsi pada IE, tetapi sedang dikerjakan untuk Edge . Anda bisa menggunakan polyfill atau bisa menggunakan fungsi pembantu naif untuk dukungan IE:

function take_param(key) {
    var params = new Map(location.search.slice(1).split('&')
        .map(function(p) { return p.split(/=(.*)/) }))   
    var value = params.get(key)
    params.delete(key)
    var search = Array.from(params.entries()).map(
        function(v){ return v[0]+'='+v[1] }).join('&')
    return {search: search ? '?' + search : '', value: value}
}

Ini dapat digunakan seperti:

history.replaceState(
    null, '', take_param('success').search + location.hash)

Solusi yang lebih baik:

window.history.pushState(null, null, window.location.pathname);

Tidak ada solusi yang benar-benar berfungsi untuk saya, berikut adalah fungsi yang kompatibel dengan IE11 yang juga dapat menghapus beberapa parameter:

/**
* Removes URL parameters
* @param removeParams - param array
*/
function removeURLParameters(removeParams) {
  const deleteRegex = new RegExp(removeParams.join('=|') + '=')

  const params = location.search.slice(1).split('&')
  let search = []
  for (let i = 0; i < params.length; i++) if (deleteRegex.test(params[i]) === false) search.push(params[i])

  window.history.replaceState({}, document.title, location.pathname + (search.length ? '?' + search.join('&') : '') + location.hash)
}

removeURLParameters(['param1', 'param2'])

//Joraid code is working but i altered as below. it will work if your URL contain "?" mark or not
//replace URL in browser
if(window.location.href.indexOf("?") > -1) {
    var newUrl = refineUrl();
    window.history.pushState("object or string", "Title", "/"+newUrl );
}

function refineUrl()
{
    //get full url
    var url = window.location.href;
    //get url after/  
    var value = url = url.slice( 0, url.indexOf('?') );
    //get the part after before ?
    value  = value.replace('@System.Web.Configuration.WebConfigurationManager.AppSettings["BaseURL"]','');  
    return value;     
}

Untuk menghapus semua parameter, tanpa melakukan refresh halaman, DAN jika Anda menggunakan HTML5, maka Anda dapat melakukan ini:

history.pushState({}, '', 'index.html' ); //replace 'index.html' with whatever your page name is

Ini akan menambah entri dalam riwayat browser. Anda juga dapat mempertimbangkan replaceStatejika Anda tidak ingin menambahkan entri baru dan hanya ingin mengganti entri lama.

Dalam penggunaan jquery <

window.location.href =  window.location.href.split("?")[0]

Berikut ini adalah ES6 one liner yang mempertahankan hash lokasi dan tidak mencemari riwayat browser dengan menggunakan replaceState:

(l=>{window.history.replaceState({},'',l.pathname+l.hash)})(location)