后端有解决跨域,前端也带了token。
问题:
@RestController
@RequestMapping("/api/user")
@CrossOrigin
public class EmployeesController {
@Autowired
private EmployeesService employeesService;
@ApiOperation("查询全部")
@GetMapping("all")
public Result queryAll(){
List<Employees> employeeList = employeesService.list();
return Result.ok(employeeList);
}
```javascript
request.interceptors.request.use(
(config) => {
config.headers["Content-Type"] = "application/json";
if (mainStore.localuser.token) {
config.headers["token"] = mainStore.localuser.token;
}
return config;
},
(error) => {
return Promise.reject(error);
}
);
用nginx或者apache反向代理吧
可以使用nginx作为转发,把前端和后台的转发都配置到一个端口,通过url前缀进行区分
token是服务端生成的一串字符串,以作客户端进行请求的一个令牌,
它相当于数据的id,给与数据一个唯一的标识,它的出现主要目的是解决服务器频繁请求用户姓名以及密码的问题;
它的作用是减轻服务器的压力,减少频繁的查询数据库,使服务器更加健壮。
// 请求登录接口并传递参数
this.$ClientAPI
.loginGetToken(obj)
.then((res) => {
console.log(res.data.data);
var token = res.data.data.remember_token; //读取token
var mobile = res.data.data.mobile;
localStorage.setItem("mobile", mobile);
localStorage.setItem("token", token); //保存token
localStorage.setItem("value", "admin");
Toast.success({
message: "登录成功",
position: "top",
});
this.$router.push("/mine"); //跳转到我的页面
})
.catch((err) => {
console.log(err);
Toast.fail({
message: "登录失败",
position: "top",
});
});