我使用 localStorage.setItem('token', jwt);,来存放jwt令牌,怎么在springboot项目中的static资源中编写js代码实现每次访问某一个页面时都带有jwt令牌,这样可以被springboot后端的拦截器拦截,获取每次请求头中的jwt令牌,,整体的代码和请求要怎么写,分别放在那些文件里
时间: 2024-02-19 09:02:39 浏览: 142
jwt-token-Request:当发送任何其他api请求时,然后使用jwt令牌发送
要在Spring Boot项目中的static资源中编写JS代码实现每次访问某一个页面时都携带JWT令牌,可以在JavaScript代码中设置请求头。具体代码实现如下:
1. 在JavaScript代码中获取JWT令牌:
```javascript
const token = localStorage.getItem('token');
```
2. 在发送请求时设置请求头:
```javascript
const xhr = new XMLHttpRequest();
xhr.open('GET', '/api/profile');
xhr.setRequestHeader('Authorization', `Bearer ${token}`);
xhr.send();
```
3. 在后端拦截器中获取请求头中的JWT令牌:
```java
public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) throws Exception {
String token = request.getHeader("Authorization").replace("Bearer ", "");
// 进行JWT令牌的验证和解析
// ...
}
```
4. 完整的代码实现如下:
在static/js/main.js中:
```javascript
const token = localStorage.getItem('token');
const xhr = new XMLHttpRequest();
xhr.open('GET', '/api/profile');
xhr.setRequestHeader('Authorization', `Bearer ${token}`);
xhr.onreadystatechange = function() {
if (xhr.readyState === XMLHttpRequest.DONE) {
if (xhr.status === 200) {
console.log(xhr.responseText);
} else {
console.error(xhr.statusText);
}
}
};
xhr.send();
```
在后端的拦截器中:
```java
public class JwtInterceptor implements HandlerInterceptor {
@Override
public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) throws Exception {
String token = request.getHeader("Authorization").replace("Bearer ", "");
// 进行JWT令牌的验证和解析
// ...
return true;
}
}
```
在Spring Boot的配置类中添加拦截器:
```java
@Configuration
public class WebConfig implements WebMvcConfigurer {
@Override
public void addInterceptors(InterceptorRegistry registry) {
registry.addInterceptor(new JwtInterceptor())
.addPathPatterns("/api/**") // 拦截/api开头的请求
.excludePathPatterns("/api/login"); // 排除/api/login请求
}
}
```
这样,在访问/static/js/main.js时,会自动携带JWT令牌。在后端可以通过拦截器获取请求头中的JWT令牌,并进行验证和解析。
阅读全文