renovations
This commit is contained in:
parent
13e6f9383f
commit
d1b484913a
6 changed files with 37 additions and 20 deletions
|
@ -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();
|
||||||
```
|
```
|
||||||
|
|
||||||
|
|
|
@ -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 получит ошибку.
|
||||||
|
|
||||||
|
|
|
@ -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 |
25
3-more/2-animation/1-js-animation/elastic.svg
Normal file
25
3-more/2-animation/1-js-animation/elastic.svg
Normal 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 |
BIN
figures.sketch
BIN
figures.sketch
Binary file not shown.
Loading…
Add table
Add a link
Reference in a new issue