PDF파일 미리보기 관련 소스코드 추가
parent
737bed2331
commit
2f0b317449
@ -0,0 +1,63 @@
|
||||
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
|
||||
<html>
|
||||
<head>
|
||||
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
||||
|
||||
<!-- Favicon -->
|
||||
<link rel="icon" type="image/x-icon" href="/webjars/image/favicon.ico" />
|
||||
<!-- Fonts -->
|
||||
<link rel="stylesheet" href="/resources/fonts/notoSansKr/fontface.css" />
|
||||
<!-- Icons. Uncomment required icon fonts -->
|
||||
<link rel="stylesheet" href="/webjars/3rd-party/sneat/fonts/boxicons.css" />
|
||||
<link rel="stylesheet" href="/webjars/3rd-party/sneat/fonts/fontawesome.css" />
|
||||
<link rel="stylesheet" href="/resources/fonts/bootstrap-icons.css" />
|
||||
<link rel="stylesheet" href="/resources/fonts/material-icons.css" />
|
||||
<link rel="stylesheet" href="/resources/fonts/xit-icon.css" />
|
||||
|
||||
<!-- Core CSS -->
|
||||
<link rel="stylesheet" href="/webjars/3rd-party/sneat/css/rtl/core.css" class="template-customizer-core-css" />
|
||||
<link rel="stylesheet" href="/webjars/3rd-party/sneat/css/rtl/theme-default.css" class="template-customizer-theme-css" />
|
||||
<link rel="stylesheet" href="/webjars/css/styles.css" />
|
||||
|
||||
<link rel="stylesheet" href="/webjars/applib/css/overwrite.css" />
|
||||
<link rel="stylesheet" href="/webjars/applib/css/applib.css" />
|
||||
|
||||
<link rel="stylesheet" href="/resources/css/fims.css" />
|
||||
|
||||
<!-- Vendors CSS -->
|
||||
<link rel="stylesheet" href="/webjars/3rd-party/sneat/libs/perfect-scrollbar/perfect-scrollbar.css" />
|
||||
|
||||
<title>샘플 보기</title>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div id="example" class="h-px-950">
|
||||
</div>
|
||||
|
||||
<!-- Core JS -->
|
||||
<script src="/webjars/3rd-party/sneat/libs/popper/popper.js"></script>
|
||||
<script src="/webjars/3rd-party/sneat/js/bootstrap.js"></script>
|
||||
<script src="/webjars/3rd-party/sneat/libs/jquery/jquery.js" ></script>
|
||||
|
||||
<script src="/webjars/3rd-party/sneat/js/config.js"></script>
|
||||
<script src="/webjars/3rd-party/sneat/libs/perfect-scrollbar/perfect-scrollbar.js"></script>
|
||||
<script src="/webjars/3rd-party/sneat/js/helpers.js"></script>
|
||||
<script src="/webjars/3rd-party/sneat/js/menu.js"></script>
|
||||
|
||||
<!-- base -->
|
||||
<script src="/webjars/js/base/base.js"></script>
|
||||
<script src="/webjars/js/base/dataset.js"></script>
|
||||
|
||||
<script src="/webjars/applib/js/pdfobject.js"></script>
|
||||
|
||||
<script>
|
||||
|
||||
function makePdfFromBlob(blob){
|
||||
var url = URL.createObjectURL(blob);
|
||||
PDFObject.embed(url, "#example");
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -0,0 +1,341 @@
|
||||
/**
|
||||
* PDFObject v2.2.12
|
||||
* https://github.com/pipwerks/PDFObject
|
||||
* @license
|
||||
* Copyright (c) 2008-2023 Philip Hutchison
|
||||
* MIT-style license: http://pipwerks.mit-license.org/
|
||||
* UMD module pattern from https://github.com/umdjs/umd/blob/master/templates/returnExports.js
|
||||
*/
|
||||
|
||||
(function (root, factory) {
|
||||
if (typeof define === "function" && define.amd) {
|
||||
// AMD. Register as an anonymous module.
|
||||
define([], factory);
|
||||
} else if (typeof module === "object" && module.exports) {
|
||||
// Node. Does not work with strict CommonJS, but
|
||||
// only CommonJS-like environments that support module.exports,
|
||||
// like Node.
|
||||
module.exports = factory();
|
||||
} else {
|
||||
// Browser globals (root is window)
|
||||
root.PDFObject = factory();
|
||||
}
|
||||
}(this, function () {
|
||||
|
||||
"use strict";
|
||||
|
||||
//PDFObject is designed for client-side (browsers), not server-side (node)
|
||||
//Will choke on undefined navigator and window vars when run on server
|
||||
//Return boolean false and exit function when running server-side
|
||||
|
||||
if( typeof window === "undefined" ||
|
||||
window.navigator === undefined ||
|
||||
window.navigator.userAgent === undefined ||
|
||||
window.navigator.mimeTypes === undefined){
|
||||
return false;
|
||||
}
|
||||
|
||||
let pdfobjectversion = "2.2.12";
|
||||
let nav = window.navigator;
|
||||
let ua = window.navigator.userAgent;
|
||||
|
||||
//Time to jump through hoops -- browser vendors do not make it easy to detect PDF support.
|
||||
|
||||
/*
|
||||
IE11 still uses ActiveX for Adobe Reader, but IE 11 doesn't expose window.ActiveXObject the same way
|
||||
previous versions of IE did. window.ActiveXObject will evaluate to false in IE 11, but "ActiveXObject"
|
||||
in window evaluates to true.
|
||||
|
||||
MS Edge does not support ActiveX so this test will evaluate false
|
||||
*/
|
||||
let isIE = ("ActiveXObject" in window);
|
||||
|
||||
/*
|
||||
There is a coincidental correlation between implementation of window.promises and native PDF support in desktop browsers
|
||||
We use this to assume if the browser supports promises it supports embedded PDFs
|
||||
Is this fragile? Sort of. But browser vendors removed mimetype detection, so we're left to improvise
|
||||
*/
|
||||
let isModernBrowser = (window.Promise !== undefined);
|
||||
|
||||
//Older browsers still expose the mimeType
|
||||
let supportsPdfMimeType = (nav.mimeTypes["application/pdf"] !== undefined);
|
||||
|
||||
//Safari on iPadOS doesn't report as 'mobile' when requesting desktop site, yet still fails to embed PDFs
|
||||
let isSafariIOSDesktopMode = ( nav.platform !== undefined &&
|
||||
nav.platform === "MacIntel" &&
|
||||
nav.maxTouchPoints !== undefined &&
|
||||
nav.maxTouchPoints > 1 );
|
||||
|
||||
//Quick test for mobile devices.
|
||||
let isMobileDevice = (isSafariIOSDesktopMode || /Mobi|Tablet|Android|iPad|iPhone/.test(ua));
|
||||
|
||||
//Safari desktop requires special handling
|
||||
let isSafariDesktop = ( !isMobileDevice &&
|
||||
nav.vendor !== undefined &&
|
||||
/Apple/.test(nav.vendor) &&
|
||||
/Safari/.test(ua) );
|
||||
|
||||
//Firefox started shipping PDF.js in Firefox 19. If this is Firefox 19 or greater, assume PDF.js is available
|
||||
let isFirefoxWithPDFJS = (!isMobileDevice && /irefox/.test(ua) && ua.split("rv:").length > 1) ? (parseInt(ua.split("rv:")[1].split(".")[0], 10) > 18) : false;
|
||||
|
||||
|
||||
/* ----------------------------------------------------
|
||||
Supporting functions
|
||||
---------------------------------------------------- */
|
||||
|
||||
let createAXO = function (type){
|
||||
var ax;
|
||||
try {
|
||||
ax = new ActiveXObject(type);
|
||||
} catch (e) {
|
||||
ax = null; //ensure ax remains null
|
||||
}
|
||||
return ax;
|
||||
};
|
||||
|
||||
//If either ActiveX support for "AcroPDF.PDF" or "PDF.PdfCtrl" are found, return true
|
||||
//Constructed as a method (not a prop) to avoid unneccesarry overhead -- will only be evaluated if needed
|
||||
let supportsPdfActiveX = function (){ return !!(createAXO("AcroPDF.PDF") || createAXO("PDF.PdfCtrl")); };
|
||||
|
||||
//Determines whether PDF support is available
|
||||
let supportsPDFs = (
|
||||
//As of Sept 2020 no mobile browsers properly support PDF embeds
|
||||
!isMobileDevice && (
|
||||
//We're moving into the age of MIME-less browsers. They mostly all support PDF rendering without plugins.
|
||||
isModernBrowser ||
|
||||
//Modern versions of Firefox come bundled with PDFJS
|
||||
isFirefoxWithPDFJS ||
|
||||
//Browsers that still support the original MIME type check
|
||||
supportsPdfMimeType ||
|
||||
//Pity the poor souls still using IE
|
||||
(isIE && supportsPdfActiveX())
|
||||
)
|
||||
);
|
||||
|
||||
//Create a fragment identifier for using PDF Open parameters when embedding PDF
|
||||
let buildURLFragmentString = function(pdfParams){
|
||||
|
||||
let string = "";
|
||||
let prop;
|
||||
|
||||
if(pdfParams){
|
||||
|
||||
for (prop in pdfParams) {
|
||||
if (pdfParams.hasOwnProperty(prop)) {
|
||||
string += encodeURIComponent(prop) + "=" + encodeURIComponent(pdfParams[prop]) + "&";
|
||||
}
|
||||
}
|
||||
|
||||
//The string will be empty if no PDF Params found
|
||||
if(string){
|
||||
|
||||
string = "#" + string;
|
||||
|
||||
//Remove last ampersand
|
||||
string = string.slice(0, string.length - 1);
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
return string;
|
||||
|
||||
};
|
||||
|
||||
let embedError = function (msg, suppressConsole){
|
||||
if(!suppressConsole){
|
||||
console.log("[PDFObject] " + msg);
|
||||
}
|
||||
return false;
|
||||
};
|
||||
|
||||
let emptyNodeContents = function (node){
|
||||
while(node.firstChild){
|
||||
node.removeChild(node.firstChild);
|
||||
}
|
||||
};
|
||||
|
||||
let getTargetElement = function (targetSelector){
|
||||
|
||||
//Default to body for full-browser PDF
|
||||
let targetNode = document.body;
|
||||
|
||||
//If a targetSelector is specified, check to see whether
|
||||
//it's passing a selector, jQuery object, or an HTML element
|
||||
|
||||
if(typeof targetSelector === "string"){
|
||||
|
||||
//Is CSS selector
|
||||
targetNode = document.querySelector(targetSelector);
|
||||
|
||||
} else if (window.jQuery !== undefined && targetSelector instanceof jQuery && targetSelector.length) {
|
||||
|
||||
//Is jQuery element. Extract HTML node
|
||||
targetNode = targetSelector.get(0);
|
||||
|
||||
} else if (targetSelector.nodeType !== undefined && targetSelector.nodeType === 1){
|
||||
|
||||
//Is HTML element
|
||||
targetNode = targetSelector;
|
||||
|
||||
}
|
||||
|
||||
return targetNode;
|
||||
|
||||
};
|
||||
|
||||
let generatePDFObjectMarkup = function (embedType, targetNode, url, pdfOpenFragment, width, height, id, title, omitInlineStyles, customAttribute, PDFJS_URL){
|
||||
|
||||
//Ensure target element is empty first
|
||||
emptyNodeContents(targetNode);
|
||||
|
||||
let source = url;
|
||||
|
||||
if(embedType === "pdfjs"){
|
||||
//If PDFJS_URL already contains a ?, assume querystring is in place, and use an ampersand to append PDFJS's file parameter
|
||||
let connector = (PDFJS_URL.indexOf("?") !== -1) ? "&" : "?";
|
||||
source = PDFJS_URL + connector + "file=" + encodeURIComponent(url) + pdfOpenFragment;
|
||||
} else {
|
||||
source += pdfOpenFragment;
|
||||
}
|
||||
|
||||
let el_type = (embedType === "pdfjs" || embedType === "iframe") ? "iframe" : "embed";
|
||||
let el = document.createElement(el_type);
|
||||
|
||||
el.className = "pdfobject";
|
||||
el.type = "application/pdf";
|
||||
el.title = title;
|
||||
el.src = source;
|
||||
|
||||
if(id){
|
||||
el.id = id;
|
||||
}
|
||||
|
||||
if(el_type === "iframe"){
|
||||
el.allow = "fullscreen";
|
||||
el.frameborder = "0";
|
||||
}
|
||||
|
||||
if(!omitInlineStyles){
|
||||
|
||||
let style = (el_type === "embed") ? "overflow: auto;" : "border: none;";
|
||||
|
||||
if(targetNode !== document.body){
|
||||
//assign width and height to target node
|
||||
style += "width: " + width + "; height: " + height + ";";
|
||||
} else {
|
||||
//this is a full-page embed, use CSS to fill the viewport
|
||||
style += "position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%;";
|
||||
}
|
||||
|
||||
el.style.cssText = style;
|
||||
|
||||
}
|
||||
|
||||
//Allow developer to insert custom attribute on embed/iframe element, but ensure it does not conflict with attributes used by PDFObject
|
||||
let reservedTokens = ["className", "type", "title", "src", "style", "id", "allow", "frameborder"];
|
||||
if(customAttribute && customAttribute.key && reservedTokens.indexOf(customAttribute.key) === -1){
|
||||
el.setAttribute(customAttribute.key, (typeof customAttribute.value !== "undefined") ? customAttribute.value : "");
|
||||
}
|
||||
|
||||
targetNode.classList.add("pdfobject-container");
|
||||
targetNode.appendChild(el);
|
||||
|
||||
return targetNode.getElementsByTagName(el_type)[0];
|
||||
|
||||
};
|
||||
|
||||
let embed = function(url, targetSelector, options){
|
||||
|
||||
//If targetSelector is not defined, convert to boolean
|
||||
let selector = targetSelector || false;
|
||||
|
||||
//Ensure options object is not undefined -- enables easier error checking below
|
||||
let opt = options || {};
|
||||
|
||||
//Get passed options, or set reasonable defaults
|
||||
let id = (typeof opt.id === "string") ? opt.id : "";
|
||||
let page = opt.page || false;
|
||||
let pdfOpenParams = opt.pdfOpenParams || {};
|
||||
let fallbackLink = (typeof opt.fallbackLink === "string" || typeof opt.fallbackLink === "boolean") ? opt.fallbackLink : true;
|
||||
let width = opt.width || "100%";
|
||||
let height = opt.height || "100%";
|
||||
let title = opt.title || "Embedded PDF";
|
||||
let assumptionMode = (typeof opt.assumptionMode === "boolean") ? opt.assumptionMode : true;
|
||||
let forcePDFJS = (typeof opt.forcePDFJS === "boolean") ? opt.forcePDFJS : false;
|
||||
let supportRedirect = (typeof opt.supportRedirect === "boolean") ? opt.supportRedirect : false;
|
||||
let omitInlineStyles = (typeof opt.omitInlineStyles === "boolean") ? opt.omitInlineStyles : false;
|
||||
let suppressConsole = (typeof opt.suppressConsole === "boolean") ? opt.suppressConsole : false;
|
||||
let forceIframe = (typeof opt.forceIframe === "boolean") ? opt.forceIframe : false;
|
||||
let PDFJS_URL = opt.PDFJS_URL || false;
|
||||
let targetNode = getTargetElement(selector);
|
||||
let fallbackHTML = "";
|
||||
let pdfOpenFragment = "";
|
||||
let customAttribute = opt.customAttribute || {};
|
||||
let fallbackHTML_default = "<p>This browser does not support inline PDFs. Please download the PDF to view it: <a href='[url]'>Download PDF</a></p>";
|
||||
|
||||
//Ensure URL is available. If not, exit now.
|
||||
if(typeof url !== "string"){ return embedError("URL is not valid", suppressConsole); }
|
||||
|
||||
//If target element is specified but is not valid, exit without doing anything
|
||||
if(!targetNode){ return embedError("Target element cannot be determined", suppressConsole); }
|
||||
|
||||
//page option overrides pdfOpenParams, if found
|
||||
if(page){ pdfOpenParams.page = page; }
|
||||
|
||||
//Stringify optional Adobe params for opening document (as fragment identifier)
|
||||
pdfOpenFragment = buildURLFragmentString(pdfOpenParams);
|
||||
|
||||
|
||||
// --== Do the dance: Embed attempt #1 ==--
|
||||
|
||||
//If the forcePDFJS option is invoked, skip everything else and embed as directed
|
||||
if(forcePDFJS && PDFJS_URL){
|
||||
return generatePDFObjectMarkup("pdfjs", targetNode, url, pdfOpenFragment, width, height, id, title, omitInlineStyles, customAttribute, PDFJS_URL);
|
||||
}
|
||||
|
||||
// --== Embed attempt #2 ==--
|
||||
|
||||
//Embed PDF if traditional support is provided, or if this developer is willing to roll with assumption
|
||||
//that modern desktop (not mobile) browsers natively support PDFs
|
||||
if(supportsPDFs || (assumptionMode && !isMobileDevice)){
|
||||
|
||||
//Should we use <embed> or <iframe>? In most cases <embed>.
|
||||
//Allow developer to force <iframe>, if desired
|
||||
//There is an edge case where Safari does not respect 302 redirect requests for PDF files when using <embed> element.
|
||||
//Redirect appears to work fine when using <iframe> instead of <embed> (Addresses issue #210)
|
||||
//Forcing Safari desktop to use iframe due to freezing bug in macOS 11 (Big Sur)
|
||||
let embedtype = (forceIframe || supportRedirect || isSafariDesktop) ? "iframe" : "embed";
|
||||
|
||||
return generatePDFObjectMarkup(embedtype, targetNode, url, pdfOpenFragment, width, height, id, title, omitInlineStyles, customAttribute);
|
||||
|
||||
}
|
||||
|
||||
// --== Embed attempt #3 ==--
|
||||
|
||||
//If everything else has failed and a PDFJS fallback is provided, try to use it
|
||||
if(PDFJS_URL){
|
||||
return generatePDFObjectMarkup("pdfjs", targetNode, url, pdfOpenFragment, width, height, id, title, omitInlineStyles, customAttribute, PDFJS_URL);
|
||||
}
|
||||
|
||||
// --== PDF embed not supported! Use fallback ==--
|
||||
|
||||
//Display the fallback link if available
|
||||
if(fallbackLink){
|
||||
|
||||
fallbackHTML = (typeof fallbackLink === "string") ? fallbackLink : fallbackHTML_default;
|
||||
targetNode.innerHTML = fallbackHTML.replace(/\[url\]/g, url);
|
||||
|
||||
}
|
||||
|
||||
return embedError("This browser does not support embedded PDFs", suppressConsole);
|
||||
|
||||
};
|
||||
|
||||
return {
|
||||
embed: function (a,b,c){ return embed(a,b,c); },
|
||||
pdfobjectversion: (function () { return pdfobjectversion; })(),
|
||||
supportsPDFs: (function (){ return supportsPDFs; })()
|
||||
};
|
||||
|
||||
}));
|
||||
Loading…
Reference in New Issue