Home > Backend Development > PHP Tutorial > Ajax cross-domain access,? ? Data confusion? ? .

Ajax cross-domain access,? ? Data confusion? ? .

WBOY
Release: 2016-09-08 08:43:55
Original
872 people have browsed it

我也无法描述清楚,直接上代码吧

根据id获取文章

<code class="js">/api/article/getOne?id=' + id</code>
Copy after login
Copy after login

数据

<code class="json">{
  "code": 200,
  "data": {
    "id": "17",
    "cateId": "2",
    "name": "视频",
    "studioId": "2",
    "title": "wegwg网服务范围",
    "content": "&lt;p&gt;&lt;b&gt;gw3g3wg3wg&lt;/b&gt;&lt;/p&gt;&lt;p&gt;&lt;b&gt;3wgf&lt;/b&gt;&lt;/p&gt;&lt;p&gt;&lt;b&gt;gf3wg&lt;/b&gt;&lt;/p&gt;",
    "createdAt": "2016-09-06 16:18:05"
  }
}</code>
Copy after login
Copy after login

获取所有文章分类

<code class="js">/api/category/get</code>
Copy after login
Copy after login

数据

<code>{
  "code": 200,
  "data": [
    {
      "id": "1",
      "name": "推荐"
    },
    {
      "id": "2",
      "name": "视频"
    },
    {
      "id": "3",
      "name": "瘦身"
    },
    {
      "id": "4",
      "name": "隐私"
    }
  ]
}</code>
Copy after login
Copy after login

上面的接口单独调用正常,问题出现在下面。应用的场景是:载入编辑页面时,调用接口,获得数据填充到页面。

Ajax cross-domain access,? ? Data confusion? ? .

页面真实代码

<code class="js">//编辑文章,载入页面时,获取编辑数据并填充页面
            $.ajax({
                url: '/api/article/getOne?id=' + id, //获取某条文章的信息
                type: 'get',
                dataType: 'json',
                beforeSend: function () {
                    $('#show_load').show();
                },
                success: function (article) {
                    console.log(article);
                    if (article.code != 200) return false;
                    $('#title').val(article.data.title); //文章标题
                    const content = htmlspecialchars_decode(article.data.content);
                    $('#summernote').summernote('code', content); //文章内容
                    $.ajax({
                        url: '/api/category/get', //获取所有分类
                        type: 'get',
                        dataType: 'json',
                        beforeSend: function () {
                            $('#show_load').show();
                        },
                        success: function (categorys) {
                            console.log(categorys); //问题出现在这里,打印出来的id全部为
                            if (categorys.code != 200) return false;
                            $('#categoryId').empty();
                            $('#categoryId').append(`<option value="0">请选择分类</option>`);
                            categorys.data.forEach(function (v) {
                                if(v.id = article.data.cateId){
                                    $('#categoryId').append(`<option value="${v.id}" selected>${v.name}</option>`)
                                }else{
                                    $('#categoryId').append(`<option value="${v.id}">${v.name}</option>`)
                                }
                            })

                        },
                        complete: function () {
                            $('#show_load').hide();
                        }
                    });

                },
                complete: function () {
                    $('#show_load').hide();
                }
            });</code>
Copy after login
Copy after login

这时打印出来的数据如下:所有分类id全部变成“1”了。原来的文章分类id也确实是“1”。但是这里全部都变成1了,到底怎么回事?

Ajax cross-domain access,? ? Data confusion? ? .

<code>{
  "code": 200,
  "data": [
    {
      "id": "1",
      "name": "推荐"
    },
    {
      "id": "1",
      "name": "视频"
    },
    {
      "id": "1",
      "name": "瘦身"
    },
    {
      "id": "1",
      "name": "隐私"
    }
  ]
}</code>
Copy after login
Copy after login

之前这样写是可以正常工作的。但是今天不知道为什么变成这样了。迷茫了,^$^。

