programing

URL에 추가 및 새로 고침 페이지

bestprogram 2023. 9. 24. 13:04

URL에 추가 및 새로 고침 페이지

현재 URL에 매개 변수를 추가하고 페이지를 새로 고치는 자바스크립트를 작성하려고 합니다. 어떻게 해야 합니까?

해결책:

let url = window.location.href;    
if (url.indexOf('?') > -1){
   url += '&param=1'
} else {
   url += '?param=1'
}
window.location.href = url;

인정된 답변보다 짧지만, 동일한 작업을 수행하지만, 단순하게 유지합니다.

window.location.search += '&param=42';

전체 url을 변경할 필요는 없고, 위치의 검색 속성으로 알려진 쿼리 문자열만 변경할 필요가 있습니다.

검색 속성에 값을 할당할 때 브라우저에 의해 자동으로 물음표가 삽입되고 페이지가 다시 로드됩니다.

여기서 대부분의 답변은 다음 토막글이나 그와 유사한 변형과 같은 매개 변수를 URL에 추가해야 한다고 제안합니다.

location.href = location.href + "&parameter=" + value;

이것은 대부분의 경우에 상당히 효과적일 것입니다.

하지만

제 생각에는 URL에 매개 변수를 추가하는 방법이 올바르지 않습니다.

제안된 방법은 URL에 파라미터가 이미 설정되어 있는지 테스트하지 않기 때문에 주의하지 않으면 동일한 파라미터가 여러 번 반복되는 매우 긴 URL로 끝날 수 있습니다.즉:

https://stackoverflow.com/?&param=1&param=1&param=1&param=1&param=1&param=1&param=1&param=1&param=1

이 시점에서 문제가 시작됩니다.제안된 방법은 여러 페이지를 새로 고친 후 매우 긴 URL을 생성할 수 있고 생성할 수 있으므로 URL이 유효하지 않습니다.긴 URL에 대한 자세한 내용을 보려면 이 링크를 누르십시오. 다른 브라우저에서 URL의 최대 길이는 얼마입니까?

이것이 제가 제안한 방법입니다.

function URL_add_parameter(url, param, value){
    var hash       = {};
    var parser     = document.createElement('a');

    parser.href    = url;

    var parameters = parser.search.split(/\?|&/);

    for(var i=0; i < parameters.length; i++) {
        if(!parameters[i])
            continue;

        var ary      = parameters[i].split('=');
        hash[ary[0]] = ary[1];
    }

    hash[param] = value;

    var list = [];  
    Object.keys(hash).forEach(function (key) {
        list.push(key + '=' + hash[key]);
    });

    parser.search = '?' + list.join('&');
    return parser.href;
}

이 기능을 사용하면 다음 작업을 수행할 수 있습니다.

location.href = URL_add_parameter(location.href, 'param', 'value');

최신 브라우저용으로 개발하는 경우 url 매개 변수를 직접 구문 분석하는 대신 내장 함수를 사용하여 다음과 같이 작업할 수 있습니다.

const parser = new URL(url || window.location);
parser.searchParams.set(key, value);
window.location = parser.href;
location.href = location.href + "&parameter=" + value;

JS 코드의 이 줄은 (즉, 이전에) 매개변수 없이 링크를 사용합니다.'?')에 매개 변수를 추가합니다.

window.location.href = (window.location.href.split('?')[0]) + "?p1=ABC&p2=XYZ";

위 코드 라인은 두 개의 파라미터를 추가하고 있습니다.p1그리고.p2각자의 가치관을 가지고'ABC'그리고.'XYZ'(이해를 돕기 위해)

function gotoItem( item ){
    var url = window.location.href;
    var separator = (url.indexOf('?') > -1) ? "&" : "?";
    var qs = "item=" + encodeURIComponent(item);
    window.location.href = url + separator + qs;
}

더 호환되는 버전

function gotoItem( item ){
    var url = window.location.href;    
    url += (url.indexOf('?') > -1)?"&":"?" + "item=" + encodeURIComponent(item);
    window.location.href = url;
}

아래 코드를 확인해주시기 바랍니다.

/*Get current URL*/    
var _url = location.href; 
/*Check if the url already contains ?, if yes append the parameter, else add the parameter*/
_url = ( _url.indexOf('?') !== -1 ) ? _url+'&param='+value : _url+'?param='+value;
/*reload the page */
window.location.href = _url;

위의 @yyeyo의 사려깊은 답변을 위한 작은 버그 수정 하나.

변경 사항:

var parameters = parser.search.split(/\?|&/);

받는 사람:

var parameters = parser.search.split(/\?|&amp;/);

이거 먹어봐요.

var url = ApiUrl(`/customers`);
  if(data){
   url += '?search='+data; 
  }
  else
  { 
      url +=  `?page=${page}&per_page=${perpage}`;
  }
  console.log(url);

또한:

window.location.href += (window.location.href.indexOf('?') > -1 ? '&' : '?') + 'param=1'

북마크렛에서 사용할 수 있는 Shlomi 답변의 라이너 하나.

언급URL : https://stackoverflow.com/questions/5997450/append-to-url-and-refresh-page