En ole kirjoittanut esseetä pitkään aikaan, ja aina tuntuu, ettei minulla ole aikaa, mutta itse asiassa aika on... Riittää hölynpöly, muutama päivä sitten oli uusi vaatimus, joka vaati käyttöliittymän verkkosivua kutsumaan backend-verkkopalvelumenetelmää asynkronisesti palauttamaan tiedot. On monia tapoja toteuttaa se, tässä esimerkissä käytetään jQuery+Ajaxia, ja kun se on valmis, kaikki on ok paikallisesti debugata, mutta palvelimelle käyttöönoton jälkeen ilmenee ongelma, eikä taustapalvelukutsu vastaa, mitä oikein tapahtuu? Koodi ei ole juuri muuttunut, ainoa asia, joka on muuttunut, on jQueryn ajax-metodin URL-osoite. Voisiko ongelma olla siinä, että tarkistuksen ja virheenkorjauksen jälkeen käy ilmi, että homologinen käytäntö on virheellinen, tiedämme, että Javascrip{filtering}t tai jQuery on dynaaminen skriptaustekniikka, jota käytetään usein web-front-endin kehityksessä. Javascrip{filtering}t:ssä on tärkeä turvallisuusrajoitus, joka tunnetaan nimellä "Same-Origin Policy". Tämä käytäntö asettaa tärkeän rajoituksen sivun sisällölle, johon Javascrip{filter}t-koodi pääsee käsiksi, eli Javascrip{filtering}t voi käyttää sisältöä vain saman domain-nimen alla kuin dokumentti tai skripti, joka sen sisältää. Eri domainien skriptit eivät pääse toisiinsa, eivät edes alidomainit. Homologisen strategian osalta lukijat voivat selittää sen yksityiskohtaisemmin Baidussa, jota ei tässä toisteta.
Mutta joskus on väistämätöntä suorittaa eri toimia, ja "homologinen politiikka" on rajoitus, mitä meidän pitäisi tehdä? Katsotaanpa, miten JSONP:n verkkotunnus on toteutettu, ja keskustellaan JSONP:n ristiinalueen periaatteesta.
JSONP mainitaan tässä, sitten joku kysyi, mikä on ero ja ero sen ja JSONin välillä, katsotaanpa, Baidu-tietosanakirjassa on seuraava selitys:
JSON (Javascrip{filtering}t Object Notation) on kevyt tiedonvaihtoformaatti. Se perustuu Javascrip{filter}t:n osajoukkoon (Standard ECMA-262 3rd Edition - joulukuu 1999). JSON käyttää täysin kieliriippumatonta tekstimuotoa, mutta käyttää myös C-perheen kaltaisia tapoja (mukaan lukien C, C++, C#, Java, Javascrip, Perl, Python jne.). Nämä ominaisuudet tekevät JSON:sta ihanteellisen kielen tiedonsiirtoon. Helppo lukea ja kirjoittaa ihmisille, mutta myös helppo jäsentää ja tuottaa koneella (nopea verkkosiirto).
JSONP (JSON with padding) on JSON:n "käyttömalli", jota voidaan käyttää ratkaisemaan monitoimialueen datan saatavuuden ongelmaa valtavirran selaimissa. Saman alkuperän politiikan vuoksi sivut, jotka sijaitsevat yleensä server1.example.com:ssa, eivät voi kommunikoida palvelimien kanssa, jotka eivät ole server1.example.com, lukuun ottamatta HTML:n <scrip{filter}t>-elementtiä. Käyttäen tätä avointa strategiaa <scrip{filter}t>-elementillä, verkkosivut voivat saada JSON-dataa dynaamisesti muista lähteistä, ja tätä käyttömallia kutsutaan JSONP:ksi. JSONP:lla tallennettu data ei ole JSON, vaan mielivaltainen Javascrip{filter}t, joka suoritetaan Javascrip{filter}t-kääntäjällä, eikä JSON-jäsentäjällä.
Tässä vaiheessa on ymmärrettävä, että JSON on kevyt tiedonvaihtomuoto, kuten xml, jota käytetään kuvaamaan dataa datan välillä. JSONP on tapa käyttää JSON-dataa, ja sen sijaan, että palautettaisiin JSON-olio, se on javascrip{filtering}t-skripti, joka sisältää JSON-objektin.
Miten JSONP siis toimii? Tiedämme, että saman alkuperän politiikan rajoitusten vuoksi XmlHttpRequest sallii vain resurssipyynnöt nykyisestä lähteestä (verkkotunnus, protokolla, portti). Verkkotunnusten väliset pyynnöt eivät ole turvallisuussyistä mahdollisia, mutta havaitsimme, että kun js-tiedostoja kutsutaan verkkosivuilla, ne eivät ole vaikuttuneita verkkotunnusten välisestä tai eivät, ja tunnisteilla, joilla on "src"-attribuutti, on toimialarajat ylittäviä ominaisuuksia, kuten <scrip{filter}t>, <img>, ,<iframe>Jos haluat tehdä ristitoimialueen pyynnön, tee ristitoimialueen pyyntö käyttämällä html:n scrip{filter}t-tagia, ja palauta scrip{filtering}t-koodi, joka suoritetaan vastauksessa, jolloin voit suoraan käyttää JSON:ia javascrip{filter}t-objektin välittämiseen. Toisin sanoen JSON-datan generointi toimialueiden välisellä palvelimella ja sitten kääretään se scrip{filtering}t-skriptiksi, mikä rikkoo saman alkuperän politiikan rajoitukset ja ratkaisee monitoimialueen pääsyn ongelman.
Katsotaanpa, miten se saavutetaan:
Käyttöliittymän koodi:
|
Julkaistu 28.12.2015 14.22.00
|
|
|
