uniapp H5前端访问SSM框架的后台跨域问题

什么是跨域?
跨域是指一个域下的脚本试图去请求另一个域下的资源。
造成跨域的原因?
由于H5前端测试时启动地址是localhost:8081,SSM框架ip地址是localhost:8080。端口不同,产生了跨域问题。
解决方法:

先配置uniapp的manifest.json
uniapp H5前端访问SSM框架的后台跨域问题
配置SSM后端
1.maven项目,在pom.xml中配置下

 <!-- 跨域过滤器相关 -->
        <dependency>
        <groupId>com.thetransactioncompany</groupId>
       <artifactId>java-property-utils</artifactId>
       <version>1.9.1</version>
        </dependency>

        <dependency>
        <groupId>com.google.code.gson</groupId>
        <artifactId>gson</artifactId>
        <version>2.6.2</version>
        </dependency>

        <dependency>
            <groupId>com.thetransactioncompany</groupId>
            <artifactId>cors-filter</artifactId>
            <version>1.7.1</version>
        </dependency>

2.打开webapp下WEB-INF中的web.xml,在web.xml的在web-app标签下添加如下代码

<filter>
      <filter-name>CORS</filter-name>
      <filter-class>com.thetransactioncompany.cors.CORSFilter</filter-class>
      <init-param>
        <param-name>cors.allowOrigin</param-name>
          <param-value>*</param-value>
      </init-param>
      <init-param>
        <param-name>cors.supportedMethods</param-name>
          <param-value>GET, POST, HEAD, PUT, DELETE</param-value>
      </init-param>
      <init-param>
        <param-name>cors.supportedHeaders</param-name>
          <param-value>Accept, Origin, X-Requested-With, Content-Type, Last-Modified</param-value>
      </init-param>
      <init-param>
          <param-name>cors.exposedHeaders</param-name>
          <param-value>Set-Cookie</param-value>
      </init-param>
      <init-param>
          <param-name>cors.supportsCredentials</param-name>
          <param-value>true</param-value>
      </init-param>
  </filter>

  <filter-mapping>
      <filter-name>CORS</filter-name>
      <url-pattern>/*</url-pattern>
  </filter-mapping>

3.编译代码部署到Tomcat,重启Tomcat即可。

上一篇:Fiddler跨域调试及Django跨域处理


下一篇:浏览器跨域常用解决方案总结