Issue
I am trying to setup a local server for API-callback using ktor under localhost:8080. The purpose of this server is to:
- Get the API response code from the URL parameters
- Serve a webpage under the same URL that shows the user the state of the callback
Currently i have this code:
fun Application.configureRouting() {
staticResources(remotePath = "/callback", basePackage = "static") {
enableAutoHeadResponse()
get {
val params: Parameters = call.parameters
val requestState = AuthState(params["state"]!!)
if (!AuthState.currentlyUsedStates.contains(requestState))
throw Exception("Request Cancelled, State forgery was detected.")
val response = AuthorizationResponse
val responseData = response.data
responseData.state = params["state"]!!
if (params.contains("code"))
responseData.code = params["code"]
if (params.contains("error"))
responseData.error = params["error"]
response.save()
requestState.remove()
}
}
}
File structure:
projectRoot
└── src/
└── main/
└── resources/
└── static/
├── css/
│ ├── style.css
│ ├── light.css
│ └── dark.css
├── js/
│ ├── theme.js
│ └── main.js
└── index.html
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/dark.css">
<link rel="stylesheet" href="css/light.css">
<title>Callback</title>
</head>
<body>
<!-- Website layout and stuff -->
</body>
<script src="js/theme.js"></script>
<script src="js/callback.js"></script>
</html>
Now my problem is that neither the stylesheets linked in the <head> nor the scripts referenced by the src attribute are actually served to the user when requesting the page, resulting in the bare-bones unstyled HTML look. So how do I automatically send them along the index.html?
I have read through old stackoverflow questions and articles but all of them seem to be very outdated and using deprecated methods.
Solution
Sooo, appearently the fix was really simple. I just had to change the link to the files from a relative link to a static link.
Like this:
before.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/dark.css">
<link rel="stylesheet" href="css/light.css">
<title>Callback</title>
</head>
<body>
<!-- Website layout and stuff -->
</body>
<script src="js/theme.js"></script>
<script src="js/callback.js"></script>
</html>
after.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="http://localhost:8080/callback/css/style.css">
<link rel="stylesheet" href="http://localhost:8080/callback/css/dark.css">
<link rel="stylesheet" href="http://localhost:8080/callback/css/light.css">
<title>Callback</title>
</head>
<body>
<!-- Website layout and stuff -->
</body>
<script src="http://localhost:8080/callback/js/theme.js"></script>
<script src="http://localhost:8080/callback/js/callback.js"></script>
</html>
Or in more general:
./subfolder/file.ext
had to turn into
http://localhost:8080/callback/subfolder/file.ext
Answered By - Lolmerkat
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.