');-webkit-mask-repeat:no-repeat;-webkit-mask-position:50% 0;-webkit-mask-size:.5em 1em;-webkit-clip-path:inset(0 0 calc(1em - .5em) 0)padding-box;clip-path:inset(0 0 calc(1em - .5em) 0)padding-box;background-color:currentColor!important;margin-left:.125rem;padding:0 .25em;opacity:.84}code,pre{font-family:fira code,monospace;color:#212121}pre{overflow:auto;margin:0}code{font-size:85%;background-color:#f8f8f8;border-radius:6px;padding:.2em .4em;margin:0}.highlight{position:relative}.highlight pre{background-color:#f8f8f8!important;border-radius:8px}.highlight code{display:table;width:100%;padding:16px;font-size:13px;line-height:1.6;text-size-adjust:100%;-ms-text-size-adjust:100%;-moz-text-size-adjust:100%;-webkit-text-size-adjust:100%}.btn{display:inline-block;background-color:#055deb;color:#fff;font-size:16px;line-height:1.5;font-weight:700;text-align:center;text-decoration:none;padding:14px 24px;border-radius:28px;vertical-align:middle;border:2px solid transparent;will-change:background-color,color}.btn.btn-small{padding:10px 24px}@media screen and (max-width:640px){.btn{padding:14px 16px}}.btn.product-bg{background-color:var(--product-color)}.btn-bordered{background-color:transparent;border-color:#055deb;color:#055deb}.btn-white-bordered{background-color:transparent;border-color:#fff;color:#fff}.icon-button{position:relative;width:48px;height:48px;border-radius:50%}.icon-button .icon{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:24px;color:#055deb}.arrow-link{display:inline-flex;align-items:center;text-decoration:none;font-size:16px;font-weight:700;line-height:1.2;margin:0;padding:0}.arrow-link span{color:inherit;border-bottom:1px solid transparent}.arrow-link svg{width:20px;height:20px}.arrow-link.prev span{margin-left:4px;padding-top:2px;order:2}#cookie-notice{display:none;position:fixed;background-color:rgba(35,37,38,.97);left:0;right:0;bottom:-200px;box-shadow:0 -1px 14px rgba(0,0,0,6%),0 -1px 2px rgba(0,0,0,4%),0 -5px 15px rgba(0,0,0,4%);transform:translateZ(0);animation:slideUpCookieNotice .6s 1s ease-in forwards;z-index:100}#cookie-notice .cookie-content{position:relative;display:flex;align-items:center;justify-content:center;padding-top:12px;padding-bottom:12px}#cookie-notice .cookie-text{color:rgba(255,255,255,.7);font-size:14px}#cookie-notice .cookie-text a{text-decoration:none;color:rgba(255,255,255,.7);border-bottom:1px solid rgba(255,255,255,.54)}@media screen and (max-width:576px){#cookie-notice .cookie-text{padding-right:146px}}#cookie-notice .agree-btn{margin:0 0 0 24px;padding:12px 24px}@media screen and (max-width:576px){#cookie-notice .agree-btn{position:absolute;display:flex;align-items:center;justify-content:center;top:0;right:0;bottom:0;padding:12px 16px;border-radius:0}}@keyframes slideUpCookieNotice{100%{bottom:0}}input,textarea{font-family:pragmatica,Helvetica,Arial,sans-serif;font-size:16px;padding:12px 16px;border-radius:3px;border:1px solid #c6c6c6;margin-bottom:28px}input::-moz-placeholder,textarea::-moz-placeholder{color:#8f95a3}input::-moz-placeholder,textarea::-moz-placeholder{color:#8f95a3}input~.error-message{visibility:hidden;color:#ff4a4a;font-size:13px;line-height:16px;margin-top:-24px;margin-bottom:8px}@media screen and (max-width:640px){input~.error-message{display:none}}input:not(:focus):not(:placeholder-shown):valid{border-color:#c6c6c6}textarea{overflow:auto;overflow-wrap:break-word;resize:none}select{display:none}.with-tooltip{--tooltip-bg-color:rgba(35, 37, 38, .87);--tooltip-font-size:14px;--tooltip-font-weight:700;--tooltip-text-color:white;--tooltip-strong-text-color:white;--tooltip-border-radius:3px;--tooltip-padding:12px;--tooltip-border-width:1px;--tooltip-border-color:transparent;--tooltip-box-shadow:none;position:relative}.with-tooltip.idea-style{--tooltip-bg-color:#f7f7f7;--tooltip-font-size:12px;--tooltip-font-weight:400;--tooltip-text-color:#666;--tooltip-strong-text-color:#212121;--tooltip-padding:8px 12px 10px;--tooltip-border-color:#bdbdbd;--tooltip-box-shadow:0 2px 6px 0 rgba(0, 0, 0, .19)}.with-tooltip.idea-style .tooltip-text strong{font-weight:400}.with-tooltip .tooltip-text{font-family:pragmatica,Helvetica,Arial,sans-serif;position:absolute;visibility:hidden;overflow:visible;opacity:0;bottom:109%;left:0;padding:var(--tooltip-padding);background-color:var(--tooltip-bg-color);font-size:var(--tooltip-font-size);font-weight:var(--tooltip-font-weight);color:var(--tooltip-text-color);border-radius:var(--tooltip-border-radius);border:var(--tooltip-border-width)solid var(--tooltip-border-color);box-shadow:var(--tooltip-box-shadow);width:auto;min-width:240px;z-index:1000}.with-tooltip .tooltip-text strong{color:var(--tooltip-strong-text-color)}.with-tooltip.arrow-tooltip .tooltip-text{left:50%;transform:translateX(-50%);bottom:116%}.with-tooltip.arrow-tooltip .tooltip-text:before{content:'';position:absolute;width:0;height:0;bottom:-8px;left:50%;transform:translateX(-50%);border-left:8px solid transparent;border-right:8px solid transparent;border-top:8px solid var(--tooltip-bg-color)}.with-tooltip.arrow-tooltip .tooltip-text:after{content:'';position:absolute;width:0;height:0;bottom:-9px;left:50%;transform:translateX(-50%);border-left:8px solid transparent;border-right:8px solid transparent;border-top:8px solid var(--tooltip-border-color);z-index:-1}form{display:flex;flex-direction:column;text-align:left}form label{display:block;font-size:14px;color:#212121;font-weight:700;margin-bottom:4px}form .form-actions{margin-top:32px}form .form-actions .submit-holder .btn{width:100%}.loading-screen{display:none}.loading-screen .loading-screen-container{display:flex;flex-direction:column;justify-content:center;align-items:center;position:fixed;top:0;right:0;bottom:0;left:0;background-color:rgba(255,255,255,.95);z-index:1001;text-align:center}.loading-screen .sending .text{margin-top:12px;margin-left:10px}.loading-screen .error{display:none;max-width:640px;margin:0 auto}.loading-screen .error .title{font-size:30px;font-weight:300;padding-top:32px;margin-bottom:16px}.loading-screen .error .btn-back .arrow-link{margin-top:40px;margin-left:-24px}.expandable-section .expandable-section-link .link-show-more [class*=text-]{border-bottom:2px solid transparent}.expandable-section .expandable-section-link .link-show-more .text-hide{display:none}.animated-arrow-icon.to-left{transform:scaleX(-1)}.animated-arrow-icon .arrow-container{transform:translateX(-4px)}.animated-arrow-icon .arrow-line{stroke-dasharray:13px;stroke-dashoffset:13px}body,html{height:100%;margin:0;padding:0;color:#212121;font-family:pragmatica,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}html{scroll-padding-top:64px}.wrapper{min-height:100%;display:flex;flex-direction:column;align-items:stretch}.main{flex-grow:1}.content-holder{position:relative;max-width:1260px;margin-right:auto;margin-left:auto;padding-right:40px;padding-left:40px}@media screen and (max-width:768px){.content-holder{padding-right:32px;padding-left:32px}}@media screen and (max-width:480px){.content-holder{padding-right:20px;padding-left:20px}}.section-content{padding-top:80px;padding-bottom:80px}@media screen and (max-width:768px){.section-content{padding-top:56px;padding-bottom:56px}}.page-content{padding-top:calc(var(--navbar-height) + 40px);padding-bottom:80px}@media screen and (max-width:768px){.page-content{padding-top:calc(var(--navbar-height) + 24px);padding-bottom:56px}}#navbar{position:absolute;width:100%;height:var(--navbar-height);z-index:1000;background-color:var(--navbar-color)}#navbar .content-holder{height:100%}#navbar .nav-container{display:flex;height:100%;align-items:center}.navigation{height:100%}@media screen and (max-width:876px){.navigation{display:none}}.navigation .nav-list{display:flex;height:100%;list-style:none}#navbar{--navbar-item-bg:rgba(255, 255, 255, .12);--navbar-item-underline:rgba(255, 255, 255, .75)}.nav-item{display:flex;align-items:center;padding:0 22px;border-radius:0 0 8px 8px;-webkit-transform:translateZ(0)}@media screen and (max-width:1200px){.nav-item{padding:0 14px}}@media screen and (max-width:1024px){.nav-item{padding:0 10px}}.nav-item:last-child.button{padding:0 0 0 10px}.nav-item:last-child.link{padding:0 0 0 22px}.nav-item.opens-subnav{border-radius:0}.nav-item .nav-link{text-decoration:none;font-size:15px;color:var(--navbar-link-color);font-weight:700;line-height:20px;opacity:.75}@media screen and (min-width:961px){.nav-item .nav-link{font-size:16px}}.nav-item .nav-link span{padding-bottom:1px;border-bottom:1px solid transparent}.nav-item .nav-link.with-caret-icon:after{content:'';display:inline-block;vertical-align:middle;margin:-3px 0 0 6px;border-bottom:2px solid #fff;border-right:2px solid #fff;width:6px;height:6px;transform:rotate(45deg);transform-origin:66% 66%}.nav-item .nav-link.with-caret-icon span{border-style:dotted}.nav-item .nav-link.external-link{display:flex}.nav-item .nav-link.external-link span{margin-bottom:-2px}.nav-item .nav-link.dotted-underline span{border-style:dotted}.nav-item .nav-button{padding:10px 20px;line-height:1.2}@media screen and (max-width:1024px){.nav-item .nav-button{padding:8px 12px}}@media screen and (max-width:991px){.nav-item .nav-button{font-size:14px;padding:8px}}@media screen and (min-width:1101px){.nav-item .short-name{display:none}}@media screen and (max-width:1100px){.nav-item .short-name+span{display:none}}.mobile-subnav .subsection-holder .subsection-title,.subnav-topbar .title-holder .title{color:rgba(0,0,0,.38);font-size:20px;font-weight:300}.subnav{visibility:hidden;opacity:0;background-color:#fff;will-change:opacity}@media screen and (max-width:876px){.subnav{width:100%;overflow-x:hidden}}.subnav .desktop-subnav,.subnav .mobile-subnav{display:none;height:100%}@media screen and (min-width:877px){.subnav .desktop-subnav{display:block}}.subnav .desktop-subnav .subsection{display:none}@media screen and (max-width:876px){.subnav .mobile-subnav{display:block}}.subnav .content-holder{overflow:auto}@media screen and (min-width:877px){.subnav .content-holder{padding-top:32px}}.subnav .navigation{display:block;padding-bottom:32px;height:auto}@media screen and (min-width:877px){.subnav .navigation{border-bottom:1px dotted rgba(0,0,0,.16);margin-bottom:32px}}.subnav .navigation .nav-list .nav-item{padding:0 32px 0 0}.subnav .navigation .nav-list .nav-item .nav-link{font-size:16px;font-weight:400;color:#212121;opacity:1}.subnav .navigation .nav-list .nav-item .nav-link.with-caret-icon:after{display:none}.mobile-subnav .subnav-body{display:flex;width:200%;height:calc(var(--app-window-height) - var(--navbar-height) - 72px);will-change:transform}.mobile-subnav .nav-holder,.mobile-subnav .subsection-holder{width:100%}.mobile-subnav .subsection-holder{will-change:transform}.mobile-subnav .subsection-holder .subsection{display:none}.mobile-subnav .subsection-holder .subsection-title{margin:16px 0 12px}.mobile-subnav .navigation{padding:0 0 12px}.mobile-subnav .navigation .nav-list{flex-direction:column}.mobile-subnav .navigation .nav-list .nav-item{padding:0;margin:0 -16px}.mobile-subnav .navigation .nav-list .nav-item .nav-link{width:100%;padding:20px 16px;border-radius:3px}.mobile-subnav .navigation .nav-list .nav-item .nav-button{color:#055deb;border:1px solid;margin:8px 16px;padding:12px 32px;min-width:220px}@media screen and (max-width:480px){.mobile-subnav .navigation .nav-list .nav-item .nav-button{width:100%}}.subnav-topbar{position:relative;padding:12px 0}@media screen and (min-width:877px){.subnav-topbar{display:none}}.subnav-topbar .subnav-underline{position:absolute;left:0;bottom:0;width:100%;height:1px;background:linear-gradient(90deg,rgba(0,0,0,.12),rgba(0,0,0,.12) 50%,transparent 0,transparent);background-size:6px 1px}.subnav-topbar .topbar-holder{display:flex;align-items:center;justify-content:space-between}.subnav-topbar .title-holder{display:flex;align-items:center}.subnav-topbar .title-holder .arrow-link{display:none}.subnav-topbar .close-btn{margin-right:-6px}.subnav-topbar .close-btn .icon-button .icon{color:rgba(0,0,0,.26)}@media screen and (max-width:876px){.subnav-content{margin-top:16px}}@media screen and (min-width:877px){.subnav-content.services .category-products{flex-direction:row}.subnav-content.services .category-products .product-item:not(:first-child){margin-left:24px}}.subnav-content .section .heading{color:#055deb;font-size:24px;font-weight:300;padding-top:0;margin-bottom:24px}@media screen and (min-width:877px){.subnav-content .section .heading{display:none}}@media screen and (max-width:876px){.subnav-content .section .heading{color:#8f95a3;font-size:20px}}.subnav-content .section .heading+.category{margin-top:-16px}.subnav-content ul{list-style:none}.subnav-content .categories{display:flex;flex-direction:row;-moz-column-gap:32px;column-gap:32px}@media screen and (max-width:876px){.subnav-content .categories{flex-direction:column}}.subnav-content .category{padding:0 40px 40px 0}@media screen and (max-width:876px){.subnav-content .category{padding-bottom:24px;padding-right:0}}.subnav-content .category .subheading{color:#8f95a3;font-size:14px;margin-bottom:10px}@media screen and (min-width:877px){.subnav-content .category .subheading{font-size:16px}}.subnav-content .category-products{display:flex;flex-direction:column}.product-item:not(:last-child){margin-bottom:6px}@media screen and (min-width:877px){.product-item{margin-left:-16px}}@media screen and (max-width:876px){.product-item{margin-right:0}}.product-item .product-link{display:flex;flex-direction:row;align-items:center;padding:16px;border-radius:8px;min-width:100px;text-decoration:none}@media screen and (min-width:877px){.product-item .product-link{max-width:400px}}@media screen and (max-width:876px){.product-item .product-link{padding:14px 16px;margin-left:-16px;margin-right:-16px}}.product-item .product-link.with-description{align-items:flex-start}.product-item .product-link .external-link{display:flex}.product-item .product-link svg{flex-shrink:0;margin-right:12px;width:44px;height:44px}@media screen and (max-width:876px){.product-item .product-link svg{margin:0 16px 0 0;width:32px;height:32px}}.product-item .product-link span{font-size:15px;color:#212121}@media screen and (max-width:876px){.product-item .product-link span{font-size:16px}}.product-item .product-link .description{font-size:14px;color:#6a707f;margin-top:4px}#navbar{--logo-underline:white;--product-main-logo:white;--menu-icon:white;--menu-icon-border:rgba(255, 255, 255, .54)}.logo .logo-nav-link .icon-menu{font-size:24px;color:var(--menu-icon)}.logo .logo-nav-link .icon-menu:before{display:flex;align-items:center;justify-content:center;height:40px;width:40px}.logo{height:100%;margin-right:auto}.logo .logo-nav-link{display:flex;align-items:center;text-decoration:none;height:100%;padding:0 20px;margin-left:-20px;will-change:width}@media screen and (max-width:876px){.logo .logo-nav-link{display:flex;align-items:center;height:100%}}.logo .logo-nav-link .main-logo{height:30px}@media screen and (max-width:876px){.logo .logo-nav-link .main-logo{height:24px}}@media screen and (min-width:877px){.logo .logo-nav-link .icon-menu{display:none}}.logo .logo-nav-link.product-logo{position:relative}.logo .logo-nav-link.product-logo .main-logo{position:absolute;top:0;width:100px;transform-origin:left;transform:scale(.45)translateY(0)translateZ(0);will-change:transform}.logo .logo-nav-link.product-logo .main-logo svg path{fill:var(--product-main-logo)}.logo .logo-nav-link.product-logo .icon-menu{border:1px solid var(--menu-icon-border);margin:-1px}.logo .logo-nav-link.product-logo .product-sign{flex-shrink:0;display:inline-block;width:40px;height:40px;vertical-align:middle}.logo .logo-nav-link.product-logo .product-sign svg path{fill:#fff}.logo .logo-nav-link.product-logo .product-name{text-decoration:none;font-size:30px;font-weight:300;color:var(--navbar-logo-text-color);line-height:1;margin:3px 0 0 8px;vertical-align:middle;border-bottom:1px dotted transparent}@media screen and (max-width:1080px){.logo .logo-nav-link.product-logo .product-name{font-size:26px;margin-top:1px}}@media screen and (max-width:960px){.logo .logo-nav-link.product-logo .product-name{font-size:20px}}@media screen and (max-width:876px){.logo .logo-nav-link.product-logo .icon-menu,.logo .logo-nav-link.product-logo .main-logo{display:none}}@media screen and (max-width:480px){.logo .logo-nav-link.product-logo{width:126px}.logo .logo-nav-link.product-logo .icon-menu{display:block;border-color:transparent}.logo .logo-nav-link.product-logo .product-sign{margin-left:6px}.logo .logo-nav-link.product-logo .product-name{display:none}}#navbar{--lang-select-arrow-color:rgba(255, 255, 255, .64);--lang-select-bg-color:rgba(255, 255, 255, .12)}.language-select-holder{position:relative;margin:0 -10px 0 20px}@media screen and (max-width:1024px){.language-select-holder{margin-left:8px}}@media screen and (max-width:768px){.language-select-holder{margin-left:auto}}@media screen and (min-width:877px){.mobile-arrow-nav-item{display:none}}.mobile-arrow-nav-item .nav-link{display:flex;align-items:center;flex-direction:row;justify-content:space-between;padding:22px 0;color:#212121;border-top:1px dotted rgba(0,0,0,.16)}.mobile-arrow-nav-item .icon{font-size:24px;color:rgba(0,0,0,.26);margin-right:6px}:root{--snackbar-bottom-position:20px}.common-tab-content{display:none;opacity:0}.modal{display:none;position:fixed;top:0;right:0;bottom:0;left:0;overflow:auto;z-index:1003;animation:animateTop .2s}.modal .modal-content{display:flex;flex-direction:column;background-color:#fff;border-radius:10px;box-shadow:0 2px 16px rgba(0,0,0,.38);max-width:600px;max-height:calc(100vh - 2 * 40px);margin:40px auto;color:#212121}@media screen and (max-width:640px){.modal .modal-content{margin:40px 16px}}.modal .modal-header{flex-shrink:0;display:flex;justify-content:space-between;padding:16px 32px}.modal .modal-header .modal-title{color:#212121;font-size:24px;font-weight:300;line-height:1.2;padding-top:8px;margin-bottom:0}.modal .modal-body{display:flex;flex-direction:column;flex-grow:1;overflow:auto;padding:0 32px 16px}.modal .modal-footer{flex-shrink:0;display:flex;justify-content:space-between;align-items:center;padding:16px 32px}@keyframes animateTop{0%{top:-300px;opacity:0}100%{top:0;opacity:1}}.code-editor{position:relative;display:block;font-family:fira code,monospace;font-size:13px;background-color:#fff;font-weight:400;border-radius:4px;padding:0 0 0 30px;margin-bottom:20px;box-shadow:0 1px 3px rgba(200,221,255,.6),0 4px 25px #c8ddff}@media screen and (max-width:640px){.code-editor{padding-left:15px}}@media screen and (max-width:576px){.code-editor{white-space:normal;word-wrap:break-word}}.code-editor .hide{display:none!important}.code-editor .scroll{overflow:auto;max-height:680px;padding-left:5px;margin-left:-5px}@media screen and (max-width:640px){.code-editor .scroll{padding-left:10px;margin-left:-10px}}.code-editor:before{position:absolute;content:'';top:0;left:0;background:#f0f0f0;border-right:1px solid #d0d0d0;width:30px;height:100%;border-radius:4px 0 0 4px;z-index:2}@media screen and (max-width:640px){.code-editor:before{width:15px}}.code-editor .comments{color:gray;font-weight:500;font-style:italic;white-space:nowrap}.code-editor .keyword{color:navy;font-weight:500}.code-editor .value{color:#00f;font-weight:500;background:0 0}.code-editor .variable{color:#660e7a;font-weight:500;font-style:italic}.code-editor .variable-thin{color:#660e7a}.code-editor .annotation{color:#807f17;font-weight:500}.code-editor .string{color:#397f00;font-weight:500;background-color:transparent}.code-editor.kotlin .constant{color:#4782e2}.ul-tree{position:relative;padding-left:0;margin:0}@media screen and (max-width:576px){.ul-tree{background-color:#fff}}.ul-tree ul{position:relative;margin:0;padding-left:0}.ul-tree ul:last-child{margin-bottom:0}.ul-tree .second-level,.ul-tree .third-level{padding-left:12px}.ul-tree .bordered-level{border-left:1px solid #e6e6e6}.ul-tree .comments li{line-height:20px}.ul-tree .active>.shortening{display:none}.ul-tree .active>.filling{background-color:transparent}.ul-tree .active>.left-brace,.ul-tree .active>.right-brace{margin:0}.ul-tree .filling{background-color:#ecfaeb}.ul-tree .no-shift{padding:0}.ul-tree .no-shift li{padding:0}.ul-tree .right-brace{margin-left:-8px;padding-right:1px}.ul-tree li{position:relative;list-style:none outside none;margin:0;padding-left:14px;line-height:20px;white-space:nowrap}@media screen and (max-width:640px){.ul-tree li{line-height:18px}}.ul-tree>li{padding-left:8px}@media screen and (max-width:640px){.ul-tree>li{line-height:18px}}.ul-tree .empty-line{line-height:19px}@media screen and (max-width:640px){.ul-tree .empty-line{line-height:18px}}.ul-tree.ul-tree-drop .drop{position:absolute;width:11px;height:11px;top:6px;left:-5px;background:url(/images/icons/code-collapse-controls.png)no-repeat;z-index:2}.ul-tree.ul-tree-drop .second-level .drop{top:5px;left:-25px}.ul-tree.ul-tree-drop .second-level .drop-bottom{left:-25px;bottom:6px}.ul-tree.ul-tree-drop .drop-bottom{position:absolute;display:inline-block;width:11px;height:11px;bottom:5px;left:-5px;background:url(/images/icons/code-collapse-controls.png)-22px 0 no-repeat;z-index:2}.ul-tree.ul-tree-drop .active>.drop{background-position:-11px 0}.chroma{background-color:#fff}.chroma .line{display:flex}.chroma .k{color:#00f}.chroma .kc{color:#00f}.chroma .kd{color:#00f}.chroma .nc{color:#2b91af}.chroma .s{color:#397f00;font-weight:500}.chroma .s2{color:#397f00;font-weight:500}#redirect-suggestion .modal-content{max-width:500px}#redirect-suggestion .modal-footer{gap:16px;justify-content:flex-end}@media screen and (max-width:480px){#redirect-suggestion .modal-footer{flex-direction:column;margin-bottom:16px}}#redirect-suggestion .modal-footer .btn{padding:8px 20px}#redirect-suggestion .modal-footer .btn-no{min-width:96px}.additional-field{height:0;font-size:0;line-height:0;padding:0;margin:0;border:none;overflow:hidden}.thank-you-section{display:none}.thank-you-section .thank-you-holder{max-width:460px;margin:0 auto;text-align:center}.thank-you-section .icon{font-size:64px;color:#055deb}.thank-you-section .title{font-size:30px;font-weight:700;padding-top:8px;margin-bottom:8px}:root{--hero-overlay-color:black}.jxbrowser .hero.product{background-image:url(/images/product-visuals/jxbrowser.webp)}@media screen and (max-width:768px){.jxbrowser .hero.product{background-image:url(/images/product-visuals/jxbrowser-mobile.webp)}}.hero.product{position:relative;background-position:50% 60%;background-repeat:no-repeat;background-size:cover}.hero.product:before{content:'';position:absolute;background:linear-gradient(to right,var(--hero-overlay-color) 20%,transparent 100%)no-repeat;background-size:cover;opacity:.8;width:100%;height:100%;top:0;left:0;right:0;bottom:0}@media screen and (max-width:768px){.hero.product:before{background:#000;opacity:.65}}.hero.product .page-content{color:#fff;padding-bottom:48px}.hero.product .page-content .title{font-size:30px;color:#fff;font-weight:700;margin-bottom:24px;line-height:1.3}@media screen and (max-width:960px){.hero.product .page-content .title br{content:""}.hero.product .page-content .title br:after{content:" "}}@media screen and (max-width:480px){.hero.product .page-content .title{font-size:24px}}.hero.product .page-content .mobile-product-name{font-size:40px;font-weight:300;color:#fff}@media screen and (min-width:481px){.hero.product .page-content .mobile-product-name{display:none}}.hero.product .page-content .requirements{text-shadow:0 1px 2px rgba(0,0,0,.6);margin-bottom:40px}@media screen and (max-width:480px){.hero.product .page-content .hero-btn{width:100%}}.hero.product .page-content .release-info{display:flex;flex-wrap:wrap;margin-top:40px;list-style:none;text-shadow:0 1px 2px rgba(0,0,0,.6);letter-spacing:.2px}@media screen and (max-width:640px){.hero.product .page-content .release-info{flex-direction:column}}.hero.product .page-content .release-info li{margin-right:24px;margin-top:8px}.hero.product .page-content a:not(.btn){color:#fff;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.5)}.why-product .row{display:grid;grid-template-columns:repeat(3,1fr);gap:32px 80px}@media screen and (max-width:768px){.why-product .row{grid-template-columns:1fr}}.why-product .row .why-item{position:relative}.why-product .row .why-item .icon{font-size:32px;color:#055deb}@media screen and (max-width:768px){.why-product .row .why-item .icon{position:absolute}}.why-product .row .why-item .info-block{padding-top:10px}@media screen and (max-width:768px){.why-product .row .why-item .info-block{padding-top:6px;padding-left:56px}}.why-product .row .why-item .title{font-size:18px;padding-top:0;margin-bottom:8px}@media screen and (min-width:1025px){.jxbrowser .features.bento-layout .feature-list .feature-card:first-child{grid-area:a}.jxbrowser .features.bento-layout .feature-list .feature-card:nth-child(2){grid-area:b}.jxbrowser .features.bento-layout .feature-list .feature-card:nth-child(3){grid-area:c}.jxbrowser .features.bento-layout .feature-list .feature-card:nth-child(4){grid-area:d}.jxbrowser .features.bento-layout .feature-list .feature-card:nth-child(5){grid-area:e}.jxbrowser .features.bento-layout .feature-list .feature-card:nth-child(6){grid-area:f}.jxbrowser .features.bento-layout .feature-list .feature-card:nth-child(7){grid-area:g}.jxbrowser .features.bento-layout .feature-list .feature-card:nth-child(8){grid-area:h}.jxbrowser .features.bento-layout .feature-list .feature-card:nth-child(9){grid-area:i}.jxbrowser .features.bento-layout .feature-list .feature-card:nth-child(10){grid-area:j}.jxbrowser .features.bento-layout .feature-list .feature-card:nth-child(11){grid-area:k}.jxbrowser .features.bento-layout .feature-list .feature-card:nth-child(12){grid-area:l}.jxbrowser .features.bento-layout .feature-list .feature-card:nth-child(13){grid-area:m}.jxbrowser .features.bento-layout .feature-list .feature-card:nth-child(14){grid-area:n}.jxbrowser .features.bento-layout .feature-list .feature-card:nth-child(15){grid-area:o}.jxbrowser .features.bento-layout .feature-list .feature-card:nth-child(16){grid-area:p}.jxbrowser .features.bento-layout .feature-list .feature-card:nth-child(17){grid-area:q}.jxbrowser .features.bento-layout .feature-list .feature-card:nth-child(18){grid-area:r}.jxbrowser .features.bento-layout .feature-list .feature-card:nth-child(19){grid-area:s}.jxbrowser .features.bento-layout .feature-list .feature-card:nth-child(20){grid-area:t}.jxbrowser .features.bento-layout .feature-list .feature-card:nth-child(21){grid-area:u}.jxbrowser .features.bento-layout .feature-list .feature-card:nth-child(22){grid-area:v}.jxbrowser .features.bento-layout .feature-list .feature-card:nth-child(23){grid-area:w}.jxbrowser .features.bento-layout .feature-list .feature-card:nth-child(24){grid-area:x}.jxbrowser .features.bento-layout .feature-list .feature-card:nth-child(25){grid-area:y}.jxbrowser .features.bento-layout .feature-list .feature-card:nth-child(26){grid-area:z}.jxbrowser .features.bento-layout .feature-list .feature-card:nth-child(27){grid-area:aa}.jxbrowser .features.bento-layout .feature-list .feature-card:nth-child(28){grid-area:bb}}@media screen and (min-width:1025px){.dotnetbrowser .features.bento-layout .feature-list .feature-card:first-child{grid-area:a}.dotnetbrowser .features.bento-layout .feature-list .feature-card:nth-child(2){grid-area:b}.dotnetbrowser .features.bento-layout .feature-list .feature-card:nth-child(3){grid-area:c}.dotnetbrowser .features.bento-layout .feature-list .feature-card:nth-child(4){grid-area:d}.dotnetbrowser .features.bento-layout .feature-list .feature-card:nth-child(5){grid-area:e}.dotnetbrowser .features.bento-layout .feature-list .feature-card:nth-child(6){grid-area:f}.dotnetbrowser .features.bento-layout .feature-list .feature-card:nth-child(7){grid-area:g}.dotnetbrowser .features.bento-layout .feature-list .feature-card:nth-child(8){grid-area:h}.dotnetbrowser .features.bento-layout .feature-list .feature-card:nth-child(9){grid-area:i}.dotnetbrowser .features.bento-layout .feature-list .feature-card:nth-child(10){grid-area:j}.dotnetbrowser .features.bento-layout .feature-list .feature-card:nth-child(11){grid-area:k}.dotnetbrowser .features.bento-layout .feature-list .feature-card:nth-child(12){grid-area:l}.dotnetbrowser .features.bento-layout .feature-list .feature-card:nth-child(13){grid-area:m}.dotnetbrowser .features.bento-layout .feature-list .feature-card:nth-child(14){grid-area:n}.dotnetbrowser .features.bento-layout .feature-list .feature-card:nth-child(15){grid-area:o}.dotnetbrowser .features.bento-layout .feature-list .feature-card:nth-child(16){grid-area:p}.dotnetbrowser .features.bento-layout .feature-list .feature-card:nth-child(17){grid-area:q}.dotnetbrowser .features.bento-layout .feature-list .feature-card:nth-child(18){grid-area:r}.dotnetbrowser .features.bento-layout .feature-list .feature-card:nth-child(19){grid-area:s}.dotnetbrowser .features.bento-layout .feature-list .feature-card:nth-child(20){grid-area:t}.dotnetbrowser .features.bento-layout .feature-list .feature-card:nth-child(21){grid-area:u}}.features .feature-list .feature-backdrop{position:fixed;background-color:#000;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transform:translate3d(0,0,0);top:0;right:0;bottom:0;left:0;opacity:0;z-index:1002}@media screen and (max-width:640px){.feature-card .content-container .modal-content{margin-top:16px}}.feature-card .modal-content{display:none}.feature-card .modal-content.middle-content{height:100%}.feature-card .modal-content .learn-more-btn{display:flex;float:right;margin-top:16px}@media screen and (max-width:640px){.feature-card .modal-content .learn-more-btn{margin-top:24px}}.feature-card .middle-content-holder{display:flex;flex-direction:column;height:100%}.feature-card .image-holder{display:flex;height:100%;align-items:center;padding:20px 0}@media screen and (max-width:576px){.feature-card .image-holder{height:auto}}.feature-card .feature-image{display:block;max-height:430px;margin:0 auto}.feature-card .feature-image.full-width{width:100%;-o-object-fit:cover;object-fit:cover;-o-object-position:top;object-position:top}.feature-card .feature-image.with-border-radius{border-radius:8px}.feature-card .feature-image.with-shadow{box-shadow:0 5px 14px rgba(68,101,128,.4)}.getting-help .support-plans .body .btn{display:inline-flex;justify-content:center;width:100%}@media screen and (max-width:768px){.getting-help .support-plans .body .btn{font-size:14px;padding:12px 10px}}.integration-services textarea{height:200px}.integration-services .contact-us .label{margin-top:20px;font-size:15px;color:#6a707f;text-align:center}.integration-services .contact-us .email-and-phone{display:flex;justify-content:center;align-items:center;margin:6px auto 16px;padding-right:12px}@media screen and (max-width:480px){.integration-services .contact-us .email-and-phone{flex-direction:column;padding-right:0}}.integration-services .contact-us .email-and-phone .divider{display:block;margin:0 12px;color:#b5bac7}@media screen and (max-width:480px){.integration-services .contact-us .email-and-phone .divider{display:none}}.integration-services .contact-us .email-and-phone .phone-number{white-space:nowrap}@media screen and (max-width:480px){.integration-services .contact-us .email-and-phone .phone-number{margin-top:6px}}.pricing .price-options .option-actions .btn{width:100%}.support-pricing .action .btn{width:100%}.simple-integration .common-tab-content .content-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:32px}@media screen and (max-width:860px){.simple-integration .common-tab-content .content-row{display:block;max-width:620px;margin:0 auto}.simple-integration .common-tab-content .content-row .col{margin-bottom:32px}}.simple-integration .common-tab-content .guide-button{display:flex;flex-direction:column;align-items:center;margin:40px 0 24px}.simple-integration .demo{position:relative;padding-top:56px}@media screen and (min-width:1201px){.simple-integration .demo{margin:0 32px}}.simple-integration .demo .documentation-link,.simple-integration .demo .window-link{position:absolute;font-size:14px}.simple-integration .demo .documentation-link .arrow,.simple-integration .demo .window-link .arrow{position:absolute;z-index:3}.simple-integration .demo .window-link{left:0;top:16px;color:#212121;font-style:italic;padding-bottom:1px;border-bottom:1px dotted}.simple-integration .demo .window-link .arrow{width:38px;height:44px;top:25px;left:45px}@media screen and (max-width:400px){.simple-integration .demo .window-link .arrow{left:16px}}.simple-integration .demo .documentation-link{right:0;top:40px}@media screen and (max-width:400px){.simple-integration .demo .documentation-link{left:32px;top:44px}}.simple-integration .demo .documentation-link a{font-family:fira code,monospace;padding-bottom:1px;border-bottom:1px dotted}@media(min-width:861px) and (max-width:1024px){.simple-integration .demo .documentation-link a{font-size:12px}}@media screen and (max-width:576px){.simple-integration .demo .documentation-link a{font-size:11px}}@media screen and (max-width:400px){.simple-integration .demo .documentation-link a{overflow:hidden}.simple-integration .demo .documentation-link a span{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}}.simple-integration .demo .documentation-link .arrow{width:48px;height:130px;top:25px;right:64px}.simple-integration .demo .documentation-link .tooltip-text{width:100%}.simple-integration .demo .demo-image{position:relative;border-radius:4px;overflow:hidden;margin:16px auto 0;box-shadow:0 1px 3px rgba(200,221,255,.6),0 4px 25px #c8ddff}.simple-integration .demo .demo-image:before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;background-color:transparent;z-index:1}.simple-integration .demo .demo-image .app-content,.simple-integration .demo .demo-image .app-window{position:relative;display:block;width:100%;height:auto}.simple-integration .demo .demo-image .app-content{position:absolute;top:0;left:0}.simple-integration .demo .demo-image .app-content-area,.simple-integration .demo .demo-image .app-window-area{position:absolute;left:0;width:100%;background-color:transparent;z-index:4}.simple-integration .demo .demo-image .app-window-area{top:0;height:4%}.simple-integration .demo .demo-image .app-content-area{bottom:0;height:96%}.simple-integration #compose .demo-image .app-window-area{height:4.3%}.simple-integration #compose .demo-image .app-content-area{height:95.7%}@media screen and (min-width:861px){.simple-integration #javafx .demo-image{max-height:360px}}.modal.contact-modal .modal-body{padding-bottom:32px}.modal form .form-actions{margin-top:0}.modal .thank-you-section .section-content{padding-top:20px}.teaser-html-css-javascript{--max-value-right-offset:62px;--max-axis-height:374px}@media screen and (max-width:640px){.teaser-html-css-javascript{--max-axis-height:506px}}.teaser-html-css-javascript .chart .browser-scores .system .score-line .score,.teaser-html-css-javascript .max-score-value .value{font-family:fira code,monospace;font-size:12px;font-weight:600}.teaser-html-css-javascript .chart-container{overflow-x:auto;margin-top:16px}.teaser-html-css-javascript .chart{position:relative;display:grid;grid-template-columns:1fr;row-gap:12px;padding-top:10px}@media screen and (min-width:641px){.teaser-html-css-javascript .chart{grid-template-columns:max-content minmax(120px,555px)max-content;max-width:-moz-fit-content;max-width:fit-content;row-gap:16px}}.teaser-html-css-javascript .chart .browser-name{grid-column:1;font-size:14px;color:#8f95a3;align-self:center;justify-self:end;margin-right:16px}@media screen and (max-width:640px){.teaser-html-css-javascript .chart .browser-name{justify-self:start}}.teaser-html-css-javascript .chart .browser-name.product{display:flex;align-items:center;font-weight:700;color:#212121}.teaser-html-css-javascript .chart .browser-name.product img{display:block;margin-right:6px}@media screen and (min-width:641px){.teaser-html-css-javascript .chart .browser-scores{grid-column:2/span 1}}.teaser-html-css-javascript .chart .browser-scores .system.windows{background-color:rgba(218,215,255,.2)}.teaser-html-css-javascript .chart .browser-scores .system.windows .score-line{background-color:#dad7ff}.teaser-html-css-javascript .chart .browser-scores .system.macos{background-color:rgba(154,199,255,.2)}.teaser-html-css-javascript .chart .browser-scores .system.macos .score-line{background-color:#9ac7ff}.teaser-html-css-javascript .chart .browser-scores .system.linux{background-color:rgba(186,240,241,.2)}.teaser-html-css-javascript .chart .browser-scores .system.linux .score-line{background-color:#baf0f1}.teaser-html-css-javascript .chart .browser-scores .system .score-line{display:flex;align-items:center;justify-content:flex-end;height:16px;padding-right:6px}.teaser-html-css-javascript .chart .browser-scores .system .score-line .score{color:#212121;opacity:.7}.teaser-html-css-javascript .max-score-line{position:absolute;height:var(--max-axis-height);width:1px;right:var(--max-value-right-offset);border-right:1px dashed #b5bac7}@media screen and (max-width:640px){.teaser-html-css-javascript .max-score-line{top:30px;right:0}}.teaser-html-css-javascript .max-score-value{justify-self:end}@media screen and (min-width:641px){.teaser-html-css-javascript .max-score-value{grid-column:3;grid-row:7;margin-left:-12px}}.teaser-html-css-javascript .max-score-value p{font-size:14px;color:#8f95a3}.teaser-html-css-javascript .max-score-value .value{line-height:1}.teaser-html-css-javascript .chart-info{display:flex;justify-content:space-between;margin-right:16px}@media screen and (min-width:641px){.teaser-html-css-javascript .chart-info{grid-column:2}}@media screen and (min-width:641px){.teaser-html-css-javascript .footnote{grid-column:2}.teaser-html-css-javascript .footnote p{margin-top:-8px}}.teaser-html-css-javascript .footnote p{font-size:14px;color:#8f95a3}.teaser-html-css-javascript .legend{display:flex;flex-wrap:wrap}@media screen and (max-width:640px){.teaser-html-css-javascript .legend{flex-direction:column}}.teaser-html-css-javascript .legend .item{font-size:14px;margin-right:16px}.teaser-html-css-javascript .legend .item:before{content:'';display:inline-block;width:10px;height:10px;margin-right:8px;border-radius:2px}.teaser-html-css-javascript .legend .item.windows:before{background-color:#dad7ff}.teaser-html-css-javascript .legend .item.macos:before{background-color:#9ac7ff}.teaser-html-css-javascript .legend .item.linux:before{background-color:#baf0f1}.teaser-java-javascript{display:flex;margin-top:16px}@media screen and (max-width:860px){.teaser-java-javascript{flex-direction:column}}.teaser-java-javascript .code-column{width:60%}@media screen and (max-width:860px){.teaser-java-javascript .code-column{width:100%}}.teaser-java-javascript .code-column pre code{font-size:13px;line-height:1.5;padding:14px}.teaser-java-javascript .code-column p{font-size:14px;margin-bottom:8px;color:#6a707f}.teaser-java-javascript .code-column p:not(:first-child){margin-top:12px}.teaser-java-javascript .example-column{width:40%;margin-left:24px;margin-top:29px}@media screen and (max-width:860px){.teaser-java-javascript .example-column{width:100%;margin-left:0}}.teaser-java-javascript .example-column .java-javascript-image-holder{display:flex;height:100%;align-items:center;border-radius:8px;background-color:#f8f8f8;padding:8px}@media screen and (max-width:960px){.teaser-java-javascript .example-column .java-javascript-image-holder{align-items:flex-start}}@media screen and (max-width:860px){.teaser-java-javascript .example-column .java-javascript-image-holder{justify-content:center;padding:24px 24px 8px}.teaser-java-javascript .example-column .java-javascript-image-holder img{max-width:400px;width:100%}}.teaser-java-javascript .example-column .java-javascript-image-holder img{display:block;border-radius:8px}.teaser-latest-security-updates{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;padding:20px 0}.teaser-latest-security-updates .bar-cell .bar-line .bar-score,.teaser-latest-security-updates .version-cell span{font-family:fira code,monospace;color:#212121;font-size:12px;font-weight:700;line-height:1}.teaser-latest-security-updates .chart-container{width:100%}.teaser-latest-security-updates .chart{position:relative;display:grid;grid-template-columns:min-content 1fr}.teaser-latest-security-updates .axis-names,.teaser-latest-security-updates .bar-column{display:grid;grid-template-rows:200px 36px 24px}.teaser-latest-security-updates .data{display:grid;grid-template-columns:repeat(10,1fr)}@media screen and (max-width:960px){.teaser-latest-security-updates .data{grid-template-columns:repeat(6,1fr)}}@media screen and (max-width:768px){.teaser-latest-security-updates .data{grid-template-columns:repeat(4,1fr)}}@media screen and (max-width:430px){.teaser-latest-security-updates .data{grid-template-columns:repeat(3,1fr)}}.teaser-latest-security-updates .y-axis{display:flex;align-items:center;justify-content:flex-end;border-right:1px solid #b5bac7;border-bottom:1px solid #b5bac7}.teaser-latest-security-updates .y-axis .y-label-container{position:relative;height:200px;width:24px}.teaser-latest-security-updates .y-axis .y-label-container .y-label{position:absolute;font-size:14px;color:#8f95a3;transform-origin:bottom left;transform:rotate(270deg);text-align:center;width:200px;line-height:24px;bottom:0;left:22px}.teaser-latest-security-updates .product-name{display:flex;align-items:center;padding-right:24px}@media screen and (max-width:640px){.teaser-latest-security-updates .product-name{padding-right:6px}.teaser-latest-security-updates .product-name span{display:none}}.teaser-latest-security-updates .product-name span{font-size:14px;color:#8f95a3;line-height:1;margin-left:8px}.teaser-latest-security-updates .product-name.chromium i{position:relative;font-size:22px;color:#6094ef}.teaser-latest-security-updates .bar-column:last-child .version-cell.product{border-right:inherit}@media screen and (max-width:960px){.teaser-latest-security-updates .bar-column:nth-child(-n+4){display:none}}@media screen and (max-width:768px){.teaser-latest-security-updates .bar-column:nth-child(-n+6){display:none}}@media screen and (max-width:430px){.teaser-latest-security-updates .bar-column:nth-child(-n+7){display:none}}.teaser-latest-security-updates .version-cell{display:flex;align-items:center;justify-content:flex-end;padding:0 8px;border-right:2px solid var(--product-color)}.teaser-latest-security-updates .version-cell span{text-align:right;margin-top:2px}.teaser-latest-security-updates .version-cell.product{background-color:var(--product-color);border-right:2px solid #fff}.teaser-latest-security-updates .version-cell.product span{color:#fff}.teaser-latest-security-updates .bar-cell{position:relative;display:flex;align-items:flex-end;justify-content:flex-end;width:100%;height:100%;border-bottom:1px solid #b5bac7}.teaser-latest-security-updates .bar-cell:after{content:'';position:absolute;width:2px;height:1px;right:0;bottom:-1px;background-color:#fff}.teaser-latest-security-updates .bar-cell .bar-container{min-height:16%;border-right:2px solid var(--product-color)}.teaser-latest-security-updates .bar-cell .bar-line{display:flex;justify-content:center;background-color:#9ac7ff;width:46px;height:100%;margin:0 2px}.teaser-latest-security-updates .bar-cell .bar-line .bar-score{margin-top:12px}.teaser-latest-security-updates .chart-legend{display:flex;margin-top:24px}@media screen and (max-width:400px){.teaser-latest-security-updates .chart-legend{flex-wrap:wrap}}.teaser-latest-security-updates .chart-legend .item{display:flex;font-size:14px;color:#212121}@media screen and (min-width:401px){.teaser-latest-security-updates .chart-legend .item:not(:first-child){margin-left:16px}}.teaser-latest-security-updates .chart-legend .item:before{content:'';display:inline-block;flex-shrink:0;width:12px;height:12px;margin:4px 8px 0 0;border-radius:2px}@media screen and (max-width:400px){.teaser-latest-security-updates .chart-legend .item.chromium{margin-bottom:6px}.teaser-latest-security-updates .chart-legend .item.chromium:before{margin-right:20px}}.teaser-latest-security-updates .chart-legend .item.chromium:before{background-color:#9ac7ff}.teaser-latest-security-updates .chart-legend .item.product:before{width:calc(2 * 12px);background-color:var(--product-color)}@media screen and (max-width:768px){[data-hash="#latest-security-updates"] .modal-content p br{content:""}[data-hash="#latest-security-updates"] .modal-content p br:after{content:" "}}#span-9aefcb2c.cloaked-e-mail:before{content:attr(data-domain)"\0040" attr(data-user);unicode-bidi:bidi-override;direction:rtl}
返回博客 JxBrowser vs JCEF 2022年1月11日 Vladyslav Lubenskyi
当寻找能够在 Java 中显示 HTML、执行 JavaScript 或使用 OAuth2 协议的解决方案时,我们通常会考虑一个功能完备的嵌入式浏览器。如果您决定使用 Chromium 内核, 那么您可以选择 JxBrowser 或 Java Chromium Embedded Framework(JCEF)来实现集成。
我们收集了最常见的对比要点,并为您整理了本指南。为了帮助您在这两个库之间做出选择,我们将对它们的架构、功能以及所需的集成工作量进行比较。
快速概览 JCEF JxBrowser许可证 开源 商业 API 接口 47 个借口, 60 个类 373 个接口, 126 个类 支持的 UI 工具包 Swing Swing, JavaFX, SWT, Compose Desktop 编程语言 Java Java, Kotlin Java 进程内存隔离 无 有 年发布次数 无官方发布 18 次 技术支持 无 有,保密,带服务级别协议 (SLA)。
JCEF 是一款开源且免费的工具,对于开源、低预算或学术项目来说,它可能是一个可行的解决方案。
但是,它仍然需要一定的维护成本。您的开发团队需要投入更多时间和专业知识来处理 JCEF 社区未涵盖的部分:
维护不同平台的构建基础设施。 定期构建和打包 JCEF 的新版本。 在 macOS 和 Windows 上对二进制文件进行公证和签名。 修复问题并实现新功能。 相比之下,JxBrowser 无需任何维护工作。您可以在五分钟内开始使用。该库提供了更多功能,并对所有 UI 工具包提供了原生支持。如果您缺少某个功能、发现了问题或有任何疑问,您可以随时寻求我们的帮助 。
入门 JCEF 是 JxBrowser 的开源替代品。它基于 Chromium Embedded Framework(CEF),允许您将网页浏览器嵌入到 Java Swing 桌面应用程序中。
要开始使用 JCEF,您需要自行构建它。该过程包含三个步骤:
配置环境。 编译二进制文件和 Java 类。 将所有内容打包为 JAR 文件,并添加到您的应用程序中。 JxBrowser 是一款商业专有库。要开始使用 JxBrowser,只需将一个依赖项添加到您的 Gradle 或 Maven 应用程序中。或者,您也可以下载该库,并将 JxBrowser 添加到类路径 中。
JxBrowser JAR 文件包含了所有必要的二进制文件,因此开发者无需执行任何额外操作。其中,macOS 的二进制文件已经过苹果公司的公证,Windows 的二进制文件也已经过签名。
内部结构 JxBrowser 和 JCEF 都是基于 Chromium 内核构建的。
JCEF 基于 CEF 构建,是一个知名的 C++ 框架,同时也为其他编程语言提供绑定支持。
JxBrowser 则采用内部自研解决方案来实现 Chromium 的集成。它不基于 CEF。自 2008 年以来,我们一直在开发该解决方案,同时也将其应用于 DotNetBrowser 。
支持的 UI 工具包 JCEF 提供了一个 Swing 组件。如果您使用 JavaFX 或 SWT 开发应用程序,则需借助集成桥来实现连接。具体而言,JavaFX 可利用 SwingNode
,而 SWT 则可通过 SWT_AWT
桥接器来实现。
JxBrowser 为所有主流 UI 工具包提供了原生组件,包括 JavaFX、Swing 和 SWT。您可以在我们的快速入门指南 中了解如何使用任何工具包创建简单的应用程序。
我们的客户还将 JxBrowser 应用于 Eclipse RCP 、IntelliJ IDEA 和 NetBeans 插件中。
桌面嵌入 编写一个简单的桌面应用程序,对于这两个库来说,所需的工作量是相似的。以下是一个简单的示例:
public static void main ( String [] args ) {
if (! CefApp . startup ( args )) {
System . out . println ( "Startup initialization failed!" );
return ;
}
var offscreen = false ;
var settings = new CefSettings ();
settings . windowless_rendering_enabled = false ;
var cefApp = CefApp . getInstance ( settings );
var client = cefApp . createClient ();
client . addMessageRouter ( CefMessageRouter . create ());
var url = "https://teamdev.com" ;
var transparent = false ;
var browser = client . createBrowser ( url , offscreen , transparent );
var frame = new JFrame ( "JCEF" );
frame . add ( browser . getUIComponent (), BorderLayout . CENTER );
frame . setDefaultCloseOperation ( WindowConstants . DISPOSE_ON_CLOSE );
frame . setSize ( 1280 , 900 );
frame . setVisible ( true );
}
public static void main ( String [] args ) {
var engine = Engine . newInstance ( HARDWARE_ACCELERATED );
var browser = engine . newBrowser ();
browser . navigation (). loadUrl ( "https://teamdev.com" );
SwingUtilities . invokeLater (() -> {
var view = BrowserView . newInstance ( browser );
var frame = new JFrame ( "JxBrowser" );
frame . add ( view , BorderLayout . CENTER );
frame . setDefaultCloseOperation ( WindowConstants . DISPOSE_ON_CLOSE );
frame . setSize ( 1280 , 900 );
frame . setVisible ( true );
frame . addWindowListener ( new WindowAdapter () {
@Override
public void windowClosing ( WindowEvent e ) {
engine . close ();
}
});
});
}
无头模式嵌入 如果您的应用程序在没有 UI 的情况下运行,那么 JCEF 并不适合您。JCEF 需要一个可见的 Swing UI,否则浏览器将无法完全初始化。
而使用JxBrowser,您可以创建一个功能完备的浏览器,并真正实现离屏渲染。请看以下示例:
public static void main ( String [] args ) {
try ( var engine = Engine . newInstance ( OFF_SCREEN )) {
var browser = engine . newBrowser ();
browser . resize ( 1280 , 1024 );
browser . navigation (). loadUrlAndWait ( "https://teamdev.com" );
// 浏览器已启动并运行。让我们截图并检查一下。
var bitmap = browser . bitmap ();
var image = BitmapImage . toToolkit ( bitmap );
try {
ImageIO . write ( image , "PNG" , new File ( "screenshot.png" ));
} catch ( IOException e ) {
System . out . println ( "Failed to save an image. " + e . getMessage ());
}
}
}
API 与功能 JCEF 提供了多种功能来管理 Chromium 网络、打印、下载处理等操作。
JCEF 和 JxBrowser 的 API 覆盖范围
使用 JxBrowser,您不仅可以做到与 JCEF 相同的事情,还能实现更多功能。在本节中,我们将展示 JxBrowser 提供而 JCEF 并不具备的功能。
操作 DOM 在操作 DOM 时,您可以通过一个易于理解的 Java API,充分利用浏览器的强大功能。请查看这个示例,或者阅读指南 了解更多。
// 在 DOM 树中查找节点。通过标签名称查找。
List < Element > links = document . findElementsByTagName ( "a" );
// 通过 CSS 选择器查找。
Optional < Element > logo = document . findElementByCssSelector ( "#logo" );
// 甚至可以通过 JavaScript 查找。
FormElement form = document . frame (). executeJavaScript ( "document.forms[0]" );
// 访问属性。
links . forEach ( link -> link . putAttribute ( "target" , "blank" ));
// 提交表单。
form . submit ();
// 滚动到元素位置。
logo . ifPresent ( l -> l . scrollIntoView ( BOTTOM ));
JavaScript 和 Java 之间的交互 从 Java 执行 JavaScript 代码,也可以从 JavaScript 调用 Java 方法。并享受自动类型转换 的便利。请查看以下示例,或参阅指南 。
// 从 JavaScript 中获取对象。作为字符串。
String string = frame . executeJavaScript ( "'A string literal'" );
// 作为数组。
JsArray array = frame . executeJavaScript ( "[0, 1, 2, 3, 4]" );
// 或作为通用的 JavaScript 对象。
JsObject window = frame . executeJavaScript ( "window" );
// 将任何 Java 对象传递给 JavaScript 环境。
window . putProperty ( "java" , new MyJavaObject ());
模拟用户输入 通过模拟用户交互来增强您的自动化测试和工具。请查看以下示例或参阅指南 。
var rect = buttonElement . boundingClientRect ();
var center = Point . of ( rect . x () + rect . width () / 2 , rect . y () + rect . height () / 2 );
browser . dispatch ( MousePressed . newBuilder ( location )
. button ( MouseButton . PRIMARY )
. build ());
browser . dispatch ( MouseReleased . newBuilder ( location )
. button ( MouseButton . PRIMARY )
. build ());
专有编解码器和 Widevine 默认情况下,专有技术如 H264 、HEVC 和 AAC 编解码器是禁用的,但启用它们也非常简单:
var options =
EngineOptions . newBuilder ( HARDWARE_ACCELERATED )
. enableProprietaryFeature ( ProprietaryFeature . AAC )
. enableProprietaryFeature ( ProprietaryFeature . HEVC )
. enableProprietaryFeature ( ProprietaryFeature . H_264 )
. enableProprietaryFeature ( ProprietaryFeature . WIDEVINE )
. build ();
var engine = Engine . newInstance ( options );
还有更多功能 JxBrowser 还提供了许多独有的功能,例如:
管理 Chromium 配置文件; 管理密码; 自动填充网页表单; 打印预览对话框; 开箱即用的单点登录(SSO)支持; 在离屏渲染模式下支持 <datalist>
HTML 标签; 在离屏渲染模式下支持拖放操作; WebRTC 和屏幕共享; 以及更多功能 。 架构 这两种库之间的主要架构差异在于它们的处理模型。JCEF 在 Java 进程内启动 Chromium,而 JxBrowser 则在一个独立的本地进程中启动 Chromium。
JCEF 的模型允许您更快地初始化 Chromium,但它有几大缺点:
Chromium 会消耗 Java 进程的内存和 CPU。
创建的 Chromium 实例越多,应用程序占用的资源就越多。
Chromium 中的任何崩溃都可能会导致 JVM 崩溃。
JVM 崩溃会终止 Java 应用程序,并可能导致用户数据丢失。
Java 进程容易受到 Chromium 安全漏洞的影响。
JCEF 架构
JxBrowser 在单独的进程中运行 Chromium,并通过进程间通信(IPC)与其进行通信。这样,Chromium 就不会影响 Java 进程的内存使用。
如果 Chromium 崩溃,Java 进程将继续运行。JxBrowser 甚至提供了 API 让您的应用程序能够在 Chromium 崩溃时获得通知。使您能够重新启动浏览器并恢复用户会话。
JxBrowser 架构
获取帮助 JCEF 是一个开源项目。如果您需要帮助,可以在论坛 上提问或在 bug 跟踪器中创建问题 。如果您希望添加某个功能,可以贡献 自己的力量。
JxBrowser 是一款专为商业公司打造的商业产品。我们非常重视客户体验,并提供专业的支持服务。当您联系我们的技术支持 团队时,您将直接与负责该产品开发的工程师进行沟通。
如果您发现了 bug,我们会迅速修复它,并尽快为您提供预览版本。如果缺少某个功能,我们会根据您的需求进行开发,并在后续版本中发布。
对于复杂场景和定制需求,我们可以提供高级服务 。
更新与发布周期 JxBrowser 在 2024 年发布了 16 个版本。每个版本都附带修复和改进,我们在版本发布说明 中进行了详细描述。我们会在 Chromium 正式发布后的 2-4 周内,将其升级到最新的稳定版本。这些升级包括最新的安全补丁以及已修复的漏洞。
相比之下,JCEF 没有明确的发布模式 ,开发者可以自由选择他们想要使用的特定提交版本。
发送中。。。
您的个人 JxBrowser 试用密钥和快速入门指南将在几分钟内发送至您的电子邮箱。
teamdev.cn
使用 cookie 来存储信息。您可以在我们的隐私声明 中了解更多详情。 我了解