uniapp 部署h5,pdf预览

1.hubuilderx 打包h5。

2.上传部署包到服务器。

解压部署包:unzip h5.zip  。

3.nginx配置。

user  root;
worker_processes  1;
#worker_cpu_affinity 0001 0010 0100 1000;
#error_log  logs/error.log;
#error_log  logs/error.log  notice;
error_log  /var/log/nginx/error.log  info;pid        /run/nginx.pid;events {use epoll;worker_connections  65535;
}http {include       mime.types;default_type  application/octet-stream;log_format log_access '$remote_addr - $remote_user [$time_local] "$request" $http_host ''$status $body_bytes_sent "$http_referer" ''"$http_user_agent" "$http_x_forwarded_for" ''"$upstream_addr" "$upstream_status" $upstream_cache_status "$upstream_http_content_type" "$upstream_response_time" > $request_time ' ;server_tokens off;sendfile on;tcp_nopush on;tcp_nodelay on;client_body_timeout  20;client_header_timeout 20;keepalive_timeout  3000;send_timeout       20;gzip on;gzip_min_length  1k;gzip_buffers     4 16k;gzip_http_version 1.0;gzip_comp_level 2;gzip_types       text/plain application/x-javascript text/css application/xml application/javascript  application/octet-stream;gzip_vary on;server {listen       9527;server_name  localhost 109.29.219.139;location /h5 {alias  /home/app/exam/h5/;index  index.html index.htm;try_files $uri $uri/ /index.html =404;}location /static {root  /home/app/exam/h5;}error_page   500 502 503 504  /50x.html;location = /50x.html {root   html;}}
}

4.启动docker容器。

docker run --name exam_h5_nginx  -p 9527:9527   -d -v /usr/local/nginx/conf/exam_h5_nginx.conf:/etc/nginx/nginx.conf -v /home/app:/home/app nginx

 5.至此已部署完成,访问发现预览pdf时报错。

 Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "application/octet-stream". Strict MIME type checking is enforced for module scripts per HTML spec。

原因为pdfjs中的mjs文件无法识别返回了默认类型"application/octet-stream"。导致无法预览pdf。

6.问题解决。

增加mjs 到javascript类型。

vim /usr/local/nginx/conf/exam_h5_mime.types


types {text/html                                        html htm shtml;text/css                                         css;text/xml                                         xml;image/gif                                        gif;image/jpeg                                       jpeg jpg;application/javascript                           js mjs;application/atom+xml                             atom;application/rss+xml                              rss;text/mathml                                      mml;text/plain                                       txt;text/vnd.sun.j2me.app-descriptor                 jad;text/vnd.wap.wml                                 wml;text/x-component                                 htc;image/avif                                       avif;image/png                                        png;image/svg+xml                                    svg svgz;image/tiff                                       tif tiff;image/vnd.wap.wbmp                               wbmp;image/webp                                       webp;image/x-icon                                     ico;image/x-jng                                      jng;image/x-ms-bmp                                   bmp;font/woff                                        woff;font/woff2                                       woff2;application/java-archive                         jar war ear;application/json                                 json;application/mac-binhex40                         hqx;application/msword                               doc;application/pdf                                  pdf;application/postscript                           ps eps ai;application/rtf                                  rtf;application/vnd.apple.mpegurl                    m3u8;application/vnd.google-earth.kml+xml             kml;application/vnd.google-earth.kmz                 kmz;application/vnd.ms-excel                         xls;application/vnd.ms-fontobject                    eot;application/vnd.ms-powerpoint                    ppt;application/vnd.oasis.opendocument.graphics      odg;application/vnd.oasis.opendocument.presentation  odp;application/vnd.oasis.opendocument.spreadsheet   ods;application/vnd.oasis.opendocument.text          odt;application/vnd.openxmlformats-officedocument.presentationml.presentationpptx;application/vnd.openxmlformats-officedocument.spreadsheetml.sheetxlsx;application/vnd.openxmlformats-officedocument.wordprocessingml.documentdocx;application/vnd.wap.wmlc                         wmlc;application/wasm                                 wasm;application/x-7z-compressed                      7z;application/x-cocoa                              cco;application/x-java-archive-diff                  jardiff;application/x-java-jnlp-file                     jnlp;application/x-makeself                           run;application/x-perl                               pl pm;application/x-pilot                              prc pdb;application/x-rar-compressed                     rar;application/x-redhat-package-manager             rpm;application/x-sea                                sea;application/x-shockwave-flash                    swf;application/x-stuffit                            sit;application/x-tcl                                tcl tk;application/x-x509-ca-cert                       der pem crt;application/x-xpinstall                          xpi;application/xhtml+xml                            xhtml;application/xspf+xml                             xspf;application/zip                                  zip;application/octet-stream                         bin exe dll;application/octet-stream                         deb;application/octet-stream                         dmg;application/octet-stream                         iso img;application/octet-stream                         msi msp msm;audio/midi                                       mid midi kar;audio/mpeg                                       mp3;audio/ogg                                        ogg;audio/x-m4a                                      m4a;audio/x-realaudio                                ra;video/3gpp                                       3gpp 3gp;video/mp2t                                       ts;video/mp4                                        mp4;video/mpeg                                       mpeg mpg;video/quicktime                                  mov;video/webm                                       webm;video/x-flv                                      flv;video/x-m4v                                      m4v;video/x-mng                                      mng;video/x-ms-asf                                   asx asf;video/x-ms-wmv                                   wmv;video/x-msvideo                                  avi;
}

