Vaadin 14 生产模式和 Safari 问题答案

【问题标题】：Vaadin 14 production mode and Safari issueVaadin 14 生产模式和 Safari 问题
【发布时间】：2020-10-06 09:44:32
【问题描述】：

我最近将我的应用程序切换到 Vaadin 14 本机 NPM（非兼容模式）和生产模式。 Vaadin 版本是 14.3.7。这是一个使用 Gradle 打包为可执行 .war 文件的 Spring Boot 应用程序。我正在使用 Vaadin Gradle 插件。

一切正常，除了在应用程序不可用的 Safari (iOS + Mac) 中。在 Mac 上可以看到以下错误：

TypeError: 'text/html' is not a valid JavaScript MIME type.

我发现消息来源说 ES6 模块可能会在 Safari 上导致此错误，但我认为 Vaadin 默认会在生产模式下转换为 ES5。

我该怎么做才能让 Safari 也能正常工作？

更新 build.gradle 文件中的一些相关部分：

plugins {
    ...
    id 'com.vaadin' version '0.8.0'
}

ext{
    ...
    set('vaadinVersion', "14.3.7")
}

dependencies {
    ...
    implementation('com.vaadin:vaadin-spring-boot-starter') {
        ["com.vaadin.webjar", "org.webjars.bowergithub.insites",
         "org.webjars.bowergithub.polymer", "org.webjars.bowergithub.polymerelements",
         "org.webjars.bowergithub.vaadin", "org.webjars.bowergithub.webcomponents"]
                .forEach { group -> exclude(group: group) }
    }
    ...
}

vaadin {
    optimizeBundle = true
    pnpmEnable = true
    productionMode = true
}

【问题讨论】：

你能分享你的 pom.xml 吗？
@ollitietavainen 我正在使用 Gradle，将分享一些相关的部分
你有'战争'插件吗？
@ollitietavainen 是的，war 插件已启用
在原始问题中可能也值得一提。

标签： gradle safari vaadin vaadin-flow vaadin14

【解决方案1】：

原来是由以下几种原因共同造成的：

该应用程序的前端是一个 Apache 服务器，该服务器在未登录时会重定向到 SSO。
Vaadin 将包作为 ES6 模块加载。
Safari 在加载 ES6 模块时不发送 cookie，除非添加了 crossorigin="use-credentials"。
Vaadin 只添加了crossorigin，而不是crossorigin="use-credentials"（这可以被认为是一个错误，因为他们正式支持 Safari）。

有关详细信息，请参阅 https://jakearchibald.com/2017/es-modules-in-browsers/、https://stackoverflow.com/a/52559612/775138 以及 John Meinken 的评论。

我们通过将 Apache 配置为不保护包的路径来解决此问题。

【讨论】：