Bilgisayar-Bilişim Teknolojileri
Ana Sayfa
Bilişim Teknolojileri Forumu Son Konuları
24 Saat
Bilişim Teknolojileri - Formatör - Bilgisayar Öğretmeni Kayıt
Kayıt Olun
iletişim
iletişim
Detaylı Arama
Arama

React JS kullanan var mı. Yeterince güvenli mi ?

Konu, 'Programlama Dilleri' kısmında uysal_rockci tarafından paylaşıldı.


Sayfayı Paylaş /bbnetsosyal

  1. uysal_rockci

    uysal_rockci Süper Üye Süper Üye Seçkin Üye

    Kayıt:
    23 Eylül 2011
    Mesajlar:
    1.022
    Beğeni:
    17
    Merhaba arkadaşlar,
    Bir süredir React JS öğrenmeye başladım. Daha önce PHP ile başlamış olduğum bir projeyi tamamen React JS ile yeniden yazmaya karar vermek üzereyim. Aklıma takılan bazı sorunlar var ama en önemlisi React JS ile yazılan bir proje PHP ile yazılan kadar güvenli midir ?
    React'a güvenebilir miyim ?
    Sonuçta Php ile yapılan iş ve işlemler server side çalışırken React ile yapılan iş ve işlemler ClientSide çalışıyor. Biraz uğraşılırsa developer araçları ile kodlar , state ler vb. değerler e erişim sağlanabiliyor gördüğüm kadarı ile.
    Veritabanı olarak Google Firebase/Firestore kullanmayı planlıyorum ama ilerde sıkıntı yaşar mıyım acaba.
    Aramızda kullanan var ise , yorumlarını esirgemezse sevinirim.

    Eğer React ile devam etmeye karar verirsem, baştan sona ders gibi videolaştırmayı planlıyorum.
     
  2. vlk4n

    vlk4n Seçkin Üye Seçkin Üye

    Kayıt:
    16 Eylül 2007
    Mesajlar:
    817
    Beğeni:
    21
    Merhabalar facebook tarafından geliştiriliyor. Ve açık kaynak bir proje ayrıca githubda 130bin den fazla star almış 1303 geliştiriciye sahip. Bence hem güvenilir hemde kullanılabilirdir. Ayrıca son zamanlarda popüler olan vuejs bakabilirsiniz
     
    uysal_rockci bunu beğendi.
  3. Parhelion

    Parhelion Seçkin Üye Seçkin Üye

    Kayıt:
    22 Mart 2008
    Mesajlar:
    978
    Beğeni:
    53
    Hocam react, angular, vue vs. bunların tümü sizin de belirttiğiniz üzere client-side çalışan ön yüz geliştirme çatılarıdır. Siz yine arka tarafta php, asp, pyhton vb. ile asıl uygulamanızı bir json api tarzında yazarsınız, react ile kodladığınız ön yüz ise bu api'ye istekler gönderir ve aldığı cevaplar doğrultusunda farklı state'lere geçer. Tümüyle birbirinden izole bir backend-frontend yapısı oluşur. (Bunun birçok avantajı bulunmaktadır. Örneğin ileride aynı sisteme backend'de hiçbir değişikliğe gerek kalmadan mobil uygulama da yazabilirsiniz.) Bu yüzden güvenlik tarafındaki konular bunların işi değildir. Dediğiniz gibi, developer araçları üzerinden ön taraftaki herşeye zaten müdahale edilebilmektedir. Güvenlik önlemlerini siz yine arka tarafta alırsınız.

    En basitinden, login işlemlerinde geleneksel yöntemlerde bildiğiniz üzere session veya cookie kullanılır. Fakat bu tarz backend ve frontend izole edilmiş çözümlerde session ve cookie'ler çok verimli olmaz. Bunun yerine cookie'lere benzeyen token (jeton) sistemleri bulunmaktadır. Token sisteminde frontend'de girilen kullanıcı adı ve şifresi yazdığınız backend api'ye post edilir. Doğru giriş alınması durumunda backend'den json formatında bir success cevabı gelir. Cevabın içerisinde bir de token değeri bulunur. Bu değer aslında anlık üretilmiş uzun bir şifredir. Frontend token'ı alır ve local storage'de depolar ve oturum açılmış olur. Artık sonraki request'lerde bu token request header'ına eklenerek gönderilir ve api gelen isteğin kimden geldiğini bilir. Oturum kapatmak için token'a expire verebilirsiniz. Token sisteminizi tamamen kendiniz yazabilirsiniz veya jwt (json web token) gibi standartlaşmış sistemler de kullanabilirsiniz.

    Kısaca siz business logic'inizi zaten backend tarafında gerçekleştirdiğiniz için frontend tarafta token'ı güvenli depolamak dışında düşünmeniz gereken çok birşey yoktur. Yapabileceğiniz birşey de yoktur.

    Bahsettiğiniz firebase vb için de yine bir ara api (proxy) yazmanız gerekir. Aksi takdirde firebase api anahtarınız herkese açık hale gelir :)
     
    krtls, uysal_rockci ve netman bunu beğendi.
  4. uysal_rockci

    uysal_rockci Süper Üye Süper Üye Seçkin Üye

    Kayıt:
    23 Eylül 2011
    Mesajlar:
    1.022
    Beğeni:
    17
    Cevaplar için teşekkür ediyorum arkadaşlar.
    ReactJS yi sevmemdeki en temel neden, server masrafından beni kurtarıyor olması ve tüm iş yükünü Client Side pc ye yüklemesi. Aynı zamanda Google Firebase Hosting hizmeti ile de bunu desteklemesiydi. Bu yüzden hem kendimi geliştirmek hem de ReactJS furyasına katılarak component yapısını kullanmak için kendi Panelimi tasarlamak için https://themeforest.net/item/fuse-react-react-redux-material-design-admin-template/21769397 React temasını satın aldım ve genel yapıyı oldukça başarılı buldum.

    Benim için olaylar şu şekilde gelişti.
    Bu tema içinde firebase kullanarak login vs işlemleri hallettim. Daha sonra güvenlik için firebase/firestore kuralları oluşturdum. kullanıcı yetkilerini düzenledim ve kurallara ekledim.
    Temel düzeyde ( CRUD ) db işlemlerini hallettim. Realtime db olayını inceledim. ilk projemi derledim ve test ettim. k
    Proje linkini ilk çalıştırdığım zaman açılış sayfasının yüklenmesi ve görüntülenmesi 5+sn zaman geçiyor. Ama bundan sonra sayfa geçişleri çok hızlı. Bu açılış hızı dezavantaj olsa da sonraki hızlar ve realtime değişimleri gözlemlemek güzel.
    ama derlenene projeyi developer tools ile kurcaladığımda tüm kodlaramı görüyorum. Buna firebase api key vs. de dahil. api key in ulu orta meydanda durması bana zarar verir mi.
    Yol başındayken zaten bildiğim PHP veya NodeJS ile mi devam etsem diye düşünmüyor değilim. Bu arada Projem temel düzeyde CRM sistemi.
    ReactJS nin yapısı hoşuma gitti ama güvenlik bu projede oldukça önemli benim için.
     
  5. alpaygunes

    alpaygunes Süper Üye Süper Üye

    Kayıt:
    3 Ekim 2007
    Mesajlar:
    1.624
    Beğeni:
    106
    React ile geliştirdiğiniz uygulamayı nadıl dağıtacaksınız.
    Mobil app , web , pc
    Kesin cevap için biraz daha bilgi lazım.

    Aslında API olmadan olmaz .
    Front ve backend i ayrmanız iyi olur.
    Php ve react birbirinin alternatifi değil ortağı gibidir.
     
    Son düzenleme: 11 Temmuz 2019
    uysal_rockci bunu beğendi.
  6. Parhelion

    Parhelion Seçkin Üye Seçkin Üye

    Kayıt:
    22 Mart 2008
    Mesajlar:
    978
    Beğeni:
    53
    Hocam yazmıştım aslında ama okumamışsınız sanırım. Geleneksel mimariyi unutarak düşünmelisiniz. API key ön tarafta olmaz direk halka açmış oluyorsunuz. Ben oradan keyi alıp her şeyi yapabilirim db'nizde. Bunun yerine -php nodejs ne kullanacağınız size kalmış-, bir oturum sisteminiz olmak durumunda. Frontendde kullanıcı adı şifresi alınır, APIye gönderilir, doğruysa token alınır ve isteklere eklenerek gönderilir. Backend ise istekten gelen tokena bakar, kime aitse o kullanıcıya göre isteği firebase'e iletir, firebase'den gelen cevabı ise işler ve frontende verir. Firebase ile muhatapta olan backend'dir. Böylece api key backend tarafında kalır ve kimseye açmamış olursunuz. Tüm iş bu şekilde katmanlı olarak yürür. Hatta bir de Firebase ayarlarından sunucu ip'niz dışındaki yerlerden bağlantıya izin vermezseniz yeterli derecede güvenliği sağlamış olursunuz.

    Edit: Çekinceniz de server masrafı ise o zaman yine Firebase'in kendi içinde kullanıcı sistemi de mevcut direk onu kullanın (firebase auth)
    https://medium.com/@AdamRNeary/firebase-custom-authentication-with-no-backend-736c016ed433
     
    uysal_rockci bunu beğendi.
  7. uysal_rockci

    uysal_rockci Süper Üye Süper Üye Seçkin Üye

    Kayıt:
    23 Eylül 2011
    Mesajlar:
    1.022
    Beğeni:
    17
    Öncelikle cevabınız için teşekkür ederim.
    Uygulamayı Web üzerinden dağıtacağım. ileriki aşamalarda Mobil de eklenir belki.
    Satın almış olduğum React Teması ile istediğim arayüz vb. işlemleri hallettim. hiç bir api veya backend olmadan sadece react ile geliştirmeye devam etmek mantıklı değil o zaman. Eski usül Php ile apiler tasarlayıp React ile kullanılabilir. Ya da NodeJS ye mi yönelmeliyim , emin olamadm.



    Önelikle cevabınız için çok teşekkürler .
    Oturum açma yönetimi için FirebaseAuth kullandım . Ama buradaki kuralları ne kadar da kendime göre değiştirmiş daha güvenilir yapmış olsam da api key vb bilgilerin açık olması güvenlik riski oluşturur mu. Sonuçta oturum açmayan kullanıcı sisteme giremiyor, sisteme girenler ise sadece kendilerine ait verilere ulaşabiliyorlar. Ellerinde api key olsa da kendi verileri dışında diğer verilere ulaşma riski var mı acaba.

    React ve Firebase/Firestore birbiri içinde oldukça uyumlu. Yapılan değişiklikleri gerçek zamanlı ( realtime ) görmek oldukça eğlenceli. Bütün React hosting işini Google'a yıkıp , oturum açma ve DB işlemlerini de aynı şekilde Google Firebase'e yıkıp uygulama geliştirmek sizce mantıklı mı. Öncelikle ilk aşamada sunucu masrafım olmayacak tüm işi Google yapacak. Ama zaten bildiğim PHP den vazgeçip React furyasında ilerlenmeli mi acaba ?

    Aynı işi PHP ile yapsam VDS alıp gerekli sunucu , apache, mysql , güvenlik vb. bütün işlemleri kendim halletmem gerekecek. Acaba sunucuda güvenlik açığı var mı diye düşüneceğim belki. Diğer taraftan Google Firebase / Hosting hizmetine güvenip de React ile mi yola çıkmalıyım acaba ?

    ayın 15inde projeyi kesinleştirmiş olup yoluma devam etmek istiyorum, hadi hayırlısı bakalım.
     
  8. alpaygunes

    alpaygunes Süper Üye Süper Üye

    Kayıt:
    3 Ekim 2007
    Mesajlar:
    1.624
    Beğeni:
    106
    Şuan en popüler kullanım şekli
    Ön uçta js çatısı
    Arka uçta API

    Bu ileryen süreçte elinizi rahatlatır.

    Arkauçta php node arısında kalmayın derim.
    Node server birazdaha maliyetli
    Nodesj socket uygulaması yapmayacaksan tercih etme.
    Php biliyorsan nodeye gerek yok bence.

    Laravel lumen vb API için özelleşmiş bir framework araştır. Bir günde çözersin. Bir iki route tanımladıktan sonra tekrara aynı şeyleri yapıyorsun. Db den aldığın veriyi json olaral respons ediyorsun. Gerisi reacta kalıyor.
     
  9. uysal_rockci

    uysal_rockci Süper Üye Süper Üye Seçkin Üye

    Kayıt:
    23 Eylül 2011
    Mesajlar:
    1.022
    Beğeni:
    17
    Teşekkürler cevabınız için.
    Php de özellikle Laravelde hiç bir sıkıntım yok, Son 3 projemi Laravel üzerinden yaptım. Bayağı bir haşır neşirim.

    React ile PHP api kullanarak devam edersem, o zaman Php + jQuery ile yaptığım işi Php + React ile yapmış olacağım.
    Realtime olarak Firebase db değişikliklerini React üzerinde anında değişmesi hoşuma gidiyordu, ama api olayına girince biraz durum değişecek biraz.

    En iyisi o zaman fazla heyecan yaratmadan PHP , Laravel + jQuery + Sadece gerektiği ekranlarda React JS olmak üzere yoluma devam etmek.
    En mantıklı tercih bu gözüküyor şu anda :)

    Tüm yorumlar için teşekkür ediyorum arkadaşlar .
     
  10. Parhelion

    Parhelion Seçkin Üye Seçkin Üye

    Kayıt:
    22 Mart 2008
    Mesajlar:
    978
    Beğeni:
    53
    @uysal_rockci hocam kusura bakmayın api key konusunda bir noktada yanlış yönlendirme yapmışım düzeltme yazmak istedim. Firebase için uygulamanızdaki tüm işlemleriniz yetkilendirme istediği ve ayrıca firebase auth'u da kullandığınız durumda read-write yetkilerini zaten konsolda kişilere veya gruplara özel tanımladığınız için api key'in halka açık olmasında bir problem oluşmuyor. Saldırgan api ile konuşabilse de elinde token olmadığı için veritabanında bir işlem gerçekleştiremiyor.

    Sonuç olarak da sunucu taraflı ihtiyaç tamamen ortadan kalkmış oluyor.
     
  11. uysal_rockci

    uysal_rockci Süper Üye Süper Üye Seçkin Üye

    Kayıt:
    23 Eylül 2011
    Mesajlar:
    1.022
    Beğeni:
    17
    Cevap için teşekkürler hocam. Firebase Auth ile oturum yönetimi yaptığımız zaman ve aynı zamanda da Firebase Realtime DB / FireStore ile kuralları ( RULES ) düzenlediğimiz zaman bu durumda ekstra bir Sunucu / API olmaksızın veritabanı güvenliğini sağlamış oluyoruz.
    Bu durumda elimizdeki tek dezavantaj sayfayı çalıştıran kodların ve state vb bilgilerin kullanıcı (Client) bilgisayarında developer tools tarafından görülebilmesi olcaktır.
    Sistemdeki tüm kodlar görülse bile , DB'ye erişim olmayacaktır. Yani kullanıcı yetkisi dışında bir işlem yapamayacaktır. Doğru anlamış mıyım hocam.
     
  12. klmno

    klmno Süper Üye Süper Üye

    Kayıt:
    30 Kasım 2015
    Mesajlar:
    1.391
    Beğeni:
    42
  13. Parhelion

    Parhelion Seçkin Üye Seçkin Üye

    Kayıt:
    22 Mart 2008
    Mesajlar:
    978
    Beğeni:
    53
    Evet aynen öyle hocam işlem yapabilmesi için ayrıca oturum açıp token alması gerekecek ki o tokenla da zaten ona verdiğiniz yetkiler çerçevesinde işlem yapabilir ve kimliği de belli olur. Sonuçta önemli olan da veritabanına yetkisiz erişim açığı vermemek olduğu için kodları görmesinde de çok bir sakınca kalmamış oluyor. Ayrıca kodlar siz production build aldığınızda kullanılan tüm npm paketleri ile tek js dosyasına bundle edileceği için karmakarışık bir hale gelecektir bu da yeterince caydırıcı olur zaten. Hatta buna rağmen içiniz rahat etmezse üstüne bir de obfuscate yaparsınız kimsenin uğraşmaya gözü almaz.

    Bu arada kusura bakmayın biraz plaza ağzı gibi yazıyorum ama bazı kavramlar artık terimleşmiş tam Türkçe karşılığı olmuyor malesef.
     
  14. uysal_rockci

    uysal_rockci Süper Üye Süper Üye Seçkin Üye

    Kayıt:
    23 Eylül 2011
    Mesajlar:
    1.022
    Beğeni:
    17
    Sıkıntı yok hocam ne kusuru . Aksine terimleri olduğu gibi kullandığınız zaman ingilizce kaynaklara erişmek ve işin doğrusunu çözmek benim içn daha kolay oluyor. React olayı güzel hoşuma gitti. Tabi bir gün Google engellenirse tüm emek bir anda boşa çıkar :D
    O da zor, yani olmaz inşallah diyorum :)
    Öyle ya da böyle bu React olayına gireceğiz , yakından takip etmek lazım yazılım dünyasını.
    Cevaplarınız için teşekkür ediyorum.
     

Sayfayı Paylaş /bbnetsosyal