Logging into website
Hey guys! Today we will learn how to log in using a Obyte wallet, and also make paid access to the article. To do this, we need project that i have prepared for you Tutorial-2-source. Install it.
1
git clone https://github.com/xJeneKx/Tutorial-2-source
2
cd Tutorial-2-source
3
npm install
Copied!
If you run project you will see a blog with articles. After opening any article you will see a request to log in. Let’s create an authorization. First we need a pairing code, you could see it on startup
Copy it and change our code a bit
1
pairingCode = 'Aly99HdWoCFaxJiIHs1ldREAN/[email protected]/bb#' + code;
Copied!
1
eventBus.on('paired', (from_address, pairing_secret) => {
2
console.error('paired', from_address, pairing_secret);
3
});
Copied!
Run and see the link. Сlick on it and bot will be added. Now let’s look at the console.
Add the link
1
b = '<br>Please login using this pairing code: <a href="obyte:' + pairingCode + '">' + pairingCode + '</a>';
Copied!
And QR
1
let dataURL = await QRCode.toDataURL("obyte:" + pairingCode);
2
b = '<br>Please login using this pairing code: <a href="obyte:' + pairingCode + '">' + pairingCode + '</a><br><img src="' + dataURL + '">';
Copied!
Save our device address, we will need it later.
1
eventBus.on('paired', (from_address, pairing_secret) => {
2
let device = require('ocore/device');
3
assocCodeToDeviceAddress[pairing_secret] = from_address;
4
device.sendMessageToDevice(from_address, 'text', 'ok');
5
});
Copied!
Now we need to tell the browser that we are logged in
To implement this, we add function in start.js
1
async function amILogged(ctx) {
2
let url = ctx.request.url;
3
let match = url.match(/code=([0-9]+)/);
4
if (match && assocCodeToDeviceAddress[match[1]]) {
5
ctx.cookies.set('ac', match[1]);
6
ctx.body = 'true';
7
} else {
8
ctx.body = 'false';
9
}
10
}
Copied!
And also one more routing
1
app.use(mount('/amilogged', amILogged));
Copied!
In article.html we will add a request to check
1
var step = '<%= step %>';
2
var code = '<%= code %>';
3
if (step === 'login') {
4
setInterval(() => {
5
fetch('/amilogged?code=' + code)
6
.then((response) => {
7
return response.text();
8
}).then(result => {
9
if (result === 'true') {
10
location.reload(true);
11
}
12
})
13
.catch(alert);
14
}, 5000);
15
}
Copied!
What’s going on here? The user scans the QR code, adds our bot. Bot associates code with his device_address. In the browser, we knock and ask: did we logged in? and adding cookies.
Now we need to create an address and associate it with the user and the article.
Add a variable
1
let assocCodeAndNumberToAddress = {};
Copied!
Add the address and display it
1
step = 'paid';
2
let address = await getAssocAddress(assocCode, 1);
3
let dataURL = await QRCode.toDataURL("obyte:" + address + '?amount=100');
4
b = '<br>Please pay for the article. <br>Address: ' + address + '<br>Amount: 100<br><img src="' + dataURL + '"><br>' +
5
'<a href="obyte:' + address + '?amount=100">Pay</a>';
Copied!
And finally the function getAssocAddress
1
function getAssocAddress(assocCode, number) {
2
return new Promise(resolve => {
3
let name = assocCode + '_' + number;
4
if (assocCodeAndNumberToAddress[name]) {
5
return resolve(assocCodeAndNumberToAddress[name]);
6
} else {
7
headlessWallet.issueNextMainAddress(address => {
8
assocCodeAndNumberToAddress[name] = address;
9
return resolve(address);
10
});
11
}
12
});
13
}
Copied!
This time we will not wait for the stabilization of the unit and immediately open access.
Add a variable
1
let assocCodeToPaid = {};
Copied!
Add a check that the user has paid for
1
async function amIPaid(ctx) {
2
let code = ctx.cookies.get('ac');
3
ctx.body = (code && itPaid(code)) ? 'true' : 'false';
4
}
5
​
6
function itPaid(code) {
7
return !!assocCodeToPaid[code];
8
}
Copied!
Add a routing
1
app.use(mount('/amipaid', amIPaid));
Copied!
And payment processing
1
eventBus.on('new_my_transactions', (arrUnits) => {
2
const device = require('ocore/device.js');
3
db.query("SELECT address, amount, asset FROM outputs WHERE unit IN (?)", [arrUnits], rows => {
4
rows.forEach(row => {
5
if (row.amount === 100 && row.asset === null) {
6
for (let key in assocCodeAndNumberToAddress) {
7
if (assocCodeAndNumberToAddress[key] === row.address) {
8
let assocCode = key.split('_')[0];
9
assocCodeToPaid[assocCode] = true;
10
device.sendMessageToDevice(assocCodeToDeviceAddress[assocCode], 'text', 'I received your payment');
11
return;
12
}
13
}
14
}
15
})
16
});
17
});
Copied!
That’s all, make a working second article - will be your homework:) You should get this:
https://www.youtube.com/watch?v=vvB6A1wBecQ​
Last modified 6mo ago
Export as PDF
Copy link
Edit on GitHub