1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
|
//! Run with
//!
//! ```not_rust
//! cargo run -p example-cors
//! ```
use axum::{
http::{HeaderValue, Method},
response::{Html, IntoResponse},
routing::get,
Json, Router,
};
use std::net::SocketAddr;
use tower_http::cors::CorsLayer;
#[tokio::main]
async fn main() {
let frontend = async {
let app = Router::new().route("/", get(html));
serve(app, 3000).await;
};
let backend = async {
let app = Router::new().route("/json", get(json)).layer(
// see https://docs.rs/tower-http/latest/tower_http/cors/index.html
// for more details
//
// pay attention that for some request types like posting content-type: application/json
// it is required to add ".allow_headers([http::header::CONTENT_TYPE])"
// or see this issue https://github.com/tokio-rs/axum/issues/849
CorsLayer::new()
.allow_origin("http://localhost:3000".parse::<HeaderValue>().unwrap())
.allow_methods([Method::GET]),
);
serve(app, 4000).await;
};
tokio::join!(frontend, backend);
}
async fn serve(app: Router, port: u16) {
let addr = SocketAddr::from(([127, 0, 0, 1], port));
let listener = tokio::net::TcpListener::bind(addr).await.unwrap();
axum::serve(listener, app).await.unwrap();
}
async fn html() -> impl IntoResponse {
Html(
r#"
<script>
fetch('http://localhost:4000/json')
.then(response => response.json())
.then(data => console.log(data));
</script>
"#,
)
}
async fn json() -> impl IntoResponse {
Json(vec!["one", "two", "three"])
}
|
