proszę o wybaczenie albowiem umysł mój spaczony nocną zmianą na magazynie
Wersja do druku
proszę o wybaczenie albowiem umysł mój spaczony nocną zmianą na magazynie
https://c.tenor.com/lfXa-aaHgbYAAAAS...a-laughing.gifCytuj:
Black Keeper napisał
nie zapomnijmy jeszcze aby uzbroić nasz projekt w niezbędną bilioteke, koniecznie w wersji enterprise: https://isevenapi.xyz/
huj tam kolega ma mi zrobic jakos za dobre pieniaszki (za darmo) jak ogarnie i mi sie bedzie podobac powiem wam jak to zrobil, najwyzej wtedy go zywyzwacie
witam!
Zapanowała cisza i spadł śnieg. Dzisiaj przypomniałem sobie o tym temacie i postanowiłem wieczorem podjąć się tego zadania...
Jest jeden problem: cross-origin/domain (CURL).
Stworzyłem prostą stronę - w React i tak nie miałoby to znaczenia. Napisałem skrypt, który wysyła request do Tibiantisa aby w odpowiedzi otrzymać content HTML na którym będziemy sobie pracować. Niestety tutaj jest problem: nie da się z przeglądarki wysłać HTTP request do serwera, który blokuje CORS. Są strony do których można wysłać request i otrzymywałem od nich content HTML ale tu jest inaczej.
W jednym z moich poprzednich postów, zasugerowałem żeby postawić jakieś Rest API i robić jakieś cuda i po części miałem rację. Trzeba postawić serwer, np. w express js i z niego wysłać request do strony internetowej na której chcemy zrobić web scraping.
Można też inaczej. Istnieją tzw. serwisy proxy do których wysyłamy request z URL naszej docelowej strony ale te serwisy są płatne bądź oferują ograniczoną ilość zapytań (100-1000... różnie).
Ok, taki pojawia się błąd:
https://i.imgur.com/5SDOHee.png
Spróbuję uruchomić serwer w express js i wysłać żądanie z niego. Zobaczymy czy uda się. Jeszcze jest kwestia czy ogarnę parsera (JSSoup) aby przetworzyć tą całą tabelę z graczami online.
Wiadomo można w excelu zrobić ten projekt - jak ktoś wyżej wspomniał, ale zdaję mi się, że w ramach nauki warto spróbować rozwiązać te zadanie na płaszczyźnie front-endu xD
ps. tutaj jest link do fajnego artykułu o tym: https://dev.to/johnpaulada/how-we-fa...-scraping-1881
Pan sie zabierasz do tego od dupy strony
ale, że co, że jestem rudy?
Dlaczego przeglądarka ma pobrać html z tibiantis.online? Jak ktoś bedzie zalogowany to by pan mógł pobrać dane typu mail, przeparsować htmla i wysłać request zmiany hasła. Po to jest CORS żeby tak nie robić.Cytuj:
Black Keeper napisał
Proponuje użyć czegoś serverside, nodejs, pytonga czy pehape zamiast 20 bibliotek, zeby pobrać tą tabelke. Uwaga, teraz zamieniamy tabelke w array robiąc coś w stylu explode(removetags(tabelka),"\n"), co uszczupli ilość bibliotek.
Użyłem express.js
edit: dobra spróbuję zrobić żeby było tylko serverside
I generuję taką zawartość:
https://i.imgur.com/4SW4DEm.png
wyciagnij sobie tera getElementByClassName('tabi')[0].textContent i jestes w domu
Zrobiłem inaczej, nie wiem czemu ale getElement wypluwa mi błąd w konsoli... potem to sprawdzę.
Kod:const result = htmlContent.includes("Angel of Distans");
if(result) {
console.log("Player is online.");
}
Nie getElement to nie, wez se jakiegos parserka np. cheerio, se przemapuj po calych rzedach tabeli i zrob z tego ladna tablice sexowna z nickami/lvlem. Jak bedziesz renderowal w reactcie te grupy, to kazdy component userka se sprawdzi onlineList.includes(userek.name) ? 'ale online ten userek jest jak nic' : 'chyba retired rip tibiantis' i gotowe essaCytuj:
Black Keeper napisał
@Lord
Zastanawiam się gdzie przechowywać nicki znajomych graczy z Tibiantisa. Sesja i localstorage?
edit: ale już wiem mniej więcej o co chodzi, kiedyś we Flasku coś pisałem... muszę również zrobić przynajmniej jedną statyczna stronę .html i użyć jakiś template engine
tak dzisaj wyglada programowanie ze do byle gowna 15 bibiotek laduja, a potem wczytujesz na kazdej stronie ten bloatware chuj wie po co
w antycznym php tyle to zajmuje, a napewno da sie prosciej
Kod:$html = file_get_contents("https://tibiantis.online/?page=WhoIsOnline");
$first_step = explode( '<table width="100%" class="tabi">' , $html );
$second_step = explode("</table>" , $first_step[1] );
$dom = new DOMDocument();
@$dom->loadHTML($second_step[0]);
$xpath = new DOMXPath($dom);
foreach($xpath->query('//td[1]') as $td){
echo $td->nodeValue; //nicki osob online
echo "<br>";
}
Ja zrobiłem to tak:
Wartość i w pętli ustawiłem na 3, ponieważ pierwsze trzy komórki mają wartości opisowe. Pętla musi iterować co n kroków. W tym przypadku co trzy kroki żeby odpowiednio zapełnić tablicę graczy.Kod:const retrieveData = async () => {
const response = await axios.get(PLAYERS_ONLINE_URL);
return response.data;
};
app.get("/players-online-table", async (req, res) => {
const response = await retrieveData();
const dom = new JSDOM(response);
const playersTable = dom.window.document.querySelector(".tabi");
const playersTableDetails = playersTable.querySelectorAll("td");
const playersOnlineArray = [];
for (let i = 3; i < playersTableDetails.length; i += 3) {
playersOnlineArray.push({
name: playersTableDetails[i].textContent,
vocation: playersTableDetails[i + 1].textContent,
level: playersTableDetails[i + 2].textContent,
});
}
console.log(playersOnlineArray);
res.send(playersOnlineArray);
});
Można jeszcze sprawdzić ile ogołem graczy jest online na Tibiantisie, chociaż nie będzie to potrzebne, kiedy projekt jest listą kontaktów.
https://i.imgur.com/Ud8fbPg.pngKod:console.log(playersOnlineArray.length);
Lista znajomych będzie zapisywana w ciasteczkach.
edit: tibiantis-contact-list.herokuapp.com
Co się dało to zrobiłem, teraz myślę gdzie to wrzucić za free. Pewnie autor tematu już dawno zapomniał... ale zabawa i nauka była fajna. Jeszcze można stworzyć funkcję grupowania jak będzie czas.
https://github.com/KrwawyOrk/tibiant...ob/main/app.js
github: https://github.com/KrwawyOrk/tibiantis-contact-list