ลบการสอบถามออกจาก URL

วิธีง่ายๆในการลบการสอบถามออกจาก Path ใน Javascript คืออะไร? ฉันเคยเห็นปลั๊กอินสำหรับ Jquery ที่ใช้ window.location.search ฉันไม่สามารถทำได้: URL ในกรณีของฉันเป็นตัวแปรที่ตั้งค่าจาก AJAX

var testURL = '/Products/List?SortDirection=dsc&Sort=price&Page=3&Page2=3&SortOrder=dsc'

วิธีง่ายๆในการรับคือ:

function getPathFromUrl(url) {
  return url.split("?")[0];
}

สำหรับผู้ที่ต้องการลบแฮช (ไม่ใช่ส่วนหนึ่งของคำถามเดิม) เมื่อไม่มีการสอบถามใดๆ ที่ต้องใช้มากกว่านั้น:

function stripQueryStringAndHashFromPath(url) {
  return url.split("?")[0].split("#")[0];
}

แก้ไข

@caub (เดิมที @crl) แนะนำคอมโบที่ง่ายกว่าซึ่งใช้ได้ทั้งกับสตริงข้อความค้นหาและแฮช (แม้ว่าจะใช้ RegExp ในกรณีที่ใครก็ตามมีปัญหา)

function getPathFromUrl(url) {
  return url.split(/[?#]/)[0];
}

การปรับปรุงครั้งที่ 2:ในความพยายามที่จะให้คำตอบที่ครอบคลุมฉันกำลังเปรียบเทียบมาตรฐานสามวิธีที่เสนอในคำตอบที่หลากหลาย

var testURL = '/Products/List?SortDirection=dsc&Sort=price&Page=3&Page2=3';
var i;

// Testing the substring method
i = 0;
console.time('10k substring');
while (i < 10000) {
    testURL.substring(0, testURL.indexOf('?'));
    i++;
}
console.timeEnd('10k substring');

// Testing the split method
i = 0;
console.time('10k split');
while (i < 10000) {
    testURL.split('?')[0]; 
    i++;
}
console.timeEnd('10k split');

// Testing the RegEx method
i = 0;
var re = new RegExp("[^?]+");
console.time('10k regex');
while (i < 10000) {
    testURL.match(re)[0]; 
    i++;
}
console.timeEnd('10k regex');

ผลลัพธ์ใน Firefox 3.5.8 บน Mac OS X 10.6.2:

10k substring:  16ms
10k split:      25ms
10k regex:      44ms

ผลลัพธ์ใน Chrome 5.0.307.11 บน Mac OS X 10.6.2:

10k substring:  14ms
10k split:      20ms
10k regex:      15ms

โปรดทราบว่าวิธีการสตริงย่อยจะด้อยกว่าในการทำงานเนื่องจากมันจะส่งกลับสตริงว่างถ้า URL ไม่ได้มีการสอบถาม อีกสองวิธีจะคืนค่า URL ตามที่คาดไว้ อย่างไรก็ตามสิ่งที่น่าสนใจคือวิธีการซับสตริงนั้นเร็วที่สุดโดยเฉพาะใน Firefox

1st UPDATE:อันที่จริงวิธีการแยก () ที่แนะนำโดย Robustoเป็นวิธีแก้ปัญหาที่ดีกว่าที่ฉันแนะนำไว้ก่อนหน้านี้เนื่องจากมันจะทำงานแม้ว่าจะไม่มีการสอบถาม:

var testURL = '/Products/List?SortDirection=dsc&Sort=price&Page=3&Page2=3';
testURL.split('?')[0];    // Returns: "/Products/List"

var testURL2 = '/Products/List';
testURL2.split('?')[0];    // Returns: "/Products/List"

คำตอบเดิม:

var testURL = '/Products/List?SortDirection=dsc&Sort=price&Page=3&Page2=3';
testURL.substring(0, testURL.indexOf('?'));    // Returns: "/Products/List"

นี่อาจเป็นคำถามเก่า แต่ฉันได้ลองวิธีนี้เพื่อลบ params แบบสอบถาม ดูเหมือนว่าจะทำงานได้อย่างราบรื่นสำหรับฉันเพราะฉันต้องการโหลดใหม่รวมกับลบ params แบบสอบถาม

window.location.href = window.location.origin + window.location.pathname;

นอกจากนี้เนื่องจากฉันใช้การดำเนินการเพิ่มสตริงอย่างง่ายฉันเดาว่าประสิทธิภาพจะดี แต่ก็ยังคุ้มค่าเมื่อเทียบกับตัวอย่างในคำตอบนี้

วิธีง่ายๆคือคุณสามารถทำได้ดังนี้

public static String stripQueryStringAndHashFromPath(String uri) {
 return uri.replaceAll(("(\\?.*|\\#.*)"), "");
}

หากคุณเข้าสู่ RegEx ....

var newURL = testURL.match(new RegExp("[^?]+"))

var path = "path/to/myfile.png?foo=bar#hash";

console.log(
    path.replace(/(\?.*)|(#.*)/g, "")
);

หากใช้ backbone.js (ซึ่งมีurl anchorเส้นทาง) url query stringอาจปรากฏขึ้น:

1. ก่อนurl anchor:

   var url = 'http://example.com?a=1&b=3#routepath/subpath';

2. หลังurl anchor:

   var url = 'http://example.com#routepath/subpath?a=1&b=3';

สารละลาย:

window.location.href.replace(window.location.search, '');
// run as: 'http://example.com#routepath/subpath?a=1&b=3'.replace('?a=1&b=3', '');

วิธีการที่ใช้มาตรฐานURL:

/**
 * @param {string} path - A path starting with "/"
 * @return {string}
 */
function getPathname(path) {
  return new URL(`http://_${path}`).pathname
}

getPathname('/foo/bar?cat=5') // /foo/bar

หากคุณจำเป็นต้องดำเนินการที่ซับซ้อนบน URL ที่คุณสามารถใช้ดูที่jQuery URL parser ปลั๊กอิน

(() => {
        'use strict';
        const needle = 'SortOrder|Page'; // example
        if ( needle === '' || needle === '{{1}}' ) { 
            return; 
        }           
        const needles = needle.split(/\s*\|\s*/);
        const querystripper = ev => {
                    if (ev) { window.removeEventListener(ev.type, querystripper, true);}
                    try {
                          const url = new URL(location.href);
                          const params = new URLSearchParams(url.search.slice(1));
                          for (const needleremover of needles) {
                                if (params.has(needleremover)) {
                                url.searchParams.delete(needleremover);
                                    window.location.href = url;
                            }
                          }     
                    } catch (ex) { }
        };          
        if (document.readyState === 'loading') {
                 window.addEventListener('DOMContentLoaded', querystripper, true);
        } else {
                 querystripper();
        }
})();

นั่นเป็นวิธีที่ฉันทำและยังรองรับ RegEx