作为网络应用程序的开发者，你经常需要让用户上传文件到你的应用程序中——主要是图片和视频。您希望您提供的上载界面提供直观的用户体验，包括拖放多个媒体文件、预览选定图像和视频的缩略图、查看上载进度指示等。由于我们现在都生活在云时代，很多用户也会将媒体文件存储在云中，而不仅仅是本地存储在硬盘和移动设备上，因此选择从Facebook等社交网络、Dropbox等云存储服务、Google Photos等照片服务中挑选文件是一个很大的选择优势。介绍新的和改进的Cloudinary上传小部件-现在允许你的用户从他们的Facebook和Google照片相册，从他们的Dropbox帐户或从谷歌图像搜索的结果交互式地选择图像。网络研讨会通过包含一个小的JavaScript库并添加一个JavaScript调用，您可以在web应用程序中嵌入完整的交互式上载UI体验：复制到剪贴板这是一个活生生的例子。单击下面的按钮查看小部件的运行情况并尝试不同的媒体源标签。上传图像上载图像-打开上载小部件函数waitForjQuery（方法）{如果(窗口.jQuery)方法（）；其他{setTimeout（function（）{waitForjQuery（method）}，50）；}}函数insertScript（src，callback）{变量脚本=文档.createElement（"脚本"）；脚本.onload=回拨；脚本.类型='文本/javascript'；脚本.async=真；脚本.src=src；变量s=document.getElementsByTagName（'script'）[0]；美国。parentNode.insertBefore（脚本）；}waitForjQuery（函数（）{insertScript（'//widget.cloudinary.com/global/all.js'，函数（）{cloudinary.applyUploadWidget(文档.getElementById（'upload\uwidget_opener'），{云名称："hzxyensd5"，upload_preset:'aoh4fpwm'，来源：['local'、'url'、'camera'、'image\u search'，"facebook"、"dropbox"、"谷歌照片"]，google_api_key:'aizasydaqj7fo1iqtp9dsb5ynp5jg6f_mItEQ4'，主题：'白色'，缩略图：'。上传多张图片持有人'，button_caption:"上载图像-打开上载小部件"}，在线建站平台，函数（错误，结果）{if（控制台&&控制台.log) { 控制台.log（错误，结果）}}；});});.blog post.post holder a.cloudinary-button{color:white}要查看upload widget在所有媒体源（包括需要HTTPS的摄像机和Dropbox源）中的运行情况，请参阅下面的演示页码：https://demo.cloudinary.com/defaultFrom上传API来完成上传UIA的一点点历史。。。当Cloudinary的图像管理服务于2012年首次推出时，它包含了一个基于云的API，用于将图像上传到云端，并通过动态操作来交付这些图像，物联网的，以匹配您的图形设计。这个API很强大，但只有当我们为流行的开发框架（如rubyonrails、PHP和节点.js，开发人员是否发现从他们的后端应用程序中使用它足够容易。那也不够。我们希望完全不需要开发人员拥有服务器端上传基础设施，所以我们添加了使用JavaScript库（jQuery插件）从浏览器直接上传的支持。然后，web开发领域朝着单页应用程序（SPA）发展，因此我们又向前迈进了一步，并从浏览器中引入了无签名的直接上载，从而消除了在全部。同时我们专注于幕后的API和开发人员组件，我们继续倾听客户的意见，并用我们的第一个前端用户界面组件：上载小部件。它是一个非常可定制的UI组件，支持拖放、相机照片捕捉、进度指示、交互式图像裁剪、媒体预览缩略图等等更多。还有现在，我们很高兴介绍上传小部件的下一个阶段：使您的用户能够从第三方云存储服务和社交网络上传图像。从第三方源上载图像使用JavaScript函数打开小部件时，您现在可以选择多达7个不同的媒体源作为选项卡包含在上载小部件的UI中。当用户选择Facebook、Dropbox或googlephotos标签时，系统会提示他们连接到相关帐户。成功连接后，他们可以交互式地浏览图片搜索结果、Facebook相册、Google照片的图像流或Dropbox中的文件夹和文件帐户。那个然后，从远程媒体源选择的文件将直接上载到您的Cloudinary帐户，并可用于动态操作以匹配您的图形设计。此外，这些文件通过cdnurl发送给用户，针对任何设备、任何浏览器和任何分辨率进行了优化。从Google图像搜索结果中选择文件创建您的Google search API密钥，选择是允许用户搜索整个web还是缩小范围的预定义站点，以及是否包括版权保护模式（例如，仅搜索维基媒体.org可免费用于商业用途）。用户可以键入任何搜索词，然后从中选择一个或多个图像结果。选择来自Facebook相册的照片你可以允许你的用户连接到Facebook并浏览他们的Facebook照片和相册。用户可以从Facebook上选择多张照片，这些照片将上载到您的web应用程序中，然后可以进行进一步的管理、传递和图形处理，例如调整大小和裁剪。注意：你的用户的个人信息不会被媒体上传Facebook收集或使用应用程序。选择图片或视频来自googlephotos类似于Facebook媒体源，你可以允许你的用户连接到他们的googlephotos帐户，浏览他们所有的媒体文件。所选图像可以按原样上载到您的Cloudinary帐户，也可以在上载之前由用户以交互方式裁剪。从Dropbox帐户选择文件Dropbox帐户可以包含任何类型的文件-不仅是图像-Cloudinary的上载API和上载小部件还支持上载任何文件类型（PDF文档、视频、Office文档、文本文件、ZIP文件等）。连接到Dropbox帐户后，宁波大数据，用户可以浏览他们的Dropbox文件夹并选择一个或多个文件，然后将这些文件上载到您的Cloudinary帐户，大数据分析技术，并与动态web模型相关联申请。申请上载小部件可用的所有JavaScript选项和参数的完整列表，看看upload小部件文档上的API参考表页码。朝向一个更好的图像上传用户体验在本文中，我们重点介绍了您可以与upload widget一起使用的新媒体源。widget支持许多可以混合和匹配的附加功能：交互式裁剪、客户端调整大小、外观定制等等。查看我们的文档了解更多信息细节。扰流板警觉的！我们已经在开发upload widget的下一个版本，它将在未来几个月内发布。将支持更多的媒体资源，如更多的社交网络、云存储服务和股票摄影服务。我们还重新设计了一个经过改进的外观和感觉的小部件，企业内部软件，我们正在开发这个小部件，使之成为现代网络的一个中心上传组件应用程序upload widget，包括对本文中描述的所有新媒体源的支持，对于Cloudinary的所有计划都是免费的。你可以在这里创建你的免费帐户。我们当然感谢您的任何反馈！