Vue Google Seçici
Geçen hafta Vue ile genel bir Dosya Yükleyici gördük .
Şimdi Google Drive'dan nasıl dosya seçebileceğimizi görelim.
Google ile İlk Kurulum
Git https://console.developers.google.com. Bir proje oluşturun .
Projenizi oluşturduktan sonra listelenecektir, oluşturduğunuz projeye tıklayın .
Bu iletişim kutusunu göreceksiniz .
İki kimlik bilgisi oluşturmanız gerekecek:
- API Anahtarı
- OAuth İstemci Kimliği
OAuth İstemci Kimliği Oluşturma:
OAuth istemci kimliği oluşturmak için öncelikle izin ekranında bir ürün adı ayarlamanız gerekir.
Burada OAuth onay ekranınıza (yukarıdaki resimde görüldüğü gibi), aşağıdaki gibi Uygulama ayrıntılarını girin:
- Uygulama Adı,
- Uygulama Logosu ve
- Yetkili Etki Alanı.
OAuth İstemci Kimliğini oluşturmaya devam edin.
OAuth istemci kimliğini başarıyla oluşturduğunuzda. Benzersiz bir Müşteri Kimliği ve gizli bir anahtar alacaksınız .
Şimdi Kontrol Paneli ekranına gidin ve adımları izleyin:
- “ API'leri ve Hizmetleri Etkinleştir ”i tıklayın.
- " Google Picker API " ifadesini arayın ve API'yi etkinleştirin .
Vue Kurulumu ve Yeni Bir Uygulama Oluşturma .
( Daha önce yapıldıysa sonraki bölüme geçin. )
Düğüm v8.9 veya üzerinin kurulu olduğu verilen vue-cli'yi yükleyin.
Veya
Yeni bir Proje oluşturma.
Bir GDriveSelector bileşeni oluşturun ve bu bileşenin takılı yaşam döngüsü kancasına Google API komut dosyasını ekleyin.
Bileşenin gerekli veri özelliklerini bildirin .
Google Drive'a Bağlanmak İçin İşlevleri Tanımlama
- Google Kimlik Doğrulamasını yöneten ve Seçiciyi Yükleyen işlev
- Google Kimlik Doğrulama Sonucunu işleyen işlev
- Seçiciyi oluşturan işlev
- Seçici için geri arama işlevi
Her şey ayarlandıktan sonra artık Google Dosya Seçici özelliğinizi test etmeye hazırsınız.
Basit bir çalışma örneğini burada bulabilirsiniz .
Repo'yu burada bulabilirsiniz .
Bu Zamansız'ı temsil eden Karthik .
Bu blog yazısını yararlı bulursanız bir arkadaşınızla paylaşın.
Herhangi bir zorlukla karşılaşırsanız lütfen yorumlarınızı eklemekten çekinmeyin.
Önümüzdeki hafta Vue ile Dropbox Chooser API'si geliyor.
Pratik Tasarım'ı takip edin ve takipte kalın.
Suggested posts
Tasarımda iki yıl - İyi, kötü ve çirkin…
"Hey Siri, Olivia Dean'in Me Dive oyununu çal." Nijerya, Akure'deki Future Academy Africa'da stajıma başladığımda Mayıs 2021'di.
“O küçük ada her şeyi değiştirir”
Sürücü deneyimini yükseltmek için Lyft Canlı Etkinlikleri nasıl tasarladık?
Yolculuk paylaşımı için ezber bozan bir şey Lyft'te yaptığımız her şey arasında, sürücüler ve sürücüler arasındaki alışmaların koreografisini yapmak en karmaşık ve önemli olanlardan biridir. Bu koreografiyi başarmak, Lyft'in pek çok şeyi iyi yapmasına bağlıdır, ancak yalnızca binicileri hıza uydurmak çok önemlidir.
Related posts
Jordan Neely Cinayeti ve “Vatansever” Irkçılık Sorunu
ABD, ırkçı davranışı iyi bir Amerikalı olmakla bir tutmamak gibi temel adımı atabilir mi?
[Tetik uyarısı: Bu makale, Jordan Neely'nin katilini öven insanların ekran görüntülerini içerir.] Kolluk kuvvetleri nihayet - ve belki de isteksizce - Jordan Neely'yi ölene kadar boğan Daniel Penny'yi bu cinayetle suçladı.
O Tehdit Arşivi: Cilt 7 Black Basta
Günümüzün birbirine bağlı dünyasında, siber saldırı tehdidi her zamankinden daha yaygın. Siber suçlular ve ulus-devlet aktörleri sürekli olarak güvenlik açıklarından yararlanmaya ve değerli verileri çalmaya çalışarak her büyüklükteki kuruluş için önemli bir risk oluşturuyor.
Neden bazı serbest çalışanlar hayatlarını taklit ediyorlar?
Geçenlerde dünyanın en büyük profesyonel sosyal ağı olan Linkedin'deydim ve dikkatimi çeken, takip ettiğim serbest tasarımcıların gönderilerini buldum. Hepsi uçaklardan, dizüstü bilgisayarlarıyla sahilden, yüzme havuzlarından ve muhteşem manzaralı ofislerden fotoğraflar yayınladılar.