Soru URL’yi JavaScript’te kodlayın


Bir URL'yi GET dizesine yerleştirilebilecek şekilde JavaScript kullanarak güvenli bir şekilde nasıl kodlarsınız?

var myUrl = "http://example.com/index.html?param=1&anotherParam=2";
var myOtherUrl = "http://example.com/index.html?url=" + myUrl;

Ben kodlamak için gerekli olduğunu varsayalım myUrl Bu ikinci satırdaki değişken?


2126
2017-12-02 02:37


Menşei


İçine bakmayı dene encodeURI () ve decodeURI (). - Zack The Human
Görmek JavaScript urlencode işlevi. - Yanni
Bu aracı burada kullanabilirsiniz: phillihp.com/toolz/url-encode-decode - phillihp
encodeURIComponent () - Andrew


Cevaplar:


Yerleşik fonksiyona göz atın encodeURIComponent(str) ve encodeURI(str).
Senin durumunda, bu işe yarayacak:

var myOtherUrl = 
       "http://example.com/index.html?url=" + encodeURIComponent(myUrl);

2492
2017-12-02 02:43



@Cms'nin verdiği açıklama eklemeye ne dersin? escape ayrıca geçerli bir seçenektir. - hitautodestruct
@CMS'ye göre encodeURI URL kodlaması için gerçekten güvenli değildir. - Ifnot
@AnaelFavre, bunun gibi tüm karakterleri şifrelemeyi amaçladığı için, :, /, @ Bu iki yöntem birbirinin yerine kullanılamaz, doğru yöntemi kullanmak için ne kodladığınızı bilmelisiniz. - Buu Nguyen
Ayrıca bakınız developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/... ve developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/... - Michał Perłakowski
Söylendiği gibi bu sayfada başka bir cevapta, bu site Bu yöntemi kullanmanın gerekçesini güzelce detaylandırır. - Brad Parks


Üç seçeneğiniz var:

  • escape() kodlamayacak: @*/+

  • encodeURI() kodlamayacak: ~!@#$&*()=:/,;?+'

  • encodeURIComponent() kodlamayacak: ~!*()'

Ama senin durumunda, eğer geçmek istersen URL içine GET diğer sayfanın parametresi kullanmalısınız escape veya encodeURIComponent, Ama değil encodeURI.

Yığın Taşması sorusuna bakın En iyi uygulama: kaçış veya encodeURI / encodeURIComponent daha fazla tartışma için.


1373
2017-12-02 02:49



Kaçış ile kullanılan karakter kodlaması değişkendir. UTF-8 kullanan encodeURI ve encodeURIComponent ile yapıştırın. - erickson
Dikkatli ol. Bu çıkış ASCII olmayan karakterleri Unicode çıkış dizilerine dönüştürür, %uxxx. - opteronn
Ben encodeURIComponent kullanıyorum ve boru karakterlerini kodlamayacağını fark ettim | - kevzettler
Kevzettler - bunu neden yapmalı? Borular URI'de anlamsal bir öneme sahip değildir. - nickf
@GiovanniP: Almanca, Fransızca, Japonca, Çince, Arapça karakterleri girdi olarak alan ve GET veya POST yoluyla bu parametreleri geçiren kişiler. - Tseng


İle sopa encodeURIComponent(). İşlev encodeURI() URL'lerde anlamsal öneme sahip birçok karakteri (örneğin, "#", "?" ve "&") kodlamakla uğraşmaz. escape() kullanımdan kaldırılır ve sunucuda kodlanmış boşluklar olarak yorumlanacak olan "+" karakterlerini kodlamakla uğraşmaz (ve burada diğerlerinin işaret ettiği gibi, ASCII olmayan karakterleri düzgün bir şekilde kodlamaz).

Güzel bir şey var arasındaki farkın açıklaması encodeURI() ve encodeURIComponent() Başka yerde. Bir şeyi, bir URI'nin bileşeni olarak güvenli bir şekilde dahil edilebilecek şekilde kodlamak istiyorsanız (ör. Sorgu dizesi parametresi olarak), kullanmak istediğiniz encodeURIComponent().


