前后端分离项目问题总结

news/2025/1/11 6:51:29/

这里记录一下,我在写一个自己设计的项目时遇到的几个问题!!!

1、Session获取为null

需求:session保存验证码,在session中验证验证码是否正确

解释:

前端跨域访问后端接口, 在浏览器的安全策略下默认是不携带cookie的, 所以每次请求都开启了一次新的会话。

 解决:

前端VueCli中main.js设置:

axios.defaults.withCredentials = true;    //这行代码表示在发送 Axios 请求时,将会自动发送和接收本站设置的跨域凭证(即发送和接收包含身份凭证的请求)。

 后端配置拦截器,拦截所有请求:

public class MyInterceptor implements HandlerInterceptor {@Overridepublic boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler){response.setHeader("Access-Control-Allow-Origin",request.getHeader("Origin"));//支持跨域请求response.setHeader("Access-Control-Allow-Methods", "*");//设置允许的HTTP请求方法。通配符"*"表示允许所有的请求方法response.setHeader("Access-Control-Allow-Credentials", "true");//是否支持cookie跨域response.setHeader("Access-Control-Allow-Headers", "Authorization,Origin, X-Requested-With, Content-Type, Accept,Access-Token");//设置允许的HTTP请求头。通过设置该响应头,指定允许前端发送的请求头信息return true;}

2、上传文件过大

需求:上传一张图片和一个执行文件

解释:

利用MultipartFile对象上传文件时,SpringBoot默认会有一个大小限制。

解决: 

在application.yml文件中添加配置:

            spring:

                servlet:
                  multipart:
                    max-file-size: -1                #指定允许上传文件的最大大小,-1表示没有限制
                        max-request-size: -1    #用于设置允许的最大请求体大小,也就是整个HTTP请求的大小限制。它包括请求报头、请求行、请求体等所有的数据 

3、前端跨域问题

在npm run server执行vue脚手架项目时,所有请求都是好的。但是webpack打包后,在运行项目去请求,所有请求都失效了,在控制台报错  '跨域问题'  。

解决:

在vue.config.js文件中添加代理配置:

module.exports = {devServer: {port: 8088,proxy:{                //代理配置'/app':{           //指匹配以/app开头的路径target:'http://localhost:8888',    //代理的目标地址changeOrigin:true,    //这里设置true表示在发送请求时,将请求头中的Host字段更改为目标主机的地址pathRewrite:{        //重写路径'/app':'/'       //这里将以 /app 开头的路径重写为以 / 开头的路径}}}},publicPath:'./',outputDir:'dist',assetsDir:'assets'
}

在main.js中设置axios的基础url部分:

axios.defaults.baseURL = '/app'; 

这里注意,这里代理只支持本地开发时使用。在将整个项目放到服务器后,需要在web服务器配置后端服务的代理。否则前端页面的请求不可用!! 


http://www.ppmy.cn/news/809582.html

相关文章

申请和注销设备号的方法

一、Linux内核对设备的分类 linux的文件种类: -:普通文件 d:目录文件 p:管道文件 s:本地socket文件 l:链接文件 c:字符设备 b:块设备 Linux内核按驱动程序实现模型框架的不…

S3C2440 ARM920T CPU

S3C2440 ARM920T CPU 支持大端/小端模式。共同有8个存储器BANK,每个BANK为128M。BANK0~BANK6为固定起始地址。BANK7可编程BANK起始地址和大小,其开始地址是BANK6的结束地址,灵活可变。BANK0~BANK5用于ROM或者SRAM,BANK6、BANK7用…

linux驱动38:后备高速缓存

设备驱动程序常常会反复地分配同一大小的内存块&#xff0c;为这些反复使用的内存块增加某些特殊的内存池——后备高速缓存。 linux内核的高速缓存管理称为slab分配器&#xff0c;头文件<linux/slab.h>&#xff0c;类型struct kmem_cache。 一、api接口&#xff1a; 1…

socket简介及java实例

网络上的两个程序通过一个双向的通信连接实现数据的交换&#xff0c;这个连接的一端称为一个socket。 建立网络通信连接至少要一对端口号(socket)。socket本质是编程接口(API)&#xff0c;对TCP/IP的封装&#xff0c;TCP/IP也要提供可供程序员做网络开发所用的接口&#xff0c;…

三星ARM9以上芯片(244X,6410等)和cortex-a8芯片(S5PV210)比较PK

贴2张图&#xff0c;一看便明了&#xff1a;&#xff08;s5pv210开发技术交流群&#xff1a;8334819&#xff09; KEY FEATURES OF S5PV210 The key features of S5PV210 include: •ARM CortexTM-A8 based CPU Subsystem with NEON −32/ 32 KB I/D Cache, 512 KB L2 Cache −…

关于S3C6400 DM9000a 驱动

平台&#xff1a;S3C6400Ethernet :DM9000a由于是A公司的BSP&#xff0c;改了网卡的片选&#xff0c;发现可以找到ID&#xff0c;但是就是ping失败。厂家的帮忙 &#xff0c;加上了一些debug信息&#xff0c;最后发现应该是SROM的设置不对&#xff0c;发的数据高位都没有了。A公…

s3c2440 RTC(实时时钟) 驱动移植

———————————————————————————————————————主机操作系统&#xff1a;Centos 6.7交叉编译器环境&#xff1a;arm-linux-gcc-4.5.4 开发板平台&#xff1a; FL2440 Linux内核版本&#xff1a; linux-3.0 开发模块&#xff1a; RTC&#xf…

MSP430F149程序移植——0.96OLED(ssd1306驱动)

链接&#xff1a;https://pan.baidu.com/s/1ov-lE3sD2nMpV33Q9E7omw 提取码&#xff1a;2333 一、引脚说明 1.1 接口定义 引脚功能说明GND电源地VCC电源正 3.3~5VD0SPI接口时为SPI时钟线&#xff0c;IIC接口时为IIC时钟线D1SPI接口时为SPI数据线&#xff0c;IIC接口时为IIC数…