Angularjs kullanarak işlevsellik gibi gmail eki önizlemesi oluşturmayı umuyoruz

Question

Dosya önizlemesini kullanıcılara göstermek istediğim bir gereksinimim var.

Desteklenen çeşitli dosya türleri vardır; .pdf, .xlsx, .doc, .rar, .jpeg, .png ve daha fazlası.

Kullanıcı önizlemeyi tıkladığında, dosyanın önizlemesinin görüntülendiği açılır pencerede dosyayı açmalıdır. Kullanıcı Zoom-in, Zoom-out, Dosyayı indirebilir. Eklenti önizlemesi için gmail’i görebildiğiniz gibi.

Lütfen, herkes beni aynı kütüphaneye veya yararlı bir kaynağa yönlendirebilir. Bunu yapmanın iki temel yolu vardır

Answer 1

önceden

teşekkürler.

1) Sunucu tarafı: Önizlemeleri sunucu tarafında (dosya yükleme sırasında) jpg/png görüntülerine dönüştürün ve önizlemeleri sunucuda saklayın. Bu, istemci tarafında uygulanması en kolay olanıdır, ancak sunucuda ekstra depolama gerektirir.

2) İstemci tarafı: Tarayıcıda javascript ile önizlemelerin 'canlı' olmasını sağlayın, bu işlem sunucunun yapması/depolanması gereken miktarı azaltır, ancak istemcinin dosyayı belleğe almadan önce tam olarak belleğe yüklemesini gerektirir Büyük dosyalar için bir sorun olabilir. Ayrıca, çoğu kitaplık belirli bir dosya biçimini hedefleyeceğinden, her bir dosya türü için olası javascript kitaplıklarına ihtiyacınız olacaktır. Sunucu Tarafı, muhtemelen önerilen yoldur. Web sunucunuz için ne kullanıyorsunuz?

Answer 2

Belge görüntüleyici oluşturmaya çalışıyorsunuz.

Tarayıcı, bu formatları anlamadığı için bana büyük bir çalışma yapın. Tarayıcı görüntüleri doğrudan tuval üzerine işleyebilir, ancak diğer dosyaları nasıl oluşturacağını bilmez. Yani, resim formatları dışındaki herhangi bir dosya, onları geçici olarak sunucuya kaydetmeli ve daha sonra tarayıcıda akışa ve ilgili dosya görüntüleyiciyi kullanarak göstermeye ihtiyaç duyar.

doc ve xlsx dosyalarını pdf'ye dönüştürebilir ve pdf görüntüleyici (http://ngmodules.org/modules/ng-pdfviewer) kullanarak bu dosyaları gösterebilirsiniz. İnternette çok sayıda belge çevirici bulunmaktadır (ancak lisanslama koşullarını GPL lisanslı olduğundan, ticari projelerde kullanılamayacağından dolayı kontrol etmeniz gerekmektedir).

Bu işi kaydetmek istiyorsanız o zaman gibi https://crocodoc.com/why-crocodoc/

Ayrıca google doc görüntüleyici google doc veiwer

Answer 3

kullanmayı deneyebilirsiniz Bu soru oldukça olanlarda html5 belgeleri dönüştürmek için tüm boya almak üçüncü parti sunucu gitmek geniş. Bir ek görüntüleyici direktifinin nasıl uygulanacağıyla ilgili tüm adımları atlamıyorum, ancak burada yararlı bulabileceğiniz bazı göstergeler var.

Kullanıcının dosyayı indirmesine izin vermek için, bir yere bir indirme bağlantısı eklemeniz yeterlidir. Eki Amazon S3, Google Cloud Storage veya başka bir bulut depolama hizmetinde barındırıyorsanız, belgelerini kontrol edin. Dosyaları kendi sunucunuzdan karşıdan yüklüyorsanız, HTTP yanıt üstbilgisini attachment; filename="ORIGINAL_FILENAME" olarak ayarladığınızdan emin olun; burada ORIGINAL_FILENAME, indirme bağlantısını tıklattıklarında görüntülenen kaydetme iletişim kutusunda görmesini istediğiniz dosya adıdır.

Artık görüntüleyiciye.

PDF dosyaları için pdfJS kullanırdım. Bunun için here bir açısal yönergesi var.

Diğer dosyalar için eMM'ye bir PDF'ye dönüştürmek ve daha sonra pdfJS'de görüntülemek için CloudConvert gibi bir şeye bakabilirsiniz, ancak daha sonra PDF'ye orijinal dosyalara ek olarak sunucunuzda da saklamak isteyebilirsiniz ekstra depolama gerektirir. Ayrıca, Google Dokümanlar görüntüleyicisini veya this answer numaralı belgede açıklandığı gibi Office 365 görüntüleyicisini de kullanabilirsiniz.