renovations

This commit is contained in:
Ilya Kantor 2015-02-22 20:57:08 +03:00
parent 13e6f9383f
commit d1b484913a
6 changed files with 37 additions and 20 deletions

View file

@ -326,7 +326,7 @@ xhr.ontimeout = function() {
Кросс-браузерно: Кросс-браузерно:
```js ```js
var XHR = window.XDomainRequest || XMLHttpRequest; var XHR = ("onload" in new XMLHttpRequest()) ? XMLHttpRequest : XDomainRequest;
var xhr = new XHR(); var xhr = new XHR();
``` ```

View file

@ -16,16 +16,13 @@
```js ```js
// (1) // (1)
var xhr = new XMLHttpRequest(); var XHR = ("onload" in new XMLHttpRequest()) ? XMLHttpRequest : XDomainRequest;
if (!xhr.onload) { // это IE 8/9, в них старый XMLHttpRequest
if (!window.XDomainRequest) throw new Error("Not supported"); var xhr = new XHR();
xhr = new XDomainRequest(); // ..но есть XDomainRequest
}
// (2) запрос на другой домен :) // (2) запрос на другой домен :)
xhr.open('GET', 'http://anywhere.com/vote.php', true); xhr.open('GET', 'http://anywhere.com/path', true);
// (3)
xhr.onload = function() { xhr.onload = function() {
alert(this.responseText); alert(this.responseText);
} }
@ -34,23 +31,18 @@ xhr.onerror = function() {
alert('Ошибка ' + this.status); alert('Ошибка ' + this.status);
} }
xhr.send(''); xhr.send();
``` ```
Комментарии:
<ol> <ol>
<li>Мы создаём `XMLHttpRequest` и проверяем, поддерживает ли он событие `onload`. Если нет, то это старый `XMLHttpRequest`. Возможно, у нас IE8-9, значит надо попробовать `XDomainRequest`.</li> <li>Мы создаём `XMLHttpRequest` и проверяем, поддерживает ли он событие `onload`. Если нет, то это старый `XMLHttpRequest`, значит это IE8,9, и используем `XDomainRequest`.</li>
<li>Запрос на другой домен отсылается просто указанием соответствующего URL в `open`. Он должен быть асинхронным.</li> <li>Запрос на другой домен отсылается просто указанием соответствующего URL в `open`. Он обязательно должен быть асинхронным, в остальном -- никаких особенностей.</li>
<li>Все браузеры, которые поддерживают кросс-доменные запросы, поддерживают и события `onload/onerror`, которые можно использовать вместо `onreadystatechange`.</li>
</ol> </ol>
## Контроль безопасности
### Контроль безопасности В кросс-доменный запрос браузер автоматически добавляет заголовок `Origin`, содержащий домен, с которого осуществлён запрос.
Контроль безопасности осуществляется на уровне браузера.
**В кросс-доменный запрос браузер автоматически добавляет заголовок `Origin`, содержащий домен, с которого осуществлён запрос.**
В данном случае заголовки будут примерно такие: В данном случае заголовки будут примерно такие:
@ -70,7 +62,7 @@ Origin:http://javascript.ru
Сервер должен, со своей стороны, ответить специальными заголовками, разрешает ли он такой запрос к себе. Сервер должен, со своей стороны, ответить специальными заголовками, разрешает ли он такой запрос к себе.
**Если сервер разрешает кросс-доменный запрос с этого домена -- он должен добавить к ответу заголовок `Access-Control-Allow-Origin`, содержащий домен запроса или звёздочку `*`.** **Если сервер разрешает кросс-доменный запрос с этого домена -- он должен добавить к ответу заголовок `Access-Control-Allow-Origin`, содержащий домен запроса (в данном случае "javascript.ru") или звёздочку `*`.**
Только при наличии такого заголовка в ответе -- браузер сочтёт запрос успешным, а иначе JavaScript получит ошибку. Только при наличии такого заголовка в ответе -- браузер сочтёт запрос успешным, а иначе JavaScript получит ошибку.

View file

@ -364,7 +364,7 @@ function elastic(progress, x) {
``` ```
**График для `x=1.5`:** **График для `x=1.5`:**
<img src="elastic.png"> <img src="elastic.svg">
Пример для `x=1.5`: Пример для `x=1.5`:
<div onclick="move(this.children[0], elastic, 2000)" class="example_path"> <div onclick="move(this.children[0], elastic, 2000)" class="example_path">

Binary file not shown.

Before

Width:  |  Height:  |  Size: 4.2 KiB

View file

@ -0,0 +1,25 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg width="233px" height="388px" viewBox="0 0 233 388" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns">
<!-- Generator: bin/sketchtool 1.3 (252) - http://www.bohemiancoding.com/sketch -->
<title>elastic.svg</title>
<desc>Created with bin/sketchtool.</desc>
<defs></defs>
<g id="combined" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd" sketch:type="MSPage">
<g id="elastic.svg" sketch:type="MSArtboardGroup">
<path d="M34,365 L34,22.1600037" id="Line" stroke="#E8C48E" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path id="Line-decoration-1" d="M34,23 C32.95,26.78 32.05,30.02 31,33.8 C33.1,33.8 34.9,33.8 37,33.8 C35.95,30.02 35.05,26.78 34,23 C34,23 34,23 34,23 Z" stroke="#E8C48E" stroke-width="2" stroke-linecap="square"></path>
<path d="M24.5,194 L208.509995,194" id="Line" stroke="#E8C48E" stroke-width="2" stroke-linecap="square" sketch:type="MSShapeGroup"></path>
<path id="Line-decoration-1" d="M208.5,194 C204.72,192.95 201.48,192.05 197.7,191 C197.7,193.1 197.7,194.9 197.7,197 C201.48,195.95 204.72,195.05 208.5,194 C208.5,194 208.5,194 208.5,194 Z" stroke="#E8C48E" stroke-width="2" stroke-linecap="square"></path>
<path d="M34.8792035,192.69782 C38.3217915,192.697818 46.5362784,191.195974 53.4936997,193.038137 C62.0206897,195.295885 61.5154635,189.622956 87.0139157,194.339254 C100.114357,196.762365 100.423927,183.608251 115.161483,194.900075 C135.318831,210.34451 133.877092,159.362737 148.519851,194.677907 C151.940119,202.926853 155.398942,217.279032 158.65332,214.286779 C161.563227,211.611251 163.848094,194.907207 173.23036,150.175435 C177.841468,128.191083 188.232669,296.296579 192.347319,280.535848 C201.966406,243.690946 203.555755,39.1411041 207.337233,22.0938619" id="Path-747" stroke="#EE6B47" stroke-width="3" sketch:type="MSShapeGroup"></path>
<text id="0" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
<tspan x="17" y="212">0</tspan>
</text>
<text id="1" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
<tspan x="17" y="36">1</tspan>
</text>
<text id="-2" sketch:type="MSTextLayer" font-family="Consolas" font-size="14" font-weight="bold" fill="#8A704D">
<tspan x="200" y="212">1</tspan>
</text>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.6 KiB

Binary file not shown.