• uniapp 部署h5，pdf预览

    1.hubuilderx 打包h5。

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

    解压部署包：unzip h5.zip  。

    3.nginx配置。

    1. user  root;
    2. worker_processes  1;
    3. #worker_cpu_affinity 0001 0010 0100 1000;
    4. #error_log  logs/error.log;
    5. #error_log  logs/error.log  notice;
    6. error_log  /var/log/nginx/error.log  info;
    7.  
    8. pid        /run/nginx.pid;
    9.  
    10.  
    11. events {
    12.     use epoll;
    13.     worker_connections  65535;
    14. }
    15.  
    16. http {
    17.     include       mime.types;
    18.     default_type  application/octet-stream;
    19.  
    20.     log_format log_access '$remote_addr - $remote_user [$time_local] "$request" $http_host '
    21.                           '$status $body_bytes_sent "$http_referer" '
    22.                           '"$http_user_agent" "$http_x_forwarded_for" '
    23.                           '"$upstream_addr" "$upstream_status" $upstream_cache_status "$upstream_http_content_type" "$upstream_response_time" > $request_time ' ;
    24.  
    25.     server_tokens off;
    26.     sendfile on;
    27.     tcp_nopush on;
    28.     tcp_nodelay on;
    29.  
    30.     client_body_timeout  20;
    31.     client_header_timeout 20;
    32.     keepalive_timeout  3000;
    33.     send_timeout       20;
    34.  
    35.     gzip on;
    36.     gzip_min_length  1k;
    37.     gzip_buffers     4 16k;
    38.     gzip_http_version 1.0;
    39.     gzip_comp_level 2;
    40.     gzip_types       text/plain application/x-javascript text/css application/xml application/javascript  application/octet-stream;
    41.     gzip_vary on;
    42.  
    43.     server {
    44.         listen       9527;
    45.         server_name  localhost 109.29.219.139;
    46.  
    47.         location /h5 {
    48.            alias  /home/app/exam/h5/;
    49.            index  index.html index.htm;
    50.            try_files $uri $uri/ /index.html =404;
    51.         }
    52.  
    53.         location /static {
    54.            root  /home/app/exam/h5;
    55.         }
    56.         error_page   500 502 503 504  /50x.html;
    57.  
    58.         location = /50x.html {
    59.            root   html;
    60.         }
    61.     }
    62. }

    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

    1.  
    2. types {
    3.     text/html                                        html htm shtml;
    4.     text/css                                         css;
    5.     text/xml                                         xml;
    6.     image/gif                                        gif;
    7.     image/jpeg                                       jpeg jpg;
    8.     application/javascript                           js mjs;
    9.     application/atom+xml                             atom;
    10.     application/rss+xml                              rss;
    11.  
    12.     text/mathml                                      mml;
    13.     text/plain                                       txt;
    14.     text/vnd.sun.j2me.app-descriptor                 jad;
    15.     text/vnd.wap.wml                                 wml;
    16.     text/x-component                                 htc;
    17.  
    18.     image/avif                                       avif;
    19.     image/png                                        png;
    20.     image/svg+xml                                    svg svgz;
    21.     image/tiff                                       tif tiff;
    22.     image/vnd.wap.wbmp                               wbmp;
    23.     image/webp                                       webp;
    24.     image/x-icon                                     ico;
    25.     image/x-jng                                      jng;
    26.     image/x-ms-bmp                                   bmp;
    27.  
    28.     font/woff                                        woff;
    29.     font/woff2                                       woff2;
    30.  
    31.     application/java-archive                         jar war ear;
    32.     application/json                                 json;
    33.     application/mac-binhex40                         hqx;
    34.     application/msword                               doc;
    35.     application/pdf                                  pdf;
    36.     application/postscript                           ps eps ai;
    37.     application/rtf                                  rtf;
    38.     application/vnd.apple.mpegurl                    m3u8;
    39.     application/vnd.google-earth.kml+xml             kml;
    40.     application/vnd.google-earth.kmz                 kmz;
    41.     application/vnd.ms-excel                         xls;
    42.     application/vnd.ms-fontobject                    eot;
    43.     application/vnd.ms-powerpoint                    ppt;
    44.     application/vnd.oasis.opendocument.graphics      odg;
    45.     application/vnd.oasis.opendocument.presentation  odp;
    46.     application/vnd.oasis.opendocument.spreadsheet   ods;
    47.     application/vnd.oasis.opendocument.text          odt;
    48.     application/vnd.openxmlformats-officedocument.presentationml.presentation
    49.                                                      pptx;
    50.     application/vnd.openxmlformats-officedocument.spreadsheetml.sheet
    51.                                                      xlsx;
    52.     application/vnd.openxmlformats-officedocument.wordprocessingml.document
    53.                                                      docx;
    54.     application/vnd.wap.wmlc                         wmlc;
    55.     application/wasm                                 wasm;
    56.     application/x-7z-compressed                      7z;
    57.     application/x-cocoa                              cco;
    58.     application/x-java-archive-diff                  jardiff;
    59.     application/x-java-jnlp-file                     jnlp;
    60.     application/x-makeself                           run;
    61.     application/x-perl                               pl pm;
    62.     application/x-pilot                              prc pdb;
    63.     application/x-rar-compressed                     rar;
    64.     application/x-redhat-package-manager             rpm;
    65.     application/x-sea                                sea;
    66.     application/x-shockwave-flash                    swf;
    67.     application/x-stuffit                            sit;
    68.     application/x-tcl                                tcl tk;
    69.     application/x-x509-ca-cert                       der pem crt;
    70.     application/x-xpinstall                          xpi;
    71.     application/xhtml+xml                            xhtml;
    72.     application/xspf+xml                             xspf;
    73.     application/zip                                  zip;
    74.  
    75.     application/octet-stream                         bin exe dll;
    76.     application/octet-stream                         deb;
    77.     application/octet-stream                         dmg;
    78.     application/octet-stream                         iso img;
    79.     application/octet-stream                         msi msp msm;
    80.  
    81.     audio/midi                                       mid midi kar;
    82.     audio/mpeg                                       mp3;
    83.     audio/ogg                                        ogg;
    84.     audio/x-m4a                                      m4a;
    85.     audio/x-realaudio                                ra;
    86.  
    87.     video/3gpp                                       3gpp 3gp;
    88.     video/mp2t                                       ts;
    89.     video/mp4                                        mp4;
    90.     video/mpeg                                       mpeg mpg;
    91.     video/quicktime                                  mov;
    92.     video/webm                                       webm;
    93.     video/x-flv                                      flv;
    94.     video/x-m4v                                      m4v;
    95.     video/x-mng                                      mng;
    96.     video/x-ms-asf                                   asx asf;
    97.     video/x-ms-wmv                                   wmv;
    98.     video/x-msvideo                                  avi;
    99. }

    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能正常预览。

  • 相关阅读:
    【Qt炫酷动画】3.QPauseAnimation暂停动画类
    （附源码）ssm医疗管理系统 毕业设计 260952
    小程序分销商城功能展示；
    Golang基本的网络编程
    autoware.ai docker安装
    骑行耳机哪个品牌好，推荐五款最适合骑行佩戴的五款耳机
    TypeScript入门
    python 调用钉钉机器人接口案例一则 —— 筑梦之路
    react redux demo
    SPI通信----基本原理
  • 原文地址：https://blog.csdn.net/xiaoxiangzi520/article/details/136382204