回复内容:

我也无法描述清楚,直接上代码吧

根据id获取文章

<code class="js">/api/article/getOne?id=' + id</code>
Copy after login
Copy after login

数据

<code class="json">{
  "code": 200,
  "data": {
    "id": "17",
    "cateId": "2",
    "name": "视频",
    "studioId": "2",
    "title": "wegwg网服务范围",
    "content": "&lt;p&gt;&lt;b&gt;gw3g3wg3wg&lt;/b&gt;&lt;/p&gt;&lt;p&gt;&lt;b&gt;3wgf&lt;/b&gt;&lt;/p&gt;&lt;p&gt;&lt;b&gt;gf3wg&lt;/b&gt;&lt;/p&gt;",
    "createdAt": "2016-09-06 16:18:05"
  }
}</code>
Copy after login
Copy after login

获取所有文章分类

<code class="js">/api/category/get</code>
Copy after login
Copy after login

数据

<code>{
  "code": 200,
  "data": [
    {
      "id": "1",
      "name": "推荐"
    },
    {
      "id": "2",
      "name": "视频"
    },
    {
      "id": "3",
      "name": "瘦身"
    },
    {
      "id": "4",
      "name": "隐私"
    }
  ]
}</code>
Copy after login
Copy after login

上面的接口单独调用正常,问题出现在下面。应用的场景是:载入编辑页面时,调用接口,获得数据填充到页面。

Ajax cross-domain access,? ? Data confusion? ? .

页面真实代码

<code class="js">//编辑文章,载入页面时,获取编辑数据并填充页面
            $.ajax({
                url: '/api/article/getOne?id=' + id, //获取某条文章的信息
                type: 'get',
                dataType: 'json',
                beforeSend: function () {
                    $('#show_load').show();
                },
                success: function (article) {
                    console.log(article);
                    if (article.code != 200) return false;
                    $('#title').val(article.data.title); //文章标题
                    const content = htmlspecialchars_decode(article.data.content);
                    $('#summernote').summernote('code', content); //文章内容
                    $.ajax({
                        url: '/api/category/get', //获取所有分类
                        type: 'get',
                        dataType: 'json',
                        beforeSend: function () {
                            $('#show_load').show();
                        },
                        success: function (categorys) {
                            console.log(categorys); //问题出现在这里,打印出来的id全部为
                            if (categorys.code != 200) return false;
                            $('#categoryId').empty();
                            $('#categoryId').append(`<option value="0">请选择分类</option>`);
                            categorys.data.forEach(function (v) {
                                if(v.id = article.data.cateId){
                                    $('#categoryId').append(`<option value="${v.id}" selected>${v.name}</option>`)
                                }else{
                                    $('#categoryId').append(`<option value="${v.id}">${v.name}</option>`)
                                }
                            })

                        },
                        complete: function () {
                            $('#show_load').hide();
                        }
                    });

                },
                complete: function () {
                    $('#show_load').hide();
                }
            });</code>
Copy after login
Copy after login

这时打印出来的数据如下:所有分类id全部变成“1”了。原来的文章分类id也确实是“1”。但是这里全部都变成1了,到底怎么回事?

Ajax cross-domain access,? ? Data confusion? ? .

<code>{
  "code": 200,
  "data": [
    {
      "id": "1",
      "name": "推荐"
    },
    {
      "id": "1",
      "name": "视频"
    },
    {
      "id": "1",
      "name": "瘦身"
    },
    {
      "id": "1",
      "name": "隐私"
    }
  ]
}</code>
Copy after login
Copy after login

之前这样写是可以正常工作的。但是今天不知道为什么变成这样了。迷茫了,^$^。

/api/category/get 这个获取所有分类的链接,你重新确认下(试着直接在浏览器中直接放上这个链接,看输出的内容是否id都为1,我看一般全都是1,像这种问题基本上可以被认为是后台获取分类的代码出错...)

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template