• 前后端交互实现(nginx,json,以及datatable的问题相关)


    1.同源问题解决

    首先,在同一个域下搭建网络域名访问,需要nginx软件,下载之后修改部分配置

     然后再终端下cmd  nginx.exe命令,或者打开nginx.exe文件,会运行nginx一闪而过,在后台运行而且一次是打开两个的,可以在任务管理器控制结束进程,

    接下来,你就可以打开8080接口给同域下其他主机访问你的端口。

    2.关于ajax使用json进行前后端的post问题

       刚开始,因为后端和数据库的交互,传回的data默认写出fields,然后前端我写的ajax格式里的data也想写成fields,结果发现失败,好像不太行,还有一开始以为键值对失效,以为一定要一一对应,后面改了差不多一天,跑了很久,然后问师兄,才知道是json数据格式错误,因为我们一开始以为传递的json数据是列表格式,列表里放字典,结果并不是!!!,json里应该放的是字典!!!

    格式大概如下:

    {
        url: "/staff/add/",
        status: 200,
        responseText: {
            'code': 'ok',
            'message': 'sfasdfasdfasd',
            'data': [{
                    'submit_status': 1,
                    'name': 'five',
                    'pk': 'icon five'
                },
                {
                    'submit_status': 2,
                    'name': 'six',
                    'pk': 'real six'
                },
                {
                    'submit_status': 1,
                    'name': 'two',
                    'pk': 'two B'
                }
            ],
            'errorMsg': '彩笔'
        }
    }

    所以非常的苦逼,因为中间出现的是什么jquery的length未定义问题和crsf的跨域问题,纠结半天都发现改的不是真正的问题,后面结合师兄和网上的解决办法,才知道要把后端的json数据格式确定成字典格式。

    3.还有就是datatable的问题,我又很傻逼的把同一个table给datatable了两遍,结果会发现程序并没有出错,但是会datatable格式后面那个table程序,导致前面的datatable格式失效掉,很TM难受,然后,我想再重新普及一下datatable的格式

    • l - Length changing 改变每页显示多少条数据的控件

    • f - Filtering input 即时搜索框控件

    • t - The Table 表格本身

    • i - Information 表格相关信息控件

    • p - Pagination 分页控件

    • r - pRocessing 加载等待显示信息

    比如说

     "dom": '<"top"i>rt<"bottom"flp><"clear">'

    表示,上方有表格信息显示,然后中间是表格,下面是搜索框,条数控制框,和分页控件,

    然后,你也可以通过

    'info':'true',            信息控件
    "paging": 'true',      分页控件
    "lengthChange": 'true',     每页显示多少条信息

    来改变datatable显示格式

    4.还有一个是上传文件时出现的错误,由于前后端对于文件名没有同步的错误,导致了后端把数据传过来,但是前端接受了但是没有接受想要的东西的错误,

    之前是formFile.append('excel',fileObj)导致传给后端的是fileFile对象里的excel对象,但是我们后端写接受的时候写的是data,所以出现了错误,不过修改了之后,再在下面加多一句var result=JSON.parse(result)解析result之后,前后端交互成功!!!

    前端实习第8天,加油肝!(最近的梗:说到前端我就佛了,说到佛我就不得不想起当年孙悟空大闹天空,提到佛我就不得不提起明年年初的中美合拍,文体两开花。)

     

  • 相关阅读:
    server.port 在单元测试中,调用的类或者方法这个地方获取到的端口号就会变成-1
    SpringBoot读取application.properties文件
    javaWeb 使用 filter 处理全站乱码问题
    web.xml里<filter-mapping>中的<dispatcher>作用
    SpringBoot中使用Interceptor
    精通Spring Boot
    Spring MVC之@ControllerAdvice详解
    Spring Boot 优雅的配置拦截器方式
    【Spring学习笔记-MVC-17】Spring MVC之拦截器
    C#构造方法(函数)
  • 原文地址:https://www.cnblogs.com/qq946487854/p/10163372.html
Copyright © 2020-2023  润新知