페이지를 새로 고치지 않고 URL 변수 제거

페이지를 새로 고치지 않고 URL 변수 제거

---

"?"뒤에있는 모든 것을 강화합니다. 문서의 브라우저 URL에서 준비되었습니다.

여기 내가 시도하는 것이 있습니다.

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

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

나는 아래에서 작동하는 것을 볼 수 있습니다.

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

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

---

TL; DR

1 광고 수정 현재 URL 및 삽입 / 추가 그것 (새로운 수정 된 URL) 기록 목록, 사용에 새로운 URL 항목으로 pushState:

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

2 현재 URL 을 히스토리 항목에 추가하지 않고 바꾸 려면 다음을 사용하십시오 .replaceState

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

3 따라 귀하의 비즈니스 로직 유용 , pushState다음과 같은 경우에 할 것입니다 :

• 브라우저의 뒤로 버튼 을 지원하고 싶습니다

• 새 URL 을 작성 하고 , 새 URL 을 히스토리 항목에 추가 / 삽입 / 푸시하고 현재 URL로 설정하려는 경우

• 사용자가 구독하는 변수를 사용하여 페이지 를 책갈피로 지정 (같은 내용을 표시)

• 방식 프로그래밍 으로 데이터 를 액세스 하여 앵커에서 파싱stateObj

---

귀하의 의견에서 알 수 있습니다. 다시 리디렉션하지 않고 URL을 정리하고 싶습니다.

전체 URL은 없습니다. 도메인 이름 설명 발표 내용 수 있습니다. 즉, 설명 수는 없지만 www.example.com/이후에 나오는 내용은 설명 수 있습니다..com/

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

배경

우리는 사용할 수 있습니다 :

1- 히스토리 항목에 새로운 수정 된 URL을 추가하려는 경우 pushState () 메소드 .

2- 현재 기록 항목 을 업데이트 / 대체하려는 경우 replaceState () 메소드 .

.replaceState()현재 기록 항목을 새로 작성하는 대신 수정하는.pushState() 것을 제외하고 는 정확히 작동합니다 . 이렇게해도 전역 브라우저 기록에 새 항목을 만들 수는 없습니다..replaceState()

---

.replaceState()user-조치에 일부, 대한 응답으로 현재 히스토리 항목 의 상태 오브젝트 또는 URL 을 업데이트 하려는 경우 특히 유용 합니다.

---

암호

이를 위해 다음 예제와 유사하게 작동하는이 예제에 pushState () 메소드 를 사용 합니다.

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

자유롭게 대체 pushState과 replaceState요구 사항에 따라.

paramter "object or string"를 {}및 "Title"로 document.title바꾸면 최종 문장이 다음 과 같이됩니다.

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

---

결과

앞의 두 줄의 코드는 다음과 같은 URL을 만듭니다.

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

되기 위해 :

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

---

동작

이제 다른 시도를 시도해 봅시다. 파일 이름을 유지해야 가정하십시오. 파일 이름은 마지막 /및 쿼리 앞에옵니다 ?.

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

될거야 :

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

이와 같은 작동하게됩니다.

 //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;     
}

---

최신 정보 :

한 라이너 팬의 경우, 콘솔 / 파이어 버그에서 시도하면이 페이지 URL이 변경됩니다.

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

이 페이지 URL은 다음에서 변경됩니다.

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

에

http://stackoverflow.com/22753103#22753103

---

참고 : 로 사무엘 Liew는 아래 의 의견에, 기능 만 도입했습니다 HTML5.

다른 방법은 실제로 페이지를 리디렉션하는 것입니다 (그러나 쿼리 문자열`? '이 손실됩니다. 여전히 필요합니까 아니면 데이터가 처리 되었습니까?).

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

---

---

이는 모두 오해의 소지가 있으므로 단일 페이지 앱에서 다른 페이지로 이동하지 않는 한 브라우저 기록에 추가하고 싶지 않습니다. 페이지를 변경하지 않고 매개 변수를 제거하려면 다음을 사용해야합니다.

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

---

이 작업을 수행하는 간단한 방법은 모든 페이지에서 작동하며 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);
   }
}

---

나는 이것에 대한 가장 좋고 간단한 방법을 믿습니다.

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

---

URL 끝에 다음 과 같은 특수 태그가있는 경우 : http://domain.com/?tag=12345 다음은 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>

이는 URL에서 하나 이상의 (또는 모든) 매개 변수를 제거하는 아이디어를 제공합니다.

window.location.pathname 을 사용 하면 기본적으로 '?' URL에서.

var pathname = window.location.pathname; // 경로 만 반환

var url = window.location.href; // 전체 URL 반환

---

더 나은 솔루션 :

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

---

하나의 매개 변수 만 제거하고 싶었습니다 success. 이를 수행하는 방법은 다음과 같습니다.

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

이것도 #hash.

---

URLSearchParamsIE에서는 작동하지 않지만 Edge에서는 작동합니다 . 당신은 할 수 polyfill을 사용 하거나이 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}
}

다음과 같이 사용할 수 있습니다.

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

---

이러한 솔루션 중 어느 것도 나를 위해 실제로 효과가 없었습니다. 여기에 여러 매개 변수를 제거 할 수도있는 IE11 호환 기능이 있습니다.

/**
* 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'])

---

페이지를 새로 고치지 않고 모든 매개 변수를 지우고 HTML5를 사용하는 경우 다음을 수행 할 수 있습니다.

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

그러면 브라우저 기록에 항목이 추가됩니다. replaceState새 항목을 추가하지 않고 이전 항목 만 바꾸려는 경우 에도 고려할 수 있습니다 .

---

//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;     
}

---

다음은 위치 해시를 보존하고 replaceState다음 을 사용하여 브라우저 기록을 오염시키지 않는 ES6 one liner입니다 .

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

---

jquery에서 <

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

참고 URL : https://stackoverflow.com/questions/22753052/remove-url-parameters-without-refreshing-page