Расчесывание запросов CORS переднего плана

Node.js внешний интерфейс сервер jQuery

С точки зрения разделения фронт-энда и бэкэнда,междоменный запросэто первая проблема, которую нам нужно решить. Ниже приведены некоторые из опытов, которые я обобщил в процессе разработки.

В разработке часто будет появлятьсяОпцииЗапрос(Предварительный запрос CORS), но иногда он не появляется. Некоторые запросы не запускают предварительные запросы CORS, такие запросы называютсяпростой запрос, другие запросы называютсяне простой запрос. Во-первых, давайте различать простые запросы и непростые запросы.

Простой и не простой запрос запросы

браузер будетCORSЗапросы делятся на две категории:простой запрос(простой запрос) ине простой запрос(не очень простая просьба).
Пока следующие два условия выполняются одновременно, это простой запрос.

HEAD,GET,POST

2. Информация заголовка HTTP не превышает следующих полей:

Accept
Accept-Language
Content-Language
Last-Event-ID
Content-Type: ограничено тремяЗначение приложения / X-www-формы-орленкадированного,multipart/form-data,text/plain
凡是不同时满足上面两个条件，就属于非简单请求. Браузеры обрабатывают эти два запроса по-разному.

2. Прочесывание головы, связанное с междоменным

Теперь мы знаем, какие из наших запросов являются простыми запросами, а какие — сложными.Вышеупомянутые заголовки HTTP и междоменные запросы CORS, полное название CORSCross-origin resource sharing, то есть,Совместное использование ресурсов между источниками, браузер ограничивает перекрестные домена HTTP-запросы с точки зрения безопасности, котораяТа же политика происхождения, поэтому серверной части необходимо установить заголовок запроса для разрешения междоменного доступа.

1. Методы разрешения доступа:

представляет собой строку, разделенную запятыми,Метод для указания перекрестных запросов, разрешенных сервером.

2. Заголовки Access-Control-Allow:

представляет собой строку, разделенную запятыми,Указывает все поля заголовка, поддерживаемые сервером., не ограничиваясь полями, запрошенными браузером в «предпечатной проверке».

3. Доступ для контроля доступа - учетные данные:

Это поле указывает, может ли ответ на запрос быть выставлен странице, вообще говоря.cookie.Учетные данные должны быть настроены как на переднем, так и на внутреннем интерфейсе, чтобы запросы CORS с учетными данными выполнялись успешно..jQueryможет быть установленxhrFields: {withCredentials:true},promiseможет быть установленcredentials: 'include'.

4. Access-Control-Max-Age:

Используется для указания этого запроса предварительной проверкиСрок годностиЕдиница вторая.

5. Access-Control-Allow-Origin:

выражатьРазрешено ли совместное использование ресурса с данным источником.

6. Access-Control-Expose-Headers:

Заголовки ответа Access-Control-Expose-Headers перечисляет, какие заголовки могут быть частью ответа.Выставить наружу. По умолчанию только шесть простых заголовков ответов (simple response headers) могут быть выставлены внешнему миру:Cache-Control, Content-Language, Content-Type, Expires, Last-Modified, Pragma. Если вы хотите, чтобы клиент имел доступ к другим заголовкам, вы можете перечислить их в Access-Control-Expose-Headers.

7. Заголовки запроса управления доступом:

Заголовок запроса Access-Control-Request-Headers появляется впредварительный запроссередина,Используется для информирования сервера о том, какие заголовки запроса будут использоваться в реальном запросе..

8. Метод запроса контроля доступа:

заголовок запросаAccess-Control-Request-MethodПоявляется в предварительном запросе, чтобы сообщить серверу, какой метод HTTP использовать в фактическом запросе. потому что метод, используемый предварительным запросом, всегдаOPTIONS, который не совпадает с методом, используемым в фактическом запросе, поэтому этот заголовок необходим.

3. Отправить файлы cookie

Если вам нужно отправлять куки, как передние, так и задние концы настроены, и передний конец необходимо установить jQuery, который можно установить настройкиxhrFields: {withCredentials:true}, обещания могут быть установленыcredentials: 'include'.
Серверная сторона должна быть установленаres.setHeader('Access-Control-Allow-Credentials', 'true');В противном случае браузер сообщит об ошибке:

Ответ на предварительный запрос не проходит проверку управления доступом: значение заголовка «Access-Control-Allow-Credentials» в ответе равно «», которое должно быть «истинным», когда режим учетных данных запроса «включить».

Следует отметить, что если вы хотите отправлять файлы cookie, в Access-Control-Allow-Origin нельзя установить звездочку, и вы должны указать четкое доменное имя, соответствующее запрашиваемой веб-странице.

в то же время,Файлы cookie по-прежнему следуют политике того же происхождения, будут загружены только файлы cookie, установленные с доменным именем сервера, файлы cookie с другими доменными именами не будут загружены, а document.cookie в исходном коде веб-страницы (перекрестного происхождения) не может прочитать файлы cookie под доменным именем сервера.
В это время браузер сообщит об ошибке

