36:null 37:["$","title",null,{"children":"Эй Пи Ай для чайников | Roman Klimenko | Observable"}] 3d:Td6b,md`# Эй Пи Ай для чайников

## Как залогиниться на d3 Привет! В этом посте мы рассмотрим простейшие операции с [Эй Пи Ай](https://d3.ru/api/docs/). Допустим, вы хотите посмотреть, на какие посты вы подписаны. Или получить список всех заметок, оставленных в вашем профиле. Эти данные не предоставляются кому попало. Сервер d3.ru должен знать, что вы – это Вы. API – это возможность отправить запрос к серверу и получить на него ответ. Чтобы сервер отправил вам ваши данные, вы должны передать ему два параметра: UID (идентификатор пользователя) и SID (идентификатор сессии). То, что вы залогинены на d3.ru, означает, что ваш браузер хранит ваши SID и UID. Он хранит их в cookies (печеньки). Это такое специальное хранилище, в котором браузер держит текстовые значения. Браузер всегда передает cookies вместе с запросами на сервер, если домен сервера соответствует домену cookie. Но браузер не передает cookie одного домена на сервер другого домена. Иначе, Фейсбук имел бы доступ к вашему аккаунту Google и наоборот. API не использует cookies. SID и UID передаются в заголовках запроса – это как бы поля в анкете, которые надо заполнить перед передачей запроса на сервер *(на самом деле, cookies тоже передаются в заголовках, но уже другая история)*. Браузер может хранить ваши данные не только в cookies, но и в localStorage, и ещё кое-где ещё. localStorage не передается на сервер с каждым запросом. Но программист, конечно же, может прочитать значение из localStorage и передать куда надо. Тем не менее, вы можете создать веб-страницу на своём сервере, хранить SID и UID в localStorage, и передавать их только на сервер d3.ru. Тогда сервер, предоставляющий эту веб-страницу, не будет знать учетных данных пользователя. Получить SID и UID можно просто подсмотрев значения cookies в своём браузере, или вызвав специальный метод API. Вот пример функции, которую можно использовать на веб-странице для получения SID и UID по логину и паролю: `3e:[] 3b:{"id":"d367cca168e391bb","slug":"n/2","title":"Эй Пи Ай для чайников","thumbnail":"e611313fa11f50bbb7cc74b3fa181e7752c014932e08e4a6112abd236ec48366","access_level":"public","create_time":"$D2020-09-15T10:49:11.442Z","update_time":"$D2020-09-15T20:54:38.834Z","view_time":null,"first_public_time":"$D2020-09-15T20:55:44.879Z","has_unpublished_edits":null,"fork":false,"stars":1,"starred":false,"owner":{"type":"team","id":"fe4aac1446538067","login":"romaklimenko","name":"Roman Klimenko","avatar_url":"https://avatars-next.observableusercontent.com/43ab6d186d90e198c84c69775b1b42aefc76727c72b8f482ac7a3c111107ef4d","tier":"starter_2024","bio":"","following":false},"version":161,"publish_version":161,"role":null,"authored":false,"authors":[{"type":"individual","id":"c5af103943962de2","login":"romaklimenko","name":"Roman Klimenko","avatar_url":"https://avatars-next.observableusercontent.com/43ab6d186d90e198c84c69775b1b42aefc76727c72b8f482ac7a3c111107ef4d","tier":null,"bio":"","following":false}],"members":[{"type":"individual","id":"c5af103943962de2","login":"romaklimenko","name":"Roman Klimenko","avatar_url":"https://avatars-next.observableusercontent.com/43ab6d186d90e198c84c69775b1b42aefc76727c72b8f482ac7a3c111107ef4d","tier":null,"role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":{"id":"677ad5af80f570d0","slug":"d3-ru","title":"d3.ru","owner":{"id":"fe4aac1446538067","login":"romaklimenko","name":"Roman Klimenko"}},"type":"notebook","body":{"titling":"auto","title":"Эй Пи Ай для чайников","cells":[{"id":0,"value":"$3d","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":4,"value":"async function login(username, password) {\n const response = await fetch('https://d3.ru/api/auth/login/', {\n body: JSON.stringify({\n username,\n password,\n }),\n headers: {\n 'Content-Type': 'application/json'\n },\n method: 'POST'\n });\n return await response.json();\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":104,"value":"md`Теперь вы можете где-нибудь у себя на странице повесить два поля ввода и кнопку \"YARRR!!!\", которая будет сохранять SID и UID в localStorage:`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":112,"value":"viewof username = html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":32,"value":"viewof password = html``","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":40,"value":"{\n const button = html``\n button.onclick = async function(event) {\n const session = await login(username, password);\n localStorage.setItem('sid', session.sid);\n localStorage.setItem('uid', session.uid);\n }\n return button;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":120,"value":"md`Обновите эти значения. Если вы успешно залогинились, не должно быть 'undefined':`","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":10,"value":"localStorage.getItem('sid')","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":15,"value":"localStorage.getItem('uid')","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":129,"value":"async function subscriptions(uid, sid) {\n const response = await fetch('https://d3.ru/api/posts/subscriptions/', {\n headers: {\n 'Content-Type': 'application/json',\n 'X-Futuware-SID': sid,\n 'X-Futuware-UID': uid,\n },\n method: 'GET'\n });\n return await response.json();\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":132,"value":"await subscriptions(localStorage.getItem('uid'), localStorage.getItem('sid'))","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":134,"value":"async function renderSubscriptions() {\n const result = await subscriptions(localStorage.getItem('uid'), localStorage.getItem('sid'));\n const items = result.posts\n .map(post => `

`).join('');\n return html`

${items}`;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":136,"value":"await renderSubscriptions()","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":152,"value":"async function notes(uid, sid, username) {\n const notes = [];\n let page = 1;\n let pageCount = 1;\n\n const params = {\n method: 'GET',\n headers: { 'X-Futuware-UID': uid, 'X-Futuware-SID': sid, }\n };\n\n while (page <= pageCount) {\n const response = await fetch(\n `https://d3.ru/api/user_notes/?user_login=${username}&page=${page++}`, params);\n const result = await response.json();\n\n pageCount = result.page_count;\n notes.push(...result.user_notes);\n }\n\n return notes;\n}","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":155,"value":"await notes(localStorage.getItem('uid'), localStorage.getItem('sid'), 'romaklimenko')","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W3e","stdlib":"1"}} 3c:"$3b:body"