Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Ajax headers 设置不生效 #533

Closed
iUUCoder opened this issue Apr 12, 2022 · 2 comments
Closed

Ajax headers 设置不生效 #533

iUUCoder opened this issue Apr 12, 2022 · 2 comments
Labels
Done

Comments

@iUUCoder
Copy link

vConsole Version: 3.14

从 3.14 开始，vConsole 改用了 Proxy 来实现 XHR 代理，导致 XHR 请求 header 设置不生效。

示例代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>vConsole issues demo</title>
    <script src="https://unpkg.com/vconsole@3.14.5/dist/vconsole.min.js"></script>
    <script>
        // VConsole will be exported to `window.VConsole` by default.
        var vConsole = new window.VConsole();
    </script>
    <script src="https://zeptojs.com/zepto.min.js"></script>
</head>
<body>
    <button id="send-button">发送请求</button>

    <script>
        $('#send-button').on('click', function () {
            $.ajax({
                url: 'http://localhost:3000',
                type: 'GET',
                headers: {
                    'demo-field': 'Hello World'
                },
                success: function (data) {
                    // dosomething
                }
            });
        });
    </script>
</body>
</html>

示例代码效果：
image
Maizify added a commit that referenced this issue Apr 14, 2022
@Maizify
Fix(Network): Fix missing Request Headers when xhr.setRequestHeader…
87f3cd4 
… is overwritten. (issue #533)
@Maizify
Copy link
Collaborator

Maizify commented Apr 14, 2022

感谢反馈。
这是一个 proxy 引起的时序问题。
Zepto 先是用自定义的 setHeader() 覆盖了 setRequestHeader() 方法，在处理完自己的 set headers 逻辑后，再调用原先的 setRequestHeader 方法。
但由于 setRequestHeader 是被 vConsole proxy 过的，内部通过 Reflect.get() 来获取原始的函数，此时便获取到了 Zepto 的 setHeader()，导致从头到尾没有调用到原生的 setRequestHeader() 方法。
这里做了下调整，确保在 setRequestHeader() 内部可以调用到原生方法。

@Maizify Maizify added the Done label Apr 14, 2022
@Maizify
Copy link
Collaborator

Maizify commented Apr 14, 2022

已在3.14.6中发布。

@Maizify Maizify closed this as completed Apr 14, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
Done
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@Maizify @iUUCoder