React.JS Code Obfuscation

  1. KısayolKısayol reportŞikayet pmÖzel Mesaj
    MhmdAlmz
    MhmdAlmz's avatar
    Kayıt Tarihi: 09/Ağustos/2015
    Erkek

    Merhaba Mürit ve Mürideler,

    React.JS ile yazdığım uygulamayı karıştırmak istiyorum. Okunmasını zorlaştırmak istiyorum. Bir kaç tool buldum ama bunlar da TypeScript için destek vermiyor. Bildiğiniz ücretsiz TypeScript desteği olan react projesini karıştırıp build veren bir kütüphane var mı? 

     

    Bir adam akıllı şunu buldum https://github.com/javascript-obfuscator/javascript-obfuscator bu da sanırım tek bir dosya üzerinden yapıyor. Daha denemedim ama dosya dosya yaparsa bu sefer 2 dosya arasında class alışverişi varsa proje çalışmaz. Bilemedim..


    Andolsun kuşluk vaktine ve dindiği zaman o geceye ki, Rabbin sana veda etmedi ve darılmadı! Ve kesinlikle senin için sonu önünden (ahiret dünyadan) daha hayırlıdır. ileride Rabbin sana verecek de hoşnut olacaksın! O, seni bir yetim iken barındırmadı mı? Seni, yol bilmez iken (doğru) yola koymadı mı? Seni bir yoksul iken zengin etmedi mi? Öyle ise, sakın yetime kahretme (onu horlama)! El açıp isteyeni de azarlama! Fakat Rabbinin nimetini anlat da anlat!
  2. KısayolKısayol reportŞikayet pmÖzel Mesaj
    Retro
    by_Tet
    by_Tet's avatar
    Kayıt Tarihi: 22/Mayıs/2012
    Erkek

    Hocam cra webpack kullanır build ederken. Eğer cra veya next kullanıyorsun webpack obfuscator şeklinde aratabilirsin

    https://www.npmjs.com/package/webpack-obfuscator

    Daha önce yapmadım ama işini çözecektir. 

    He unutmadan şu hede de cra'nın webpack'ini düzenlemene yarar:

    https://github.com/timarney/react-app-rewired

     


    iyibu! yeniden..
  3. KısayolKısayol reportŞikayet pmÖzel Mesaj
    MhmdAlmz
    MhmdAlmz's avatar
    Kayıt Tarihi: 09/Ağustos/2015
    Erkek

    Hocam CRA dediğin Create React App sanırım. Eğer bu ise direkt bu şekilde projeyi oluşturdum ve typescript olarak ilerledim. Sanırım burda bütün iş Webpack üstünden ilerliyor. Biraz webpack eğitimi alsam iyi olabilir. 

    Aslında tam olarak aradığım şey kütüphane değil de X bir kütüphanede daha önce bir şeyler yapmış tecrübeli biri. İşin içinden çıkamıyorum çünkü. Söz konusu JS olunca zibilyon tane kütüphane oluyor.


    Andolsun kuşluk vaktine ve dindiği zaman o geceye ki, Rabbin sana veda etmedi ve darılmadı! Ve kesinlikle senin için sonu önünden (ahiret dünyadan) daha hayırlıdır. ileride Rabbin sana verecek de hoşnut olacaksın! O, seni bir yetim iken barındırmadı mı? Seni, yol bilmez iken (doğru) yola koymadı mı? Seni bir yoksul iken zengin etmedi mi? Öyle ise, sakın yetime kahretme (onu horlama)! El açıp isteyeni de azarlama! Fakat Rabbinin nimetini anlat da anlat!
  4. KısayolKısayol reportŞikayet pmÖzel Mesaj
    Retro
    by_Tet
    by_Tet's avatar
    Kayıt Tarihi: 22/Mayıs/2012
    Erkek

    Hocam genel olarak bütün frontend frameworkleri (react, swelte, vue, next, nuxt vs) Webpack, browserify gibi bundler'lar kullanırlar. Böylece javascript kodun bir anlamda derlenir (aslında bundle edilir)

    Frameworkten bağımsız olarak bundle olayına hakim olursan olayı daha basit çözebilirsin

    Tabi babel gibi js dönüştürücüleri de kodlar üzerinde değişiklik yapıyor. Çünkü es5, es6 vb. pek çok js geliştirmeleri mevcut, bu gelişimlerin bütün browserlarda çalışması için çoğu zaman dönüştürücüye ihtiyaç duyuyoruz (en azından standartlaşana kadar)

    Eğer bu durumlara vakıf olursan 

    {

       plugin: [webpackObfucate()]

    }

     

    Şeklinde şıp diye olayı çözersin.

    Not: Doğrudan doğruya yardım edemiyorum çünkü hiç ama hiç ihtiyacım olmadı. Çünkü javascript her zaman özgürdür, ne kadar obfuscate edersen et illaki anlamlı hale gelebilir :) (https://lelinhtinh.github.io/de4js/ en mükemmel tool bu konuda)

    Ek: He bir de şu var http://jsnice.org/ 

    by_Tet tarafından 09/Kas/21 23:26 tarihinde düzenlenmiştir

    iyibu! yeniden..
  5. KısayolKısayol reportŞikayet pmÖzel Mesaj
    MhmdAlmz
    MhmdAlmz's avatar
    Kayıt Tarihi: 09/Ağustos/2015
    Erkek

    Client da hiçbir zaman 100% çözüme ulaşamayacağımı biliyorum hocam. Amaç işi zorlaştırmak :D Hırsız var diye kapıyı kilitlemeyelim mi :D


    Andolsun kuşluk vaktine ve dindiği zaman o geceye ki, Rabbin sana veda etmedi ve darılmadı! Ve kesinlikle senin için sonu önünden (ahiret dünyadan) daha hayırlıdır. ileride Rabbin sana verecek de hoşnut olacaksın! O, seni bir yetim iken barındırmadı mı? Seni, yol bilmez iken (doğru) yola koymadı mı? Seni bir yoksul iken zengin etmedi mi? Öyle ise, sakın yetime kahretme (onu horlama)! El açıp isteyeni de azarlama! Fakat Rabbinin nimetini anlat da anlat!
  6. KısayolKısayol reportŞikayet pmÖzel Mesaj
    end
    end's avatar
    Kayıt Tarihi: 16/Ekim/2016
    Erkek

    Niye typescripti obfuscate etmeye çalışıyorsun?

    Browserda renderlanacak şey typescript değil ki.

    Bu gibi framework/libraryler genelde default olarak webpack ile browserin rahat okuyabileceği formata dönüştürülür.

    Bu yüzden webpack pluginlerine bakacaksın derlenmiş kodun karmaşıklaştırılması için.

    Bak burada bir tuto var.

    https://blog.programster.org/add-obfuscation-to-webpack-build

     


    0x0480 takilin madem ﷽﷽﷽
  7. KısayolKısayol reportŞikayet pmÖzel Mesaj
    MhmdAlmz
    MhmdAlmz's avatar
    Kayıt Tarihi: 09/Ağustos/2015
    Erkek

    @end Hocam amacım typescript yada JSX'i karıştırmak değil. Senin de söylediğin gibi derlenmiş kodu karıştırmak istiyorum. Günün sonunda tüm kodların pureJS döndüğü konusunda bilgim var :/

    Ama direkt atıyorum npm run build dediğimde direkt bana karıştırılmış kodu versin.  Attığın linki deneyeceğim teşekkürler ;)


    Andolsun kuşluk vaktine ve dindiği zaman o geceye ki, Rabbin sana veda etmedi ve darılmadı! Ve kesinlikle senin için sonu önünden (ahiret dünyadan) daha hayırlıdır. ileride Rabbin sana verecek de hoşnut olacaksın! O, seni bir yetim iken barındırmadı mı? Seni, yol bilmez iken (doğru) yola koymadı mı? Seni bir yoksul iken zengin etmedi mi? Öyle ise, sakın yetime kahretme (onu horlama)! El açıp isteyeni de azarlama! Fakat Rabbinin nimetini anlat da anlat!
  8. KısayolKısayol reportŞikayet pmÖzel Mesaj
    antichrist
    antichrist's avatar
    Kayıt Tarihi: 15/Ağustos/2021
    Erkek

    Hocam samimi olarak merakımdan soruyorum, front kısmını obfuscate etme amacın nedir? Neleri görmelerini zorlaştırmak istiyorsun? Eğer amacın api url'lerini falan gizlemekse (genelde bu mantıkla yapanları biliyorum) o işin olayı frontu karıştırmaktan ziyade api'yi sağlam dizayn etmekten geçiyor.

    Ayriyetten eğer devtools ve debug modlarını kapatırsan zaten webkit compile aşamasından sonra kodları kendi çapında parçalara bölerek direk kullanılamayacak hale getiriyor ve browser debuggerlarına source kod düşmüyor. Aksi halde debugger ile derlenmemiş source kodları görüntüleme şansın var. Genelde unutulan bir özelliktir.


    ~
  9. KısayolKısayol reportŞikayet pmÖzel Mesaj
    end
    end's avatar
    Kayıt Tarihi: 16/Ekim/2016
    Erkek
    antichrist bunu yazdı

    Hocam samimi olarak merakımdan soruyorum, front kısmını obfuscate etme amacın nedir? Neleri görmelerini zorlaştırmak istiyorsun? Eğer amacın api url'lerini falan gizlemekse (genelde bu mantıkla yapanları biliyorum) o işin olayı frontu karıştırmaktan ziyade api'yi sağlam dizayn etmekten geçiyor.

    Ayriyetten eğer devtools ve debug modlarını kapatırsan zaten webkit compile aşamasından sonra kodları kendi çapında parçalara bölerek direk kullanılamayacak hale getiriyor ve browser debuggerlarına source kod düşmüyor. Aksi halde debugger ile derlenmemiş source kodları görüntüleme şansın var. Genelde unutulan bir özelliktir.

    Source map'ten söz ediyorsun sanırım hocam.


    0x0480 takilin madem ﷽﷽﷽
  10. KısayolKısayol reportŞikayet pmÖzel Mesaj
    MhmdAlmz
    MhmdAlmz's avatar
    Kayıt Tarihi: 09/Ağustos/2015
    Erkek

    Hocam hiçbir client uygulamayı 100% güvenli yapamazsın. Bu konuda fikir sahibiyim. Bendeki amaç biraz farklı her aptal bunu görmesin de işin ehli adam gelsin görsün zaten API bazlı bir açık yok. Ama adam yav bunla mı uğraşacağım diyip geçsin gitsin. Yani çözümü yok diye önlem almamak bence mantıksız. Baktığın zaman Youtube bile daha önlem alamıyor bir sürü video downloaderlar var. Adamlar youtube clonlamış gibi Servislerini kullanıyorlar (Daha önce bende yaptım biliyorum). Olaya şu şekilde yaklaşabilirsiniz. Lamerleri elemek istiyorum.

    Reverse Engineering ile her boku yaparsın zaten hocam bunun bilincindeyim yani. Hiç yoktan iyidir kafası benimki.

    MhmdAlmz tarafından 10/Kas/21 21:08 tarihinde düzenlenmiştir

    Andolsun kuşluk vaktine ve dindiği zaman o geceye ki, Rabbin sana veda etmedi ve darılmadı! Ve kesinlikle senin için sonu önünden (ahiret dünyadan) daha hayırlıdır. ileride Rabbin sana verecek de hoşnut olacaksın! O, seni bir yetim iken barındırmadı mı? Seni, yol bilmez iken (doğru) yola koymadı mı? Seni bir yoksul iken zengin etmedi mi? Öyle ise, sakın yetime kahretme (onu horlama)! El açıp isteyeni de azarlama! Fakat Rabbinin nimetini anlat da anlat!
  11. KısayolKısayol reportŞikayet pmÖzel Mesaj
    end
    end's avatar
    Kayıt Tarihi: 16/Ekim/2016
    Erkek
    MhmdAlmz bunu yazdı

    Hocam hiçbir client uygulamayı 100% güvenli yapamazsın. Bu konuda fikir sahibiyim. Bendeki amaç biraz farklı her aptal bunu görmesin de işin ehli adam gelsin görsün zaten API bazlı bir açık yok. Ama adam yav bunla mı uğraşacağım diyip geçsin gitsin. Yani çözümü yok diye önlem almamak bence mantıksız. Baktığın zaman Youtube bile daha önlem alamıyor bir sürü video downloaderlar var. Adamlar youtube clonlamış gibi Servislerini kullanıyorlar (Daha önce bende yaptım biliyorum). Olaya şu şekilde yaklaşabilirsiniz. Lamerleri elemek istiyorum.

    Elle araya domain kontrol eden obfuscated bir blok koy gec.

    fonksiyonlarin da o blokta olusan variable'i kontrol etsin.

    yani kod blogu silinirse de calismasin.


    0x0480 takilin madem ﷽﷽﷽
Toplam Hit: 5331 Toplam Mesaj: 12
code obfuscation react.js