157
2018-05-29 23:54





Şahsen, çok sayıda API'nın "+" ile değiştirmek istediğini buldum, bu yüzden aşağıdakileri kullanıyorum:

encodeURIComponent(value).replace(/%20/g,'+');

escape farklı tarayıcılarda farklı şekilde uygulanır ve encodeURI bir URI'de işlevsel olan karakterlerin çoğunu (# ve hatta / gibi) kodlamaz - bu, onu tam olarak URI / URL'de kırılmadan kullanılır.

NOT: EncodeURIComponent öğesini değerler sorgu dizesinin (alanlar / değer adları değil ve kesinlikle URL'nin tamamı değil). Başka bir şekilde yaparsanız, =,?, & Gibi karakterleri kodlamaz, muhtemelen sorgu dizginizi açıkta bırakır.

Örnek:

const escapedValue = encodeURIComponent(value).replace(/%20/g,'+');
const url = 'http://example.com/?myKey=' + escapedValue;

66
2017-12-15 08:47



Lütfen, ilk soru işaretinden (URL'nin 'sorgu' kısmı olan) sonra yalnızca% 20 ile + sembolleri değiştirmeniz gerektiğini unutmayın. Diyelim ki göz atmak istiyorum http://somedomain/this dir has spaces/info.php?a=this has also spaces. Bu dönüştürülmelidir: http://somedomain/this%20dir%20has%spaces/info.php?a=this%20has%20also%20spacesAncak birçok uygulama, querystring'de '%' ile değiştirilmesine izin verir. Bununla birlikte, URL'nin yol bölümünde '% 20' yerine '+' ile değiştiremezsiniz. Bu, bir dizininiz olmadığı sürece Not Bulunamadı hatasıyla sonuçlanacaktır. + bir boşluk yerine. - Jochem Kuijpers
@Jochem Kuijpers, kesinlikle bir dizine "+" koymazdın. Bunu yalnızca sorgu parametresi değerlerinin kendilerine (veya gerekirse anahtarlara), URL'nin tamamını değil, hatta tüm sorgu dizesini de uygulayabilirim. - Ryan Taylor
Kodlamanın sonucundan çok değer yerine geçerdim - njzk2
@ njzk2 maalesef encodeURIComponent('+') sana verecek %2BBu yüzden, iki normal ifadeyi kullanmanız gerekecek ... ki bunun neden bu kadar işe yaradığını sanıyorum, çünkü '+', '' sonunda farklı şekilde kodlanmıştır. - Ryan Taylor


Eğer jQuery kullanıyorsanız ben giderdim $.param yöntem. URL, bir nesne eşleme alanlarını, değerlerin her birinde bir kaçış yöntemini çağırmaktan daha kolay olan değerlere kodlar.

$.param({a:"1=2", b:"Test 1"}) // gets a=1%3D2&b=Test+1

35
2018-05-13 03:32



Sağlanan örnek yeterli olduğunu düşünüyorum. $ .Param hakkında daha fazla bilgiye ihtiyacınız varsa api.jquery.com/jquery.param - Maksym Kozlenko
Hemen hemen herkes jQuery kullanıyor ve ben bunun yerine encoreURIComponent ile daha rahat hissediyorum - Cyril Duchon-Doris


Daha önce de belirtildiği gibi bir URL'yi kodlamak için iki fonksiyonunuz vardır:

encodeURI()

ve

encodeURIComponent()

Her ikisinin de sebebi, ilk önce URL'yi, çok fazla şeyi çıkışsız bırakma riskiyle korurken, ikincisi gereken her şeyi kodlar.

İlk olarak, yeni çıkan URL'yi adres çubuğuna kopyalayabilirsiniz (örneğin) ve işe yarayacaktı. Ancak, unescaped '&' ler alan sınırlayıcılarını etkileyecek, '=' ler alan adlarını ve değerlerini etkileyecek ve '+' ler boşluklara benzeyecekti. Ancak, basit veriler için kaçtığınız şeyin URL yapısını korumak istediğinizde bu çalışır.

İkincisi, dizinizde hiçbir şeyin bir URL ile etkileşmediğinden emin olmak için yapmanız gereken her şeydir. Çeşitli önemsiz karakterleri ayrılmadan bırakır, böylece URL etkileşimli olarak mümkün olduğunca insan tarafından okunabilir kalır. Bu şekilde kodlanmış bir URL artık bir URL olarak görüntülenmeyecek.

Bu yüzden zaman alabilirseniz, her zaman kod / değer çiftlerini eklemeden önce, bu işlevi kullanarak sorgu dizisine eklemeden önce hem ismi hem de değeri kodlamadan önce encodeURIComponent () öğesini kullanmak istersiniz.

Ben encodeURI () kullanmak için nedenlerle gelen zor bir zaman yaşıyorum - daha akıllı insanlara bırakacağım.


8
2018-01-26 21:31





encodeURIComponent () yoludur.

var myOtherUrl = "http://example.com/index.html?url=" + encodeURIComponent(myUrl);

ANCAK php sürümü urlencode () 'dan küçük bir fark olduğunu ve @CMS'nin de belirttiği gibi her bir karakteri kodlamayacağını unutmayın. Çocuklar http://phpjs.org/functions/urlencode/ js phpencode'a eşdeğerdir ():

function urlencode(str) {
  str = (str + '')
    .toString();

  // Tilde should be allowed unescaped in future versions of PHP (as reflected below), but if you want to reflect current
  // PHP behavior, you would need to add ".replace(/~/g, '%7E');" to the following.
  return encodeURIComponent(str)
    .replace(/!/g, '%21')
    .replace(/'/g, '%27')
    .replace(/\(/g, '%28')
    .
  replace(/\)/g, '%29')
    .replace(/\*/g, '%2A')
    .replace(/%20/g, '+');
}

7
2017-10-01 08:03





Normal javascript ile denedim benzer bir şey

function fixedEncodeURIComponent(str){
     return encodeURIComponent(str).replace(/[!'()]/g, escape).replace(/\*/g, "%2A");
}

4
2018-01-05 18:49





Çift kodlamayı önlemek için, kodlamayı kodlamadan önce kod çözmenin iyi bir fikri vardır (örneğin, önceden girilmiş olan URL'leri girmiş olan kullanıcılarla ilgileniyorsanız).

Gidelim abc%20xyz 123 giriş olarak (bir alan zaten kodlanmış):

encodeURI("abc%20xyz 123")            //   wrong: "abc%2520xyz%20123"
encodeURI(decodeURI("abc%20xyz 123")) // correct: "abc%20xyz%20123"

3
2018-06-22 03:28





Benim için hiçbir şey işe yaramadı. Gördüğüm tek şey giriş sayfasının HTML'siydi, müşteri koduyla kod 200'e geri döndü. (302 başlangıçta aynı Ajax isteği yükleme giriş sayfası, başka bir Ajax isteğinde, yükleme düzleminden ziyade bir yönlendirme olması gerekiyordu. giriş sayfasının metni).

Giriş kontrol cihazında bu satırı ekledim:

Response.Headers["land"] = "login";

Ve global Ajax işleyicisinde şunu yaptım:

$(function () {
    var $document = $(document);
    $document.ajaxSuccess(function (e, response, request) {
        var land = response.getResponseHeader('land');
        var redrUrl = '/login?ReturnUrl=' + encodeURIComponent(window.location);
        if(land) {
            if (land.toString() === 'login') {
                window.location = redrUrl;
            }
        }
    });
});

Şimdi hiçbir sorunum yok ve çekicilik gibi çalışıyor.


2
2017-09-10 06:41