【H5】Descarga de archivos (javascript)

serie de artículos

[Dispositivos móviles] Especificaciones técnicas de iData 50P
Enlace a este artículo: https://blog.csdn.net/youcheng_ge/article/details/130604517

[H5] Enlace del artículo de enlace bidireccional de datos front-end de Avalon
: https://blog.csdn.net/youcheng_ge/article/details/131067187

[H5] Enlace de la solución de actualización automática de Android (actualización de la aplicación)
a este artículo: https://blog.csdn.net/youcheng_ge/article/details/126759498


prefacio

Este artículo presenta principalmente el mecanismo de actualización automática de software del teléfono (presentado anteriormente, que puede entenderse como un teléfono móvil de grado industrial), ¿por qué quiere hacer esto? Esto se debe a que hay muchos "dispositivos portátiles" en el taller de producción y no es realista enviar O&M para actualizarlos uno por uno. Además, en la etapa inicial del sistema, inevitablemente habrá varios problemas, y es Es necesario lanzar la última versión a tiempo para los "dispositivos portátiles".
Nuestro "mecanismo de actualización" adopta la arquitectura C/S más simple. El servidor (Servidor) implementa una WebAPI y almacena un paquete de actualización en un directorio específico. Cuando el cliente portátil se conecta al servidor, compara automáticamente la versión del software. "Empuje automáticamente Actualizaciones".
inserte la descripción de la imagen aquí

1. Introducción técnica

Uso apiy WebAPItecnología, búsqueda específica en línea.

2. Desarrollo de software (código fuente)

2.1 Código de interfaz (HTML5)

Haga clic para activar el tiempo de descarga del archivo, el siguiente es el código de prueba.
使用到:api.js、框架

<div class="aui-list-item-inner" onclick="checkUpdate(true)">
	<div class="aui-list-item-label">检查新版本</div>
	<div class="aui-list-item-right">
		<i class="aui-iconfont aui-icon-right aui-collapse-arrow"></i>
	</div>
</div>

2.2 Código fuente de backend (C#)

Con Visual Studio, cree un proyecto WebAPI Controllersy cree un controlador QRController.cs en el directorio. Parte del código fuente es el siguiente:

/// <summary>
/// 文件下载-app自动更新机制
/// </summary>
/// <returns>文件字节流</returns>
 [HttpGet]
 public HttpResponseMessage DownloadFile(string a_fileName)
 {
    
    
     try
     {
    
    
         //文件的服务器地址
         string filePath = HttpContext.Current.Server.MapPath("~/") + "filepath\\" + a_fileName;
         if (!File.Exists(filePath))
         {
    
    
             return new HttpResponseMessage(HttpStatusCode.NotFound);
         }

         FileStream stream = new FileStream(filePath, FileMode.Open);
         HttpResponseMessage response = new HttpResponseMessage(HttpStatusCode.OK);
         response.Content = new StreamContent(stream);
         response.Content.Headers.ContentType = new MediaTypeHeaderValue("application/octet-stream");
         response.Content.Headers.ContentDisposition = new ContentDispositionHeaderValue("attachment")
         {
    
    
             FileName = HttpUtility.UrlEncode(a_fileName)
         };
         response.Headers.Add("Access-Control-Expose-Headers", "FileName");
         response.Headers.Add("FileName", HttpUtility.UrlEncode(a_fileName));
         return response;
     }
     catch (Exception)
     {
    
    
         return new HttpResponseMessage(HttpStatusCode.NoContent);
     }
 }

2.3 Código de interfaz de usuario (JavaScript)

Según la URL devuelta por el servidor, el JavaScript del front-end ejecuta la descarga del archivo y muestra una barra de progreso.

	api.download({
    
    
		url: source,
		report: true
	}, function(ret, err) {
    
    
		if (ret && 0 == ret.state) {
    
    
			/* 下载进度 */
			ShowToast("正在下载应用" + ret.percent + "%");
		}
		if (ret && 1 == ret.state) {
    
    
			/* 下载完成 */
			var savePath = ret.savePath;
			api.installApp({
    
    
				/* 安装app */
				appUri: savePath
			});
		}
	});

inserte la descripción de la imagen aquí

3. Visualización de efectos

Ejecute el proyecto WebAPI directamente para ver el efecto.

3.1 Ejecutar el proyecto WebAPI

Tenga en cuenta que debe haber un servicio IP; de lo contrario, puede publicarlo para IISejecutarlo.
inserte la descripción de la imagen aquí

3.2 Ejecutar teléfono Android

inserte la descripción de la imagen aquí

inserte la descripción de la imagen aquí

4. Enlace de recursos

Debe utilizar el marco de interfaz de usuario API.js, puede APICloud官网descargarlo.
https://www.apicloud.com/

Supongo que te gusta

Origin blog.csdn.net/youcheng_ge/article/details/131539397
Recomendado
Clasificación