Spring Boot интерпретирует путь к pgn-файлу как URL. Как я могу это исправить, чтобы он мог загрузить изображение? - PullRequest
0 голосов
/ 07 апреля 2020

Я создаю шахматное веб-приложение, используя Spring Boot и Thymeleaf в качестве личного проекта для проверки своих навыков. Я использую библиотеку, Шахматная доска. js, чтобы сделать шахматную доску для меня. Загруженный zip-файл поставляется со всеми javascript и изображениями, а что нет, и вы просто добавляете файлы в свой проект и загружаете js на страницу html.

Проблема в том, что когда шахматная доска . js пытается загрузить файлы pgn по пути img/chesspieces/wikipedia/{piece}.png. Spring будет добавлять путь к localhost: 8080 как localhost:8080/img/chesspieces/wikipedia/{piece}.png вместо получения папки images. Вот снимок экрана окна инструментов разработчика в браузере. Developer tools window in browser Я абсолютно не знаю, как настроить что-то подобное, хотя это и возможно, так как загрузка изображений, хранящихся в папке проекта, довольно стандартная вещь. В любом случае, здесь мой код с первым блоком javascript:

 function expandConfig (config) {
// default for orientation is white
if (config.orientation !== 'black') config.orientation = 'white'

// default for showNotation is true
if (config.showNotation !== false) config.showNotation = true

// default for draggable is false
if (config.draggable !== true) config.draggable = false

// default for dropOffBoard is 'snapback'
if (config.dropOffBoard !== 'trash') config.dropOffBoard = 'snapback'

// default for sparePieces is false
if (config.sparePieces !== true) config.sparePieces = false

// draggable must be true if sparePieces is enabled
if (config.sparePieces) config.draggable = true

// HERE IS THE PROBLEMATIC CODE!!
if (!config.hasOwnProperty('pieceTheme') ||
    (!isString(config.pieceTheme) && !isFunction(config.pieceTheme))) {
  config.pieceTheme = 'img/chesspieces/wikipedia/{piece}.png'
}

// animation speeds
if (!validAnimationSpeed(config.appearSpeed)) config.appearSpeed = DEFAULT_APPEAR_SPEED
if (!validAnimationSpeed(config.moveSpeed)) config.moveSpeed = DEFAULT_MOVE_SPEED
if (!validAnimationSpeed(config.snapbackSpeed)) config.snapbackSpeed = DEFAULT_SNAPBACK_SPEED
if (!validAnimationSpeed(config.snapSpeed)) config.snapSpeed = DEFAULT_SNAP_SPEED
if (!validAnimationSpeed(config.trashSpeed)) config.trashSpeed = DEFAULT_TRASH_SPEED

// throttle rate
if (!validThrottleRate(config.dragThrottleRate)) config.dragThrottleRate = DEFAULT_DRAG_THROTTLE_RATE

return config

}

Структура проекта: (Я знаю, что это не говорит, но мой HTML Файл находится в «каталоге src / resources / templates».

C:.
├───.idea
│   ├───codeStyles
│   └───libraries
├───.mvn
│   └───wrapper
├───src
│   ├───main
│   │   ├───java
│   │   │   └───com
│   │   │       └───chessapp
│   │   │           └───chess
│   │   │               └───controller
│   │   └───resources
│   │       ├───static
│   │       │   └───javascript
│   │       │       └───chessboardjs
│   │       │           ├───css
│   │       │           ├───img
│   │       │           │   └───chesspieces
│   │       │           │       └───wikipedia
│   │       │           └───js
│   │       └───templates
│   └───test
│       └───java
│           └───com
│               └───chessapp
│                   └───chess
└───target

и HTML

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" th:href="@{/css/test.css}">
    <script src="https://code.jquery.com/jquery-3.4.1.min.js"
            integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
            crossorigin="anonymous"></script>
    <script th:src="@{/javascript/chessboardjs/js/chessboard-1.0.0.min.js}"></script>


<!--    <script src="/static/javascript/chessboard-init.js"></script>-->
</head>
<body>
<h1>Hello World!</h1>

<div id="board1" style="width: 400px"></div>


</body>
<script>
  var board1 = ChessBoard('board1', 'start')
</script>
</html>

Спасибо за помощь!

...