add a simple browser based demo
Signed-off-by: hrj <harshad.rj@gmail.com>
This commit is contained in:
parent
f38d6ee191
commit
6189ffce89
|
@ -24,7 +24,8 @@ The sample CAPTCHAs are also just that, samples. They have not been tested again
|
||||||
1. Download the `jar` file from the latest release
|
1. Download the `jar` file from the latest release
|
||||||
2. Type `mkdir data/`.
|
2. Type `mkdir data/`.
|
||||||
(The data directory is used to store a config file that you can tweak, and for storing the Database)
|
(The data directory is used to store a config file that you can tweak, and for storing the Database)
|
||||||
2. Type `java -jar LibreCaptcha.jar`
|
3. Type `java -jar LibreCaptcha.jar`
|
||||||
|
4. Open [localhost:8888/demo/index.html](http://localhost:8888/demo/index.html) in browser
|
||||||
|
|
||||||
We recommend a Java 11+ runtime as that's what we compile the code with.
|
We recommend a Java 11+ runtime as that's what we compile the code with.
|
||||||
|
|
||||||
|
@ -32,6 +33,7 @@ Alternatively,
|
||||||
1. Install [sbt](https://www.scala-sbt.org/)
|
1. Install [sbt](https://www.scala-sbt.org/)
|
||||||
2. Clone this repository
|
2. Clone this repository
|
||||||
3. Type `sbt run` within the repository
|
3. Type `sbt run` within the repository
|
||||||
|
4. Open [localhost:8888/demo/index.html](http://localhost:8888/demo/index.html) in browser
|
||||||
|
|
||||||
|
|
||||||
## Quick start with Docker
|
## Quick start with Docker
|
||||||
|
@ -51,7 +53,9 @@ docker run -v lcdata:/lc-core/data librecaptcha/lc-core:latest
|
||||||
A default `config.json` is automatically created in the mounted volume.
|
A default `config.json` is automatically created in the mounted volume.
|
||||||
|
|
||||||
## Quick test
|
## Quick test
|
||||||
To test the installation, try:
|
Open [localhost:8888/demo/index.html](http://localhost:8888/demo/index.html) in browser.
|
||||||
|
|
||||||
|
Alternatively, on the command line, try:
|
||||||
|
|
||||||
```
|
```
|
||||||
> $ curl -d '{"media":"image/png","level":"easy","input_type":"text"}' localhost:8888/v1/captcha
|
> $ curl -d '{"media":"image/png","level":"easy","input_type":"text"}' localhost:8888/v1/captcha
|
||||||
|
|
|
@ -0,0 +1,69 @@
|
||||||
|
<html>
|
||||||
|
<style>
|
||||||
|
body {background-color: #e7f7f7;}
|
||||||
|
button {background-color: #b4ffff; font-size:1.66em;}
|
||||||
|
input[type=text] {font-size:1.66em;}
|
||||||
|
div.inputGroup {margin: 1em}
|
||||||
|
div.section {border: .33em solid #0b6767; margin:1em; padding: 1em}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
async function loadCaptcha() {
|
||||||
|
const levelInput = document.getElementById("levelInput").value
|
||||||
|
const mediaInput = document.getElementById("mediaInput").value
|
||||||
|
const typeInput = document.getElementById("typeInput").value
|
||||||
|
const resp = await fetch("/v1/captcha", {
|
||||||
|
method: 'POST',
|
||||||
|
body: JSON.stringify({level: levelInput, media: mediaInput, "input_type" : typeInput})
|
||||||
|
})
|
||||||
|
const respJson = await resp.json()
|
||||||
|
const id = respJson.id
|
||||||
|
const resultDiv = document.getElementById("result")
|
||||||
|
const result = `
|
||||||
|
<p>Id: ${id}</p>
|
||||||
|
<p><img src="/v1/media?id=${id}" /> </p>
|
||||||
|
<input type="text" id="answerInput" />
|
||||||
|
<button onClick="submitAnswer('${id}')">Submit</button>
|
||||||
|
<div id="answerResult" />
|
||||||
|
`
|
||||||
|
resultDiv.innerHTML = result;
|
||||||
|
}
|
||||||
|
async function submitAnswer(id) {
|
||||||
|
const ans = document.getElementById("answerInput").value;
|
||||||
|
const resp = await fetch("/v1/answer", {
|
||||||
|
method: 'POST',
|
||||||
|
body: JSON.stringify({id: id, answer: ans})
|
||||||
|
})
|
||||||
|
const respJson = await resp.json()
|
||||||
|
const resultDiv = document.getElementById("answerResult")
|
||||||
|
const result = `
|
||||||
|
<p>${JSON.stringify(respJson)}</p>
|
||||||
|
`
|
||||||
|
resultDiv.innerHTML = result;
|
||||||
|
}
|
||||||
|
|
||||||
|
</script>
|
||||||
|
<body>
|
||||||
|
<div class="section">
|
||||||
|
<div class="inputGroup">
|
||||||
|
<span>Level</span>
|
||||||
|
<input type="text" id="levelInput" value="easy"/>
|
||||||
|
</div>
|
||||||
|
<div class="inputGroup">
|
||||||
|
<span>Media</span>
|
||||||
|
<input type="text" id="mediaInput" value="image/png" />
|
||||||
|
</div>
|
||||||
|
<div class="inputGroup">
|
||||||
|
<span>Input Type</span>
|
||||||
|
<input type="text" id="typeInput" value="text" />
|
||||||
|
</div>
|
||||||
|
<div class="inputGroup">
|
||||||
|
<button onClick="loadCaptcha()">Get New CAPTCHA</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="section">
|
||||||
|
<div id="result">...</div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
|
@ -7,6 +7,8 @@ import lc.core.{Parameters, Id, Answer, Error, ByteConvert}
|
||||||
import lc.core.Config.formats
|
import lc.core.Config.formats
|
||||||
import org.limium.picoserve
|
import org.limium.picoserve
|
||||||
import org.limium.picoserve.Server.ByteResponse
|
import org.limium.picoserve.Server.ByteResponse
|
||||||
|
import scala.io.Source
|
||||||
|
import org.limium.picoserve.Server.StringResponse
|
||||||
|
|
||||||
class Server(port: Int) {
|
class Server(port: Int) {
|
||||||
val server: picoserve.Server = picoserve.Server.builder()
|
val server: picoserve.Server = picoserve.Server.builder()
|
||||||
|
@ -35,6 +37,11 @@ class Server(port: Int) {
|
||||||
val result = Captcha.checkAnswer(answer)
|
val result = Captcha.checkAnswer(answer)
|
||||||
getResponse(result)
|
getResponse(result)
|
||||||
})
|
})
|
||||||
|
.GET("/demo/index.html", (_) => {
|
||||||
|
val resStream = getClass().getResourceAsStream("/index.html")
|
||||||
|
val str = Source.fromInputStream(resStream).mkString
|
||||||
|
new StringResponse(200, str)
|
||||||
|
})
|
||||||
.build()
|
.build()
|
||||||
|
|
||||||
private def getResponse(response: Either[Error, ByteConvert]): ByteResponse = {
|
private def getResponse(response: Either[Error, ByteConvert]): ByteResponse = {
|
||||||
|
|
Loading…
Reference in New Issue