7.删除原来的容器重新运行。

docker rm -f exam_h5_nginx 

docker run --name exam_h5_nginx  -p 9527:9527   -d -v /usr/local/nginx/conf/exam_h5_nginx.conf:/etc/nginx/nginx.conf -v /usr/local/nginx/conf/exam_h5_mime.types:/etc/nginx/mime.types -v /home/app:/home/app nginx

8.pdf能正常预览。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/509679.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

抖店怎么入驻?具体的入驻流程是什么?新手一看就会!

我是电商珠珠 新的一年开始了,又有不少新手小伙伴入驻了抖店。我做电商已经五年了,做抖店做了三年多,期间带着学员一起做店。所以对于他们所犯的这些操作错误,相信部分新手小伙伴也会犯错,为了让大家少走点弯路&#…

便携式气象站的工作原理

TH-BQX8便携式气象站是一种轻便、易于携带的气象监测设备,它能够快速部署在需要监测的区域,实时监测和记录气象环境数据。与全自动气象监测站相比,便携式气象站更加注重移动性和灵活性,适用于临时性的气象监测任务或特定区域的气象…

【大厂AI课学习笔记NO.58】(11)混淆矩阵

混淆矩阵(confusion matrix)—— 混淆矩阵(Confusion Matrix)是人工智能领域,特别是在机器学习和深度学习中,用于衡量分类模型性能的重要工具。它通过统计分类模型的真实分类与预测分类之间的结果&#xf…

12. Nginx进阶-Location

简介 Nginx的三大区块 在Nginx中主要配置包括三个区块,结构如下: http { #协议级别include /etc/nginx/mime.types;default_type application/octet-stream;log_format main $remote_addr - $remote_user [$time_local] "$r…

javascript中对包含关系判断介绍

本文将为您详细讲解 JavaScript 中对包含关系的判断,包括数组、字符串等,并提供相应的代码例子。 1. 数组包含关系判断 在 JavaScript 中,数组包含关系判断通常使用 Array.prototype.includes() 方法。这个方法返回一个布尔值,表示…

辽宁博学优晨教育视频:引领安全可靠的学习新风尚

在数字化时代,随着信息技术的飞速发展,线上教育已成为越来越多人提升自我、拓宽视野的重要选择。辽宁博学优晨教育视频凭借其安全可靠的特质,在众多在线教育平台中脱颖而出,成为广大学子信赖的学习伙伴。 一、辽宁博学优晨教育视频…

Docker创建Reids容器

1.默认拉取Redis最新镜像版本 docker pull redis 2.下载redis配置文件 https://download.redis.io/releases/ 3.下载配置文件后手动更改密码,链接时间等信息 绑定地址(bind):默认情况下,Redis 只会监听 localhost…

【MySQL 系列】在 Windows 上安装 MySQL

在 Windows 平台上安装 MySQL 很简单,并不需要太复杂的步骤。按照本文的步骤操练起来就可以了。 文章目录 1、下载 MySQL 安装程序2、安装 MySQL 数据库2.1、选择安装类型2.2、检查所需组件2.3、安装所选产品组件2.4、产品配置2.5、配置高可用性2.6、配置服务器类型…

【Boost搜索引擎项目】Day1 项目介绍+去标签和数据清洗框架搭建

🌈欢迎来到C项目专栏 🙋🏾‍♀️作者介绍:前PLA队员 目前是一名普通本科大三的软件工程专业学生 🌏IP坐标:湖北武汉 🍉 目前技术栈:C/C、Linux系统编程、计算机网络、数据结构、Mysq…

华容道问题求解第一部分_详细设计(一)之棋子和游戏类_初始化部分

按:因为自控力和能力的原因,这个其实是在和代码同时进行的。 主要 类 说明 这一层是整个项目的基础,将对未来的算法的效率产生重要影响。为了和界面隔离,以及自身逻辑的清晰,下面的两个类是必须的,棋子类…

MySQL篇—执行计划之覆盖索引Using index和条件过滤Using where介绍(第三篇,总共三篇)

☘️博主介绍☘️: ✨又是一天没白过,我是奈斯,DBA一名✨ ✌✌️擅长Oracle、MySQL、SQLserver、Linux,也在积极的扩展IT方向的其他知识面✌✌️ ❣️❣️❣️大佬们都喜欢静静的看文章,并且也会默默的点赞收藏加关注❣…

文献速递:帕金森的疾病分享--使用功能性磁共振成像和机器学习预测帕金森病深部脑刺激的最优参数

文献速递:帕金森的疾病分享–使用功能性磁共振成像和机器学习预测帕金森病深部脑刺激的最优参数 Title 题目 Predicting optimal deep brain stimulation parameters for Parkinson’s disease using functional MRI and machine learning 使用功能性磁共振成像…