どうも。クソサイトしばき隊の月組トップ娘役、黒木瞳の娘の母です。ITゼネコン特権を許さない市民の会(I特会)会長、桜井政博と日夜戦ってます。ホムラをナーフしろ。
えきねっとっていうゴミみてぇなサイトがあって、それがリニューアルされた(魚拓)。だから見てみた。
ゴミだった。
とも言えない。前の使い勝手の酷さを知ってるから。もつれみたいなものが微妙に解かれていて、それはありがたい。でも劣化しているところも目立つな。
◆動けばいい
一理ある。
でも、技術もってない会社が開発すんのはオススメできないよ。
乱暴な話なんだけど、技術力がないってのは「アホである」と読み替えてもいい。「喉が渇いたので腋毛を剃る」みたいなレベルの判断してるから。アホの集団にシステム作らせてんですお前らは。
技術力ない以上、設計ができない。綺麗なものを作れない。散らかった部屋になる。散らかった部屋をリフォームするには金と時間が無駄にかかる。改修に無駄なコストがかかる。不具合発生時に原因切り分けがしづらくなる。クソ設計に対応するには多くのコードを書かなければいけなくなる。比例してバグが多く埋まる。
技術力ない以上、「何ができるのか」を判断できない。存在している可能性を見逃す。進化できなくなる。新しいことするための時間を失う。「こうすれば使い勝手よくなります」を提案できなくなる。
技術力ない以上、セキュリティの観点がわからなくなる。生のセキュリティを知らないまま、資格を取って安心する。
負債になる。
…じゃあ、みてみよっか!スイッチ(F12)オーーン!
のまえに、Wappalyzerっすよね。
◆Wappalyzerした
ASP.NETでIISやん!じゃあC#使ってんだろう恐らく。.NET Coreなのか.NET Frameworkなのか。Coreであると信じたいが。
まぁ使いかた間違ってないんならなんでもいいけど。
▼JavaScriptライブラリ
お決まりのjQuery。そしてUnderscore.js。古き良きだな。
…いや、リニューアルしたんじゃねぇの?捨てろよそんな遺物。きょうび流行んねーんだよ。ボケが。
Moment.js使ってんのもハゲ。カス。dayjs使えって何回言えば理解してくれるの。
なんでSwiperとSlickの両方いれてんの?わけわかめ。
D3…しらない。なんだろう。githubのStarが97.5kってすげぇな。んで、見た感じ、あれだな。Chart.jsだな。
ASP.NETがデフォで入れてたライブラリとかもあんのかな。わからんな。
▼CDN
CDN使ってなくね?いいの?
と思ったんだけど、digったら「www.eki-net.com.edgekey.net.」とか書いてあったからAkamaiでしょうね。
Akamai使ったことないからよくわからんが、これはレスポンスヘッダーいじってんのかな。CDN隠ぺいしたところで何の意味があるのか知らんけど。どうやってもdigったらわかっちゃいますし。
◆Networkみてみよう
▼JSON
なんで「.json」って拡張子ついてんの?REST APIをご存じない?
でもまぁ思えば、JavaScriptは拡張子つけてるよね俺ら。「静的データだよ」って意味でもってケツに「.json」ってつけるのはありなのかも。そうかも。
そいで、settei.json(魚拓)って何マジで。殺すぞ。setteiListってなんだよ殺すぞ。ふざけんな。中学生に作らせたんか。「mentetime」って何!!!!めんてちめ!!!二億歩譲ってmainteTimeじゃ!!!誰だこいつアサインしやがったの!!!責任問題だぞ!!!!!!!
あと魚拓とって気づいたけどこれ、静的ファイルじゃないじゃん。じゃあ拡張子つけんなや低能。
でも…まぁデータをHTMLやらJavaScriptから分離したことはある程度評価しておくよ…えらい…かわヨ…すき…
▼パス
https://www.eki-net.com/Personal/top/wb/rentacar/json/office.json
なんでケースすら守れないの。そういうとこやぞ。
「carTeiin」ってなんだよ!!!!テッメェェェェェ!!!↑↑↑
▼CSV
新しい。CSVの通信してんのは新しい。パースどうしてるんだろ。知りたくもないが。
まーJSONよりかデータ容量削減できるからね。いやでもそんなこと気にしてないように見える。
syukujitsu_kyujitsu.csv(魚拓)については、ファイルを分割しなされ。そんな不幸な名前つけちゃかわいそうだよ。
▼CSS
common.css(魚拓)ってとこにさ、「/* デフォルトCSSを無効にするだけのCSS */」とかコメントあってさwもうさwww reset cssという概念をご存じないのかなとかさwwwwそもそもBootstrap導入してんじゃんってwwwww思ってwwwww
内容見てもまぁ辛いことしてるねって感想ですわ。昔のCSSの辛さをいまもやってる感じ。importantをいくつ書けば気が済むの。それをやりたくなくてフロントエンドエンジニアはここまで頑張って、駆け抜けてきたんじゃあなかったのかね。侮辱ですよこれは。
CSSクラスの名前の付け方もひでぇもんだ。「tmp_pB-0」とか、内容的に「padding-bottom: 0px !important」しかやってない。死にたい。Bootstrap入ってますけどーーーー。おーーーーーーーい。もしもし聞こえますかーーーーーー。Spacingなんてもうすでに用意されてますよーーーーーー。
全部のCSSに以下のコメント入ってんのもクッソきつい。
/*========================================= ボタンテンプレート =========================================*/ /* デフォルトCSSを無効にするだけのCSS */ /* 高強調ボタン大 */ /* 高強調ボタン中 */ /* 高強調ボタン小 */ /* 高強調ボタン小 インライン */ /* 高強調ボタン大 背景緑 */ /* 高強調ボタン中 背景緑 */ /* 高強調ボタン小 背景緑 */ /* 高強調ボタン小 背景緑 インライン */ /* 高強調ボタン大 背景白 */ /* 高強調ボタン中 背景白 */ /* 高強調ボタン小 背景白 */ /* 高強調ボタン小 背景白 インライン */ /* 中強調ボタン大 緑 */ /* 中強調ボタン中 緑 */ /* 中強調ボタン小 緑 */
死にたい死にたい。やめて。あいたたたたた。死にたくなるからやめて。
jrtour_help.css(魚拓)の「5058~5122行をコピー popCon→top_modalW_wrapper.jrtour」ってなに?何の話してんの?そんなことよりお前んちに放火していい?
▼JavaScript
※WayBackMachineでjsの魚拓とると、ファイルの先頭と最後にコードとコメント入るっぽい。let openerしてる行の下からが元々の内容。if文の中にぶち込まれてんね。
※直接リンク踏んだ時に文字化けするのは、F12のNetworkからPreviewタブ越しに見ればいいよ。色も付くし。なんでデフォルトのエンコードがUTF-8じゃねぇんだろうと思って「chrome fallback encoding」「firefox fallback encoding」やらで調べてたら、この辺とかこの辺が参考になった。「metaにUTF-8って明示すんの忘れんじゃねぇぞ幼稚園児ニアども」ってメッセージなんですね。
閑話休題。
破廉恥すぎ。犯罪みたいなコード書いてる。「変数定義」とか言って変数を上に全部書いちゃってるのがもう終わってる。このひと大昔にC言語書いてた人なんやろなぁ。っていうかフィールドに変数多すぎない?「ticketOption_check」って、なに?この変数名を18行目で読んで意味理解できる人がこの世に存在すると思ってんの?
まずもってindex.jsをこんなに汚してしまう意味もわからん。ファイル分割して。分割したくないんならバンドラ使って圧縮して。
jQuery使ってんのはもうこの際いいんだけどよ。CSSのヤバさと相まって保守の無理さがすごい。なんのためにリニューアルしたの。
あと生のXHRやめて?axios噛ますとか、Fetch APIとかkyで極楽要求するとか…これ…このサイト、IE11対応してる…ってコト!?(ちいかわ)
と思ってIE11で開いたら、動いてたわ。あんなブラウザもう対応すんじゃねぇよ。Microsoftですら見限ってんだぞ。保守がつらくなるだけだよ。客の肝臓ぶん殴って「IEは対応しませんからね」でFAだバカヤロウ。
そもそもXHRを何に使ってるんだって思ったら、すごいの。なんかHTMLの取得にXHR使ってんの!!!
xmlhttp.open('GET', '/top/jrticket/inc/inc_busyperiod.html',true);// 外部HTMLファイル取得 xmlhttp.send();
う…うほー!こりゃすげぇや!山田くんこのエンジニア殺してー!!
何考えてんだマジで。不条理だよ。病気を疑ったほうがいい。
・en.js
…
あーーwwwwやめてーーーーーwwwwwdocument.cookieいじらんといてーーーーーwwww死んじゃうーーーーwwwwイクイクイクイクwwwwwwcookieのことCOOKって表現してるのなんなのーーーwwwコックさんなのーーーwww死んだんじゃないのぉ~?wwww
っていうか何を達成したくてこんなコード書きやがったのか全然わからん。どんな仕様があったとしてもこのコードを書く必要があるとは到底思えん。HttpOnlyにシテくれ。
あと何のためにMoment.js入れてんだよって。Dateが危険すぎるからMomentなりdayjsなり使うんでしょうが。
・jrtour_import.js
// 外部ライブラリ(@サーバー) document.write('<script type="text/javascript" src="/travel/jrtour/js/plugins/linq.min.js" ></script>'); document.write('<script type="text/javascript" src="/travel/jrtour/js/plugins/d3.v3.min.js" ></script>'); document.write('<script type="text/javascript" src="/travel/jrtour/js/plugins/underscore-min.js" ></script>');;
意味…
(絶句)
意味がわかんない…。これでも一部だからね。この発想をする人間がいるという事実が怖い。「Created by ユーザ名 on 2018/08/15.」ってアホみたいなコメントですら霞む。グロい。気持ちが悪い。これ書いた化け物がさ、普通の人間の顔して町を歩いてんでしょ…?
こわ…
人間不信になりそう…
importがIE11で使えないのはわかる。headに書けっていったとしてお前が聞く耳持たないのってのもわかる。でもせめて、せめてcreateElementからのappendChild使って差し込んでくれ…ネアンデルタール人でもそんな頭悪いdocument.writeしないわ…
ってか、ちょっと調べたらjQueryにgetScriptってあんじゃん。
・attention2021.js
は?どした?発作か?
・linq.min.js
嘘でしょ…。Underscore入ってるのに…。正真正銘のキチガイだ…(畏怖)neueccも浮かばれないわ…
neuecc、HTTPS対応してないのかって思って「https://neue.cc/」見てみたんだけど、mixed-contentでCSSが取れてないねこれ。ちょいまえのブラウザなら表示できてたんだろうが。
ってかさ。配列操作は標準のJavaScriptでなんでもできるじゃんかイマドキ。IE11対応したいってんならpolyfillいれろカス…es5-shimとか…Polyfill.ioでもこの際許すわ…
・jrtour_consts.js
グローバル定数いっぱい入っとるゥーw絶対グローバルにする必要なさそうなのも入っとるゥーw
// デバックか否か DEBUG:false, // サブミット時のメソッド('post'か'get') METHOD:'get', // サブミット時のリンク先 URLS : { //往復JR+宿泊 PC:'https://view.eki-net.com/pc/personal/search/wb/2006_DPHotelTrainSearchResult', SP:'https://view.eki-net.com/sp/personal/search/wb/2003_DPHotelPlanSearchResult', PC_HOTEL_ONLY:'https://view.eki-net.com/pc/personal/search/wb/2003_DPHotelSearchResult', }, DEBUG_METHOD:'get', DEBUG_URLS : { PC:'http://xxx.xxxxx.xx/xxxx', SP:'http://xxx.xxxxx.xx/xxxx', PC_HOTEL_ONLY:'xxx.xxxxx.xx/xxxx', },
いやもう…草がはえちゃうだろ!いい加減にしろ!
何が言いたいんだかひとつもわからんけど、ろくでもねぇことしてるって事実だけはヒシヒシと伝わってきてる。ってかsettei.jsonなるものがあったじゃん。アレは何だったんだよ。
もうツッコミどころ多すぎてやばいので、JavaScriptについてはこのへんでやめておく。あとは自分でみてこい。結構なヤツがまだ転がってるぜ。
◆リニューアルとは
結局のところ、リニューアルなんてしてないってことなんじゃねぇかな。見た目の修正だけしたんかな。リニューアル前の様子を見ておくんだった
???「WayBackMachineがあるじゃろ?」
俺「そっか」
どうやら違う。以前のものとはまるっきり違う。これは…?(恐怖)
というので、どっかのファッキン雑魚ベンダーがテンプレとして作った化石ウンコ的な構成を流用してでっちあげたんじゃなかろうか。そして、そのテンプレ作ったエンジニアはお亡くなりに退職しているものと見たね。
そしてこんなワケのわかんねぇ、悲しみを背負いしサイトが生まれたんでしょう。たぶん。
◆HTML
<input name="__RequestVerificationToken" type="hidden" value="jrs1x4ZspSOsZmv8daDq4oyrGN3IwYHcIl6JCp-IdWveduC5KcYh14x5AHCOe8KfXw0Mx-Tf8UnMlX7jIodGXBPqYc9c2G78S_iGjmqW_Uk1">
不穏すぎ。大丈夫なのこれ。ここに持ってていいトークンなのかな。いいってお前が言うならいいんだけどよ。まかり間違ってXSSあったらって思ってさ。
「__MultipleStartUpToken」ってのもHTML上に置いてあるなぁ…意味わかんねぇ…
CSS腐ってるせいでElementのclass指定も腐っちゃってるね。でもまぁ、JavaScriptの衝撃に比べたら大したことでもねぇな。
◆うごき
ありえん。画面遷移がアリエン・ロッベン。検索した後の、新幹線がスィーって通過していくアニメ、すごいわ。あれJavaScriptで出してんじゃなくて画面遷移までして表示してんだぜ。どんな判断なの。すごい。もう
gifでもSVGでもなくて背景透過のpng画像を動かしてっしよ。はやぶさくんのpng画像リンク置いておきますね。
ログインせずに経路検索できるのはえらい。でもいざ買う段階になったときにログイン求めるのは酷だぜ。最初に「予約にはログインが必要です」みたいに注意書きしといたほうがいいわ。
そして何より驚いたのが、パズルの続投よ。ログイン時にbotチェックあるんだけど、あのパズルを継続させたのはビビった。一度ログインしたブラウザでは表示されないから、あのパズルを何回も遊びたいならプライベートウィンドウで開こう。
見た感じCapy Puzzle CAPTCHAってサービスらしいね。reCAPTCHA使えばよくねっていうか。
ログイン画面のパスも意味わからなすぎるし。
https://www.eki-net.com/Personal/member/wb/Login/Login
Login/Login…あとこのリンク直で踏むとエラー画面なるのも香ばしい。認証フローもこれ相当やばいんでしょうなぁ!(垂涎)
どっかのでかいサイトでWebAuthn使わせてくれねぇかなぁ。社会実装遅すぎる。
▼サジェスト
駅名入力したときにサジェストがでてくるんだけど、これKeyDownイベントでAPI発火してないかね。頻繁過ぎない?デバウンスしなくていいの?いいならいいんだけどよ。
と思いきや、「tetete」とか高速入力しつつリクエストの内容見てたら微妙にデバウンスされてた。もうちょい鈍感でいいのでは?
あと「ChangedInputStationName」ってパスだけど、名前変だよね。意味わからんからね。POSTだし。どういう意味を持つ名前だと思ったの。
◆Cookie
HttpOnlyとSecureが抜けてるやつが多い…不安…sessionとかuseridとか書いてあるんだけども…
Cookieに入れるもんじゃねぇだろってのもいろいろだな。意味わからんのも山ほどある。「[Name]:[Value]」って感じでピックアップしてみる。
- jp.co.mobilus.konnect.cookies.domainId:ekinet
- 気持ちわからんではないが、ヘッダーだと思う。
- DisplayType:pc
- HistoryStation1:%e6%9d%b1%e4%ba%ac
- URL decodeしたら「東京」ってなった。トップページで検索した履歴っぽい。なぜここに持つ!
- check:true
意味が分からんね。
かたやLocal Storageは全然使ってなかった。モビルスって会社が作ってるらしいチャットボットのスクリプトが何かこちゃこちゃ使ってたけど。
◆障害
障害起こらないはずがないよね。あのボロクソのフロントエンドで障害起こさず1週間通せたんならもうそれは神の所業だわ。まともなシステム作れない会社の作ったシステムなんだもんよ。バックエンドも終わってますわそりゃ。
最初のPDFのタイトル、「202106.pdf」ってな。随分強気だよね。名前被っちゃうから一か月に一回しか障害起こせないねぇ?
◆結論
クソからクソにリニューアルしたんすね!ペッ!(唾棄)
死にさらせ!
じゃあな!
コメントを残す