Значение заголовка «Access-Control-Allow-Origin» в ответе не должно быть подстановочным знаком «
«Когда режим учетных данных запроса« включает ».

* Посмотрим, как нода разбирает куки без использования плагинов и фреймворков
, вот код:

//解析cookie的函数

function parseCookies (request) {    
    let list = {},
    rc = request.headers.cookie;

    rc && rc.split(';').forEach(function( cookie ) {        
        let parts = cookie.split('=');
        list[parts.shift().trim()] = decodeURI(parts.join('='));
    });    
    return list;
}
http.createServer(function (request, response) {    
    //读取cookie
    var cookies = parseCookies(request);
    //写入cookie
    response.writeHead(200, {            
        'Set-Cookie': 'mycookie=test',            
        'Content-Type': 'text/plain'
    });
    response.end('Hello World\n');}).listen(8124);
})

В-четвертых, значение Content-Type и его роль

При подключении к внутреннему интерфейсуЗначение Content-Type определяет, как бэкэнд анализирует наши параметры.. Content-type обычно используется несколько значений:

1.text/html
2.text/plain
3.text/css
4.text/javascript
5.application/x-www-form-urlencoded
6.multipart/form-data
7.application/json
8.application/xml

Первые несколько хорошо понятны, и все они представляют собой файлы html, css и javascript.Следующие четыре - пакет для волос поста.

1. приложение/x-www-форма-urlencoded

Формат отправки формы по умолчанию в html, тип содержимого запроса jquery ajax по умолчанию также является этим форматом по умолчанию, и jquery преобразует данные: {foo1:"bar1",foo2:"bar2"} данные в key1=value1&key2= value2, Можно ли отключить предварительную обработку данных через processData Формат данных имеет вид key1=value1&key2=value2.

Ниже приведен код для jquery для предварительной обработки данных.По умолчанию processData имеет значение true, поэтому, если данные имеют значение, он вынесет решение и преобразует формат json в формат key1=value1&key2=value2.

if ( s.data && ( s.processData || typeof s.data === "string" ) ) {
    cacheURL += ( rquery.test( cacheURL ) ? "&" : "?" ) + s.data;
    
    // #9682: remove data so that it's not used in an eventual retry
    delete s.data;
}

2. Multipart/form-data

multipart/form-data используется в пакетах POST, которые отправляют файлы.
Здесь Content-Type сообщает нам, что контракт является множественным / форм-форматом передачи данных, который также использовался для граничных данных сегментации.
Когда файл слишком длинный и HTTP не может быть отправлен в одном пакете, данные необходимо разделить на куски и отправить на сервер.
Итак - используется для различения данных, в то время как данные SQE6NHQ4GTMFHLOY имеют маркированное разрешение.

------WebKitFormBoundarysqe6Nhq4gtMfHLOY
Content-Disposition: form-data; name:"UserWxCode"

123
------WebKitFormBoundarysqe6Nhq4gtMfHLOY
Content-Disposition: form-data; name="CodeType"

Public
------WebKitFormBoundarysqe6Nhq4gtMfHLOY--

3. приложение/json

Обязательно при отправке запросаJSON.stringifyодин раз,В HTTP-коммуникациях нет так называемого json., а преобразовать строку в json, то естьПриложение / JSON можно понимать как текст / просто обычная строка.

4. текст/xml и приложение/xml

text/xml игнорирует настройки кодировки в заголовке файла xml (<?xml version=”1.0” encoding=”UTF-8”?>),По умолчанию используется кодировка us-ascii.. application/xml会В соответствии с настройками, закодированными в заголовке файла xml.рекомендуется приложение/xml

Пять, выборка и jquery Ajax set Заголовки, куки

//fetch设置Headers，cookies

//方式1
let myHeaders = new Headers({    
   'Content-Type': 'application/json; charset=UTF-8',    
   'token': 123
});

//方式2
headers: {    
   'Content-Type': 'application/json; charset=UTF-8',    
   'token': 123
}

//发送cookies：
credentials: 'include'

//jquery ajax设置Headers，cookies

//设置header方式一
headers: {
   UserName: 'zxplus',
   EncryptKey: '1111'
},

//方式二
beforeSend: function(request) {
    request.setRequestHeader("UserName", "zxplus");
},
//发送cookie
xhrFields: {
   withCredentials:true //支持附带详细信息
},

Ссылаться на

https://stackoverflow.com/questions/3393854/get-and-set-a-single-cookie-with-node-js-http-server
http://www.ruanyifeng.com/blog/2016/04/cors.html
https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Access_control_CORS
https://segmentfault.com/a/1190000006039533
http://www.cnblogs.com/caoshiqing/p/6825608.html
http://homeway.me/2015/07/19/understand-http-about-content-type/